Flutter notes

Flutterに関するメモ書き

Moyo: 画像をクリップボードにコピーできるようにする(base64形式で)

引き続き暇な時はMoyoプロジェクトをいじっています。

せっかく書いた画像を保存したいな、と思ったので、クリップボードにコピーする機能を付けてみました。
(画像データそのままはクロスプラットフォームで動く気がしなかったのでbase64で。結局Webで動かなかったのですが…)

  GlobalKey globalKey = GlobalKey();

  Future<void> _copyToClipboard() async {
    final RenderRepaintBoundary boundary =
        globalKey.currentContext.findRenderObject();
    final ui.Image image = await boundary.toImage();
    final ByteData byteData =
        await image.toByteData(format: ui.ImageByteFormat.png);
    final Uint8List pngBytes = byteData.buffer.asUint8List();
    final String base64 = base64Encode(pngBytes);

    final ClipboardData data =
        ClipboardData(text: 'data:image/png;base64,$base64');
    await Clipboard.setData(data);
  }

保存したいWidgetを RepaintBoundary で囲んでおきます。

      body: RepaintBoundary(
        key: globalKey,
        child: _buildBody(),
      ),

これでこんな感じの画像が保存できました。

f:id:tnantoka:20191012233210p:plain

toImageの使い方は、公式ドキュメントを参考にしました。(ほぼそのまま)

ただ、まだWebでは動かないようです。(以下のエラーが発生)

Uncaught Unsupported operation: toImage is not supported on the Web

また、Widgetの状態によっては保存できない場合もあるようです。(以下のエラーが発生するWidgetがある)

Unhandled Exception: Exception: Invalid image dimensions.

このあたりはまだ、1つのソースでWebも動く、というわけにはいかなそうです。