Flutter文件保存插件filesaverz的使用

Flutter 文件保存插件 filesaverz 的使用

介绍

filesaverz 是一个可自定义的文件保存和文件选择器插件，它使用户能够轻松浏览文件夹并保存文件或选择文件，特别适用于 Android 平台。

预览

安装

1. 在 pubspec.yaml 文件中添加依赖：

   dependencies:
     filesaverz: ^3.2.1
   

2. 在 AndroidManifest.xml 中添加权限：

   <manifest xmlns:android="http://schemas.android.com/apk/res/android"
       package="com.example.example">
       <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
       <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
   </manifest>
   

3. 如果遇到 MissingPluginException 错误，请在 app/build.gradle 中添加以下配置：

   buildTypes {
       release {
           shrinkResources false
           minifyEnabled false
           signingConfig signingConfigs.release
       }
   }
   

4. 导入 filesaverz 包：

   import 'package:filesaverz/filesaverz.dart';
   

使用方法

1. 设置 FileSaver 小部件：

   FileSaver fileSaver = FileSaver(
     fileTypes: const ['txt', 'pdf'],
     initialFileName: 'Untitled File',
   );
   

2. 自定义 FileSaver：

   FileSaver fileSaver = FileSaver.builder(
     fileTypes: const ['txt', 'pdf'],
     initialFileName: 'Untitled File',
     headerBuilder: (context, state) => /* Your Widget */,
     bodyBuilder: (context, state) => /* Your Widget */,
     footerBuilder: (context, state) => /* Your Widget */,
   );
   

3. 异步调用方法：

   • 获取保存文件的路径：

     String? path = await fileSaver.getPath(context);
     

   • 调用 writeAsBytes 方法：

     fileSaver.writeAsBytes(bytes, context: context);
     

   • 调用 writeAsBytesSync 方法：

     fileSaver.writeAsBytesSync(bytes, context: context);
     

   • 调用 writeAsString 方法：

     fileSaver.writeAsString(contents, context: context);
     

   • 调用 writeAsStringSync 方法：

     fileSaver.writeAsStringSync(contents, context: context);
     

   • 选择单个文件：

     File? file = await fileSaver.pickFile(context);
     

   • 选择多个文件：

     List<File>? files = await fileSaver.pickFiles(context);
     

属性说明

• headerBuilder：可选的构建器，用于自定义头部。

  (context, state) {
    return Text('My Custom Header Widget');
  },
  

• bodyBuilder：可选的构建器，用于自定义主体。

  (context, state) {
    return Text('My Custom Body Widget');
  },
  

• footerBuilder：可选的构建器，用于自定义底部。

  (context, state) {
    return Text('My Custom Footer Widget');
  },
  

• style：设置自定义的颜色、文本样式、图标和显示的文本。

  FileSaverStyle(
    primaryColor: Colors.blue,
    secondaryColor: Colors.white,
    primaryTextStyle: TextStyle(),
    secondaryTextStyle: TextStyle(),
    icons: [
      FileSaverIcon(icon: (path) => Icon(Icons.default)),
      FileSaverIcon.directory(icon: (path) => Icon(Icons.folder)),
      FileSaverIcon.file(fileType: 'jpg', icon: (path) => Image.file(File(path))),
    ],
    text: FileSaverText(
      popupNo: 'Nay',
      popupYes: 'Sí',
    ),
  ),
  

• initialFileName：用于保存文件时的初始文件名。

  'Untitled File',
  

• initialDirectory：在 Android 中，默认调用 Environment.getExternalStorageDirectory。

  Directory('Storage Path'),
  

• fileTypes：用于限制显示的文件类型，并在保存文件时作为选项。

  const ['jpg', 'gif', 'png'],
  

示例代码

以下是一个完整的示例代码，展示了如何使用 filesaverz 插件来保存文件和选择文件：

import 'dart:io';
import 'dart:developer';
import 'package:flutter/material.dart';
import 'package:filesaverz/filesaverz.dart';

void main() {
  runApp(const MaterialApp(
    title: 'File Saver Example',
    debugShowCheckedModeBanner: false,
    home: MyApp(),
  ));
}

/// 主页面
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    /// 设置文件浏览器
    FileSaver fileSaver = FileSaver(
      initialFileName: 'New File',
      fileTypes: const ['txt'],
    );

    return Scaffold(
      body: Center(
        child: Column(mainAxisSize: MainAxisSize.min, children: [
          /// 保存文件
          MyButton(
            text: 'Save File',
            icon: Icons.save,
            onTap: () {
              fileSaver.writeAsString('Hello World', context: context);
            },
          ),

          /// 选择文件
          MyButton(
            text: 'Pick File',
            icon: Icons.insert_drive_file_rounded,
            onTap: () async {
              File? file = await fileSaver.pickFile(context);
              log(file.toString());
            },
          ),

          /// 选择多个文件
          MyButton(
            text: 'Pick Files',
            icon: Icons.file_copy,
            onTap: () async {
              List<File>? files = await fileSaver.pickFiles(context);
              log(files.toString());
            },
          ),
        ]),
      ),
    );
  }
}

/// 自定义按钮
class MyButton extends StatelessWidget {
  const MyButton({Key? key, required this.text, required this.icon, this.onTap})
      : super(key: key);

  final String text;
  final IconData icon;
  final void Function()? onTap;

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 10.0),
      child: Material(
        color: Colors.blue,
        child: InkWell(
          onTap: onTap,
          child: Padding(
            padding: const EdgeInsets.all(10),
            child: Row(
              mainAxisSize: MainAxisSize.min,
              children: [
                Icon(icon, color: Colors.white),
                const SizedBox(width: 10),
                Text(
                  text,
                  style: const TextStyle(
                    color: Colors.white,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}