Zenn
Open10

Flutterの逆引き大全

Android
Flutter
iOS
Dart
shohei@株式会社Nevershohei@株式会社Never

ImagePickerで選択した画像がキャッシュに残り続けてストレージを圧迫するのでどうにかしたい

キャッシュを削除する手段を構築

画像を選択したらすぐ削除する

コード
Future<void> onPickImage() async {
    final xFile = await ImagePicker().pickImage(source: ImageSource.gallery);
    if (xFile == null) {
      return;
    }
    final bytes = await xFile.readAsBytes(); // 👈 画像バイナリを取得
    setState(() {
      _imageBytes = bytes; // 👈 画像バイナリをセット
    });
    File(xFile.path).deleteSync(); // 👈 キャッシュを削除
}

キャッシュ削除機能作って実行

コード
import 'dart:io';

import 'package:flutter/foundation.dart';
import 'package:path_provider/path_provider.dart';

class TmpCacheDirectory {
  TmpCacheDirectory._();

  static late final Directory _dir;

  static Future<void> configure() async {
    if (Platform.isIOS) {
      _dir = Directory.systemTemp;
    } else {
      _dir = await getTemporaryDirectory();
    }
  }

  static Future<void> deleteFiles() async {
    await compute<Directory, void>(
      (dir) {
        final list = dir
            .listSync(recursive: true, followLinks: false)
            .whereType<File>()
            .toList();
        for (final file in list) {
          file.deleteSync();
          debugPrint('delete: ${file.path}');
        }
      },
      _dir,
    );
  }
}

アプリ起動時に削除する

void main() {
    ...

    /// Delete Cache
    Future(() async {
        await TmpCacheDirectory.configure();
        await TmpCacheDirectory.deleteFiles();
    });
 
    runApp(const App());
}
参考記事

https://qiita.com/hukusuke1007/items/412a0e249a9d091dcab2

shohei@株式会社Nevershohei@株式会社Never

JSONデータを手軽にキャッシュしたい

  • json_cache
    • httpクライアントと一緒に使えばResponseのキャッシュ管理ができるので、オフライン対応（取得のみで）もできそう。
shohei@株式会社Nevershohei@株式会社Never

flutter_linkifyのSelectableLinkifyを長押ししてもメニューが出ない時の対応

flutter_linkify

ワークアラウンド

PRがマージされ次第このスクラップを削除する。

import 'package:flutter/material.dart';
import 'package:flutter_linkify/flutter_linkify.dart';

extension SelectableLinkifyExtension on SelectableLinkify {
  static Widget defaultContextMenuBuilder(
      BuildContext context, EditableTextState editableTextState) {
    return AdaptiveTextSelectionToolbar.editableText(
      editableTextState: editableTextState,
    );
  }
}

SelectableLinkify(
  onOpen: (link) {
    ...
  },
  text: 'コメント',
  contextMenuBuilder: SelectableLinkifyExtension.defaultContextMenuBuilder, // 👈 追加
),
shohei@株式会社Nevershohei@株式会社Never

アプリがバックグラウンド状態でも処理する方法

処理の終わりが決まっていない

  • 歩数を常に監視してローカル通知を出したい
説明
  • background_task
    • iOS / Android 共に位置情報取得をバックグラウンドでも動くようにして位置情報変更時に発火するリスナー内でやりたいことを実装する。
    • 解説記事

処理の終わりが決まっている

  • 写真や動画アップロードなど重たい処理を継続させたい
説明
shohei@株式会社Nevershohei@株式会社Never

Flutterのバージョン管理

使い方

fvmのインストール

# fvmをインストール
dart pub global activate fvm
# または flutter pub global activate fvm

# fvmのバージョン確認
fvm --version

PATHを通す

~/.zshrc または ~/.bashrc 等の環境設定ファイルにfvmのpathを設定する。

export PATH="$PATH:$HOME/.pub-cache/bin"

fvmで利用できるSDKをインストールする

# 利用できるflutterのバージョン確認
fvm releases

# flutter sdkをインストール
fvm install 3.16.5

Android Studio で fvm のFlutter SDKを利用するよう設定する

該当するプロジェクトに移動して、利用したいsdkを選択する。

fvm use  3.16.5

Preferences (又は Settings) > Language & Frameworks > Flutter のSDK内 Flutter SDK path をfvmのパスを設定する。

/{プロジェクトまでのパス}/.fvm/flutter_sdk
使い方

asdfのインストール

# Homebrewでインストール
brew install asdf

# ターミナル実行時にasdfを有効にする
echo -e "\n. $(brew --prefix asdf)/libexec/asdf.sh" >> ${ZDOTDIR:-~}/.zshrc

asdf経由でflutterをインストール

# インストールできるFlutterのバージョン確認
asdf list all flutter

# stableの最新バージョンをインストール
asdf install flutter latest

# バージョン指定してインストール
asdf install flutter 3.16.5-stable

# プロジェクトのディレクトリに移動していない場合は移動
cd アプリプロジェクトのディレクトリ

# アプリプロジェクトで使用したいバージョンを指定、.tool-version作成され、gitで管理する
asdf local flutter 3.16.5-stable

# flutterのバージョンを確認して指定されたバージョンが表示されていればOK
flutter --version

# アンインストールする場合
asdf uninstall flutter 3.16.5-stable