【Flutter】クリップボードにコピーする

はじめに

アプリ上に表示されたテキストをクリップボードにコピーし、
別アプリに値をペーストする方法を学んだため、記事にしてみました。

クリップボード とは？

コンピュータ上で、一時的にデータを保存できる共有のメモリ領域のこと。

（ウィキペディア（Wikipedia）より引用）

開発環境

• macOS Monterey 12.5
• Android Studio Chipmunk | 2021.2.1 Patch 1
• Flutter 3.3.10

Clipboard の使い方

データセット（コピー）

使用したいクラスに下記パッケージをインポートし、
Clipboard にデータをセットすることで値がコピーできる。

import 'package:flutter/services.dart';

final data = ClipboardData(text: 'sample');
await Clipboard.setData(data);

データ取得

Clipboard からデータをgetすることで値を取得することができる。
kTextPlain は テキスト形式「text/plain」のデータである。

import 'package:flutter/services.dart';

final data = await Clipboard.getData(Clipboard.kTextPlain);
print(data.text);

クリップボードにコピーする

main.dart

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:uuid/uuid.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key, required this.title});
  final String title;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
          title: Text(title),
      ),
      body: const MainPage(),
    );
  }
}

class MainPage extends StatelessWidget {
  const MainPage({super.key});

  /// 生成したUUIDを返却します。
  Future<String> getUuid() async {
    var uuid = const Uuid();
    return uuid.v4();
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          FutureBuilder<String>(
            future: getUuid(),
            builder: (BuildContext context, AsyncSnapshot snapshot) {
              return InkWell(
                onTap: () async {
                  // クリップボードにデータをセットする
                  Clipboard.setData(ClipboardData(
                      text: snapshot.hasData ? snapshot.data : ''),
                  );
                  await showDialog(
                    context: context,
                    builder: (BuildContext context) {
                      return AlertDialog(
                        title: const Text('クリップボードにコピーしました。'),
                        actions: [
                          TextButton(
                            child: const Text('OK'),
                            onPressed: () => Navigator.pop(context),
                          ),
                        ],
                      );
                    },
                  );
                },
                child: Text(
                  snapshot.hasData ? snapshot.data : '',
                  textAlign: TextAlign.center,
                ),
              );
            },
          ),
        ],
      ),
    );
  }
}

生成したUUIDをクリップボードにコピーして別アプリに値をペーストすることができました。

さいごに

Flutterでクリップボードにコピーする方法を紹介しました。
何かと便利なのでアプリ作成の際に役に立つかなと思います！

参考サイト

• Clipboard class