前提
Flutterバージョン:3.3.4
iosシュミレーターを使用
実現したいこと
- FlutterアプリでTextをタップした際にタップしたTextをクリップボードへのコピーを実装したい😭
- Pasteボタンを押したら、TextFieldにコピーした値を挿入したい
うまくいかない動作GIF
Textをタップすると上のほうにToastが出現して、成功しているように見えるが
クリップボードの値はnullになっており、うまくTextがコピーできていない🥶
該当のソースコード
dart
1import 'package:flutter/material.dart'; 2import 'package:flutter/services.dart'; 3import 'package:flutter_hooks/flutter_hooks.dart'; 4 5class CopyPage extends HookWidget { 6 const CopyPage({super.key}); 7 8 9 Widget build(BuildContext context) { 10 11 12 final copyTextEditingController = TextEditingController(); 13 14 return Scaffold( 15 appBar: AppBar( 16 title: const Text('copy'), 17 ), 18 body: Padding( 19 padding: const EdgeInsets.all(20), 20 child: Center( 21 child: Column( 22 mainAxisSize: MainAxisSize.min, 23 children: [ 24 GestureDetector( 25 onTap: () async { 26 await Clipboard.setData( 27 const ClipboardData(text: 'コピーしたいText'), 28 ); 29 }, 30 child: const Text( 31 'コピーしたいText', 32 textAlign: TextAlign.center, 33 style: TextStyle( 34 fontSize: 24, 35 letterSpacing: 0.15, 36 ), 37 ), 38 ), 39 const SizedBox(height: 24), 40 TextField( 41 controller: copyTextEditingController, 42 decoration: const InputDecoration( 43 border: OutlineInputBorder(), 44 ), 45 ), 46 TextButton( 47 onPressed: () async { 48 await Clipboard.getData('text/plain').then( 49 (value) { 50 print('copyText: ${value?.text}'); 51 copyTextEditingController.text = value!.text!; 52 }, 53 ); 54 }, 55 style: ButtonStyle( 56 backgroundColor: 57 MaterialStateProperty.all<Color>(Colors.blue), 58 ), 59 child: const Text( 60 'Paste', 61 style: TextStyle(color: Colors.white), 62 ), 63 ), 64 ], 65 ), 66 ), 67 ), 68 ); 69 } 70}
###pubspec.yaml
name: sample_app description: A new Flutter project. publish_to: 'none' version: 1.0.0+1 environment: sdk: ">=2.17.1 <3.0.0" dependencies: audioplayers: ^1.0.1 auto_route: ^4.0.1 cached_network_image: ^3.2.1 carousel_slider: ^4.1.1 cupertino_icons: ^1.0.2 device_info_plus: ^3.2.4 dots_indicator: ^2.1.0 equatable: ^2.0.3 flutter: sdk: flutter flutter_dotenv: ^5.0.2 flutter_hooks: ^0.18.5+1 flutter_local_notifications: ^9.7.0 flutter_native_timezone: ^2.0.0 flutter_svg: ^1.1.0 fluttertoast: ^8.0.9 gql: ^0.13.1 graphql_flutter: ^5.1.0 hive: ^2.2.2 hive_flutter: ^1.1.0 hive_generator: ^1.1.3 hooks_riverpod: ^1.0.4 intl: ^0.17.0 json_annotation: ^4.5.0 json_serializable: ^6.2.0 meta: ^1.7.0 dev_dependencies: artemis: ^7.9.0-beta auto_route_generator: ^4.0.0 build_runner: ^2.1.11 flutter_gen_runner: ^4.2.1 flutter_launcher_icons: ^0.9.3 flutter_lints: ^2.0.0 flutter_test: sdk: flutter pedantic_mono: ^1.19.2 flutter: uses-material-design: true assets: - assets/images/ - assets/images/theme/ - assets/images/icon/ - assets/sounds/ - .env fonts: - family: NotoSans fonts: - asset: assets/fonts/NotoSansJP-Regular.otf weight: 400 - asset: assets/fonts/NotoSansJP-Medium.otf weight: 500 - family: NotoSerif fonts: - asset: assets/fonts/NotoSerifJP-SemiBold.otf weight: 600 - asset: assets/fonts/NotoSerifJP-Bold.otf weight: 700 flutter_icons: android: "launcher_icon" ios: true image_path: "assets/launcher_icon.png"
発生している問題・エラーメッセージ
flutter: copyText: null [VERBOSE-2:dart_vm_initializer.cc(41)] Unhandled Exception: Null check operator used on a null value #0 SettingsRecoveryPage.build.<anonymous closure>.<anonymous closure> (package:seirenji_app/pages/settings/recovery/page.dart:76:61) <asynchronous suspension> #1 SettingsRecoveryPage.build.<anonymous closure> (package:seirenji_app/pages/settings/recovery/page.dart:73:19) <asynchronous suspension>
参考記事
https://blog.logrocket.com/implementing-copy-clipboard-flutter/

バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2022/10/25 01:39