Flutter版的文件管理器

第一次寫文章，做爲本身學習flutter過程當中作一些記錄，也但願對你們有所幫助

最近在項目的過程當中涉及到要訪問內存卡，而且打開文件的狀況。調用原生的文件管理器效果不太理想，因此想着用flutter自定義一個。好了，開始吧！

建立一個flutter項目開始寫代碼。

要訪問SD卡，首先讀取權限確定是要有的，否則寫再多代碼都是無用功。 在AndroidManifest.xml文件中添加 <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

新建一個dart文件file_manager.dart 這裏須要使用到一個插件path_provider用來獲取SD卡根路徑（不嫌麻煩本身寫原生也能夠），在pubspec.yaml文件裏添加相關依賴便可path_provider: ^0.4.1。

而後在初始化函數使用String sDCardDir = (await getExternalStorageDirectory()).path;得到SD卡的根路徑（必定要在初始化函數中就調用，否則運行以後連個路徑都沒），從這個路徑就能夠找出SD卡的全部文件和文件夾啦。 拿到這個路徑後使用directory.listSync()會自動找出當前目錄下全部文件和文件夾

List<FileSystemEntity> files = [];

var directory = Directory(sDCardDir);
files = directory.listSync();
複製代碼

把SD卡根目錄下的全部文件、文件夾都存放到files中，這也是這個文件管理器最核心的方法，傳根目錄路徑就能找出根路徑下的全部文件和文件夾，那把其中一個文件夾的路徑再傳進去（點擊一個文件夾的時候，再傳文件夾的路徑進去就行），那就能找出這個文件夾裏的全部文件和文件夾啦~

頁面顯示的時候使用了ListView佈局，由於文件數量不肯定，也可能會很大，因此使用了ListView.builder進行構建。具體代碼以下：

ListView.builder(
  controller: controller,
  itemCount: files.length,
  itemBuilder: (BuildContext context, int index) {
    return buildListViewItem(files[index]);
  },
),
複製代碼

返回的buildListViewItem就是具體的佈局，簡單使用ListTile就能夠完成比較好看的顯示效果了。代碼仍是貼上來：

Column(
  children: <Widget>[
    ListTile(
        leading: Image.asset(selectIcon(isFile, file)),
        title: Text(file.path.substring(file.parent.path.length + 1)),
        trailing: isFile ? null : Icon(Icons.chevron_right),
    ),
    Padding(
        padding: EdgeInsets.symmetric(horizontal: 14.0),
        child: Divider(
           height: 1.0,
        ),
    )
  ],
)
複製代碼

那如何判斷這是一個文件仍是文件夾呢？這裏有一個方法 var isFile = FileSystemEntity.isFileSync(file.path); 這是一個bool類型的值，true表示是文件，false就是文件夾啦。 在後面的顯示上就能夠經過這個來區分了。 還有一些頁面顯示美化的代碼就不貼了，後面有項目地址能夠本身下載下來看看。

打開文件

文件管理器，看到的文件應該要能打開吧。下面就是判斷點擊的是文件時，要彈出提示用什麼應用去打開，要寫一點原生，不過也不難。 本身寫一個通道的方法，去調用

MethodChannel _channel = MethodChannel('openFileChannel');

openFile(String path) {
    final Map<String, dynamic> args = <String, dynamic>{'path': path};
    _channel.invokeMethod('openFile', args);
  }
複製代碼

而後在MainActivity.java文件中

private static Context mContext = null;
private static final String METHOD_CHANNEL = "openFileChannel";
複製代碼

"openFileChannel"名字一致便可 而後在onCreate方法中增長如下代碼

new MethodChannel(getFlutterView(), METHOD_CHANNEL).setMethodCallHandler(
                new MethodCallHandler() {
                    @Override
                    public void onMethodCall(MethodCall methodCall, MethodChannel.Result result) {
                        if (methodCall.method.equals("openFile")) {
                            String path = methodCall.argument("path");
                            openFile(mContext, path);
                            result.success("");
                        } else {
                            result.notImplemented();
                        }
                    }
                }
        );
複製代碼

方法名爲openFile，其實只有一個方法好像不用指定也是能夠的，不過爲了規範一點，仍是寫上比較好。 dart那邊傳給Java層的是一個文件的路徑，而後調用openFile()方法，方法實現以下

private void openFile(Context context, String path) {
        try {
            if (!path.contains("file://")) {
                path = "file://" + path;
            }
            //獲取文件類型
            String[] nameType = path.split("\\.");
            String mimeType = MimeTypeMap.getSingleton().getMimeTypeFromExtension(nameType[1]);

            Intent intent = new Intent();
            intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
            intent.setAction(Intent.ACTION_VIEW);
            //設置文件的路徑和文件類型
            intent.setDataAndType(Uri.parse(path), mimeType);
            //跳轉
            context.startActivity(intent);
        } catch (Exception e) {
            System.out.println(e);
        }
    }
複製代碼

使用Intent的方式去打開，這裏仍是加上try...catch...吧，由於有些文件類型好像會報錯，具體緣由還沒去深究，應該是一些系統文件（有些連文件後綴都沒...） 整個文件管理器的實現主要方法就到這裏了 實現的界面以下

項目的代碼已經上傳到個人GitHub了

flutter版的文件管理器項目地址