Flutter文件拖拽与放置功能插件file_drag_and_drop的使用

Flutter文件拖拽与放置功能插件file_drag_and_drop的使用

文件描述

FileDragAndDrop

一个允许你将原生文件拖放到Flutter应用中的桌面插件。

平台支持

目前仅支持macOS平台，如果有人可以实现其他平台的方法，请向贡献者提交pull请求。

示例

首步：初始化

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await dragAndDropChannel.initializedMainView();
  runApp(MyApp());
}

第二步：添加监听器

[@override](/user/override)
void draggingFileEntered() {
  print("flutter: draggingFileEntered");
  setState(() {
    visibilityTips = true;
  });
}

[@override](/user/override)
void draggingFileExit() {
  print("flutter: draggingFileExit");
  setState(() {
    visibilityTips = false;
  });
}

[@override](/user/override)
void prepareForDragFileOperation() {
  print("flutter: prepareForDragFileOperation");
  setState(() {
    visibilityTips = false;
  });
}

[@override](/user/override)
void performDragFileOperation(List<DragFileResult> fileResults) {
  print("flutter: performDragFileOperation");
  setState(() {
    this.fileResults = fileResults;
  });
}

开始使用

这个项目是一个起点，用于创建一个Flutter插件包。这种插件包包括针对Android和/或iOS的平台特定实现代码。

对于如何开始使用Flutter，你可以查看我们的在线文档，其中包含教程、示例、移动开发指南以及完整的API引用。

示例代码

import 'dart:convert';
import 'dart:io';

import 'package:file_drag_and_drop/drag_container_listener.dart';
import 'package:file_drag_and_drop/file_result.dart';
import 'package:flutter/material.dart';
import 'package:file_drag_and_drop/file_drag_and_drop_channel.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await dragAndDropChannel.initializedMainView();
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  [@override](/user/override)
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> implements DragContainerListener {
  List<DragFileResult> fileResults = [];
  var visibilityTips = false;

  [@override](/user/override)
  void initState() {
    super.initState();
    dragAndDropChannel.addListener(this);
  }

  [@override](/user/override)
  void dispose() {
    dragAndDropChannel.removeListener(this);
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: const Text('FileDragAndDropContainer Example'),
          ),
          body: Stack(
            children: [
              ListView(
                children: buildWidgetList(fileResults),
              ),
              Visibility(
                visible: visibilityTips,
                child: Positioned(
                    left: 0,
                    right: 0,
                    top: 0,
                    bottom: 0,
                    child: Container(
                      color: Colors.black54,
                      child: Column(
                        children: [
                          SizedBox(
                            height: 15,
                          ),
                          Container(
                            decoration: BoxDecoration(
                              color: Colors.blueGrey,
                              borderRadius: BorderRadius.all(Radius.circular(12)),
                            ),
                            padding: EdgeInsets.all(15),
                            child: Text("Drag your file Here"),
                          ),
                        ],
                      ),
                    )),
              )
            ],
          )),
    );
  }

  List<Widget> buildWidgetList(List<DragFileResult> fileResults) {
    var list = <Widget>[
      Center(
        child: Text('Drag your finder file here'),
      )
    ];
    fileResults.forEach((element) {
      if (element.fileExtension == "png" || element.fileExtension == "jpg") {
        list.add(Center(
          child: Text('Receive Image file'),
        ));
        list.add(Image.file(
          File(element.path),
          height: 100,
          fit: BoxFit.fitHeight,
        ));
      } else {
        list.add(Center(
          child: Text(
              "receive path ${element.path} isDirectory ${element.isDirectory}"),
        ));
      }
    });
    return list;
  }

  [@override](/user/override)
  void draggingFileEntered() {
    print("flutter: draggingFileEntered");
    setState(() {
      visibilityTips = true;
    });
  }

  [@override](/user/override)
  void draggingFileExit() {
    print("flutter: draggingFileExit");
    setState(() {
      visibilityTips = false;
    });
  }

  [@override](/user/override)
  void prepareForDragFileOperation() {
    print("flutter: prepareForDragFileOperation");
    setState(() {
      visibilityTips = false;
    });
  }

  [@override](/user/override)
  void performDragFileOperation(List<DragFileResult> fileResults) {
    print("flutter: performDragFileOperation");
    setState(() {
      var cur = this.fileResults;
      cur.addAll(fileResults);
      this.fileResults = cur;
    });
  }
}