패키지, 저장소 및 앱 카테고리 검색

패키지 상세v1.0.2

drop_zone

Flutter 웹에 드래그 앤 드롭을 간단하게 도입하는 방법입니다. drop_zone은 일반적으로 지정된 위젯 위에 파일을 드래그하여 놓음으로써 파일 선택에 사용됩니다. 사용자는 드롭된 HTML 파일을 사용할 수 있습니다.

Web
30일 다운로드
2.5천
좋아요
46
Pub 점수
120

패키지 설치

flutter pub add drop_zone

패키지 개요

공개 정보를 바탕으로 생성한 선택 가이드입니다.

drop_zone은 드래그 앤 드롭 기능을 간소화하는 Flutter 웹 패키지로, 사용자가 지정된 위젯에 파일을 끌어다 놓아서 파일을 선택할 수 있도록 합니다. Flutter의 웹 플랫폼과 원활하게 통합되어 드롭된 HTML 파일을 캡처하여 추가 처리할 수 있게 해줍니다. 파일 업로드 인터페이스에 적합하며 직관적인 제스처를 통해 사용자 경험을 향상시킵니다. 이 패키지는 가볍고 추가적인 복잡성 없이 핵심 드래그 앤 드롭 동작에 집중하고 있습니다.

사용 사례

  • 드래그 앤 드롭을 통한 파일 업로드
  • 웹 기반 문서 가져오기
  • 인터랙티브 파일 선택 인터페이스
  • 웹 앱을 위한 향상된 사용자 입력
  • 양식 내 드래그 앤 드롭 업로드 위젯

주요 기능

  • 간단한 드래그 앤 드롭 통합
  • 여러 파일 드롭을 지원합니다
  • HTML File 객체와 함께 작동
  • 경량이고 집중된
  • Flutter 웹을 위한 것

적합한 대상

  • 파일 입력이 필요한 웹 애플리케이션
  • 파일 업로드 기능을 구축하는 개발자
  • 제스처 기반 상호작용을 요구하는 UI
  • 웹 전용으로 플러터를 사용하는 프로젝트
  • 직관적인 파일 선택을 목표로 하는 앱

고려 사항

  • 웹 플랫폼에서만 사용 가능
  • 모바일 드래그 앤 드롭을 지원하지 않습니다
  • 파일 데이터를 수동으로 처리해야 합니다
  • 파일 드래그에 한정되며, 사용자 정의 드래그 유형은 지원되지 않습니다
  • 내장 파일 미리보기 또는 검증 없음

원본 README

연결된 소스 저장소의 README 원문 스냅샷입니다. 최신 내용은 저장소에서 확인하세요.

drop_zone

pub package License: MIT

A simple way to bring drag’n’drop to flutter web.

drop_zone is commonly used for file choosing by dragging and dropping a file(s) onto a designated widget. The user can then use the dropped html file(s).

Example

An example can be found in the example directory of this repository.

How to use

Add drop_zone to pubspec.yaml of your project:

dependencies:
  drop_zone: ^1.0.2

Add necessary imports and wrap any widget with DropZone() to use it as a dropzone:

import 'package:drop_zone/drop_zone.dart';
import 'dart:html' as html;

DropZone(
    onDragEnter: () {
        print('drag enter');
    },
    onDragExit: () {
        print('drag exit');
    },
    onDrop: (List<html.File> files) {
        print('files dropped');
        print(files);
    },
    child: Container(
        width: 300,
        height: 300,
    )
)

License

MIT License.

카테고리

소스 저장소

이 패키지를 사용하는 프로젝트

아직 데이터가 없습니다.