Download as PDF, PPTX
Uploaded bySatoshi Noda
Flutterとプラットフォーム依存の処理の対応について
Flutterがどういうものかのざっくりとした説明と、FlutterのPlatformChannelsという仕組みを用いた、ネイティブコード(Android、iOS)とのやり取りについて。 2019/07/25 Mix Leap Study #47 - Android x Flutter 勉強会 https://yahoo-osaka.connpass.com/event/137244/
More Related Content
Flutterとプラットフォーム依存の処理の対応について
- 1. 2019/07/25 Mix Leap Study#47 - Android x Flutter 勉強会 Flutterとプラットフォーム依存の処 理の対応について GDG神戸オーガナイザー 野田 悟志
- 2.
- 3. 自己紹介 GDG神戸オーガナイザー(Manager) (2015～) ● 仕事 コミュニケーションロボットSota(ソータ)の内部コンテンツ、クラウド周 り開発 ●趣味：VR Oculus Rift DK2、Oculus Rift CV1、Cardboard、PSVR、 FOVE 0、Daydream、FirstVR(UnlimitedHandLite)、 Oculus Go、Oculus Quest ← New!!
- 4.
- 5.
- 6.
- 7. Flutter なぜFlutterを使うのか ● 生産性が高い ○ 単一のコードベース(Dart)からiOSとAndroid用に開発できる ○より少ないコードでより多くのことができる ○ プロトタイプを簡単に繰り返すことができる ■ アプリの実行中にコードを変更してリロードすることができ る（ホットリロード） ■ クラッシュを修正し、アプリが中断したところからデバッグ を続行することができる
- 8. Flutter なぜFlutterを使うのか ● カスタマイズされた美しいユーザーエクスペリエンスを作成すること ができる ○ Flutter独自のフレームワークを使用して構築された豊富な MaterialDesignおよびCupertino（iOSフレーバー）ウィジェット の恩恵を受けることができる ○ OEMウィジェットを使用せず(つまりOSバージョンにUIが影響さ れない)、カスタムで美しい、ブランド主導のデザインを実現でき る https://flutter.dev/docs/resources/technical-overview#why-use-flutter
- 9.
- 10. Flutter 豊富なパッケージ 依存パッケージはpubspec.yamlに記載する。 dependencies: flutter: sdk: flutter firebase_analytics: ^1.0.3 shared_preferences:^0.4.3 下記からパッケージを探せる。かなり多くのパッケージが存在しており、 だいたいがAndroid、iOSに対応している。 https://pub.dev/flutter
- 11. Flutter Flutterをはじめる Flutterをはじめる時は、コードラボをやるのがおススメ。 https://codelabs.developers.google.com/?cat=Flutter ● Intro toDart for Java Developers ○ Dartの基本的な文法が学べる ● Write Your First Flutter App, part 1 ● Write Your First Flutter App, part 2 ○ Part1, 2を通して、Flutterの基本的な実装方法が学べる ● Firebase for Flutter ○ FlutterでFirebaseを使う場合が学べる
- 12.
- 13.
- 14.
- 15.
- 16.
- 17. Platform Channels 実例：Flutter(Dart)側 // チャンネル名(任意のキー文字列)を設定する static const platform = const MethodChannel('samples.flutter.dev/battery'); // 呼び出すメソッド名 (任意のキー文字列 )を指定する // (引数がある場合は、第二引数に Map<String, dynamic>で指定する) final int result = await platform.invokeMethod('getBatteryLevel');
- 18. Platform Channels 実例：Androidネイティブコード(Kotlin)側 private valCHANNEL = "samples.flutter.dev/battery" // 指定したチャンネル名の MethodCallHandlerを登録する MethodChannel(flutterView, CHANNEL).setMethodCallHandler { call, result -> // ここの処理はメインスレッドで実行される // 呼び出したメソッド名によって処理を実行する。 (引数はObject型でcall.argumentsでとれる) if (call.method == "getBatteryLevel") { val batteryLevel = getBatteryLevel() // ここではバッテリー値取得メソッドを呼んでいる // 戻り値の設定 result.success(batteryLevel) } else { result.notImplemented() } }
- 19. Platform Channels 実例：Androidネイティブコード(Java)側 private staticfinal String CHANNEL = "samples.flutter.dev/battery"; // 指定したチャンネル名の MethodCallHandlerを登録する new MethodChannel(getFlutterView(), CHANNEL).setMethodCallHandler(new MethodCallHandler() { @Override public void onMethodCall(MethodCall call, Result result) { // 呼び出したメソッド名によって処理を実行する。 (引数はObject型でcall.argumentsでとれる) if (call.method.equals("getBatteryLevel")) { int batteryLevel = getBatteryLevel(); // ここではバッテリー値取得メソッドを呼んでいる // 戻り値の設定 result.success(batteryLevel); } else { result.notImplemented(); } } });
- 20.
- 21.
- 22.
- 23. Platform Channels 実例：Androidネイティブコード(Kotlin)側 // チャンネル名(任意のキー文字列) private static final String CALLBACK_CHANNEL = "samples.flutter.dev/callback"; // 呼び出すメソッド名 (任意のキー文字列 )を指定する // (引数がある場合は、第二引数に指定する ) MethodChannel(flutterView, CALLBACK_CHANNEL).invokeMethod("callback", null)
- 24. Platform Channels 実例：Androidネイティブコード(Java)側 // チャンネル名(任意のキー文字列) private static final String CALLBACK_CHANNEL = "samples.flutter.dev/callback"; // 呼び出すメソッド名 (任意のキー文字列 )を指定する // (引数がある場合は、第二引数に指定する ) new MethodChannel(getFlutterView(), CALLBACK_CHANNEL).invokeMethod("callback", null);
- 25. Platform Channels 実例：Flutter(Dart)側 // 指定したチャンネル名のMethodChannelを生成する static const platformCallback = const MethodChannel('samples.flutter.dev/callback'); // 指定したチャンネル名の MethodCallHandlerを登録する platformCallback.setMethodCallHandler((MethodCall call) async { if (call.method == "callback") { // 処理を実行 // 引数はcall.argumentsでdynamic型でとれる } });
- 26.
- 27.
- 28.
- 29.
- 30.