■
今日やったこと
- サーバ側との連携を行いたかったのと、Webページを作成する必要があるのでFlutterはおやすみしてAmplify-Reactのチュートリアルをやってみた。
- ので、まずはAmplifyの環境構築について書く
前提条件
- AWSのアカウントは作成済み
- npmインストール済み
参考サイト
Amplify CLIのインストール
npm install -g @aws-amplify/cli
Amplify CLIの設定
amplify configure
- amplifyが使用するIAMを自動的に作成してくれる。
- アクセスキーも自動で作成してくれるが、既にシークレットが見えない状態なので新たにアクセスキーを生成して入力した。
今日のひとこと
- いくら勉強してもお金に結びつける能力がないとなにかと厳しい。
■
今日のひとこと
また随分さぼってしまった。さぼっても復帰するようにして続けていきたい。
今日やったこと
Google日本語入力のキーカスタマイズ
- 日本語キーボードなら基本的にそれほど問題にはならないと思うが、英語キーボードを使用していると日本語入力切り替えのキーに結構悩む。
- 普通にAlt+`のままも悪くはないけど、HHKB使用時とノートPCのキーボード使用時で切り替えキーが変わってきて意外と混乱する。
- よって、ノートPCキーボード使用時、HHKB使用時にも概ね位置が同じである、「Ctrl+Backspace」で日本語入力切り替えを行いたい。
設定方法
- Google日本語入力キー設定から、Hankaku/Zenkakuに割り当てられているキーを「Ctrl + Backspace」に設定する
やってみた感想
- Ctrl + Backspaceで単語ごとに削除できなくなるのが不便かなと思ったが、Vimキーバインドで操作していれば問題なし
- それよりもノートPCのアローキーが小さすぎるのがきつい
- アローキー、HHKBみたいなキーバインドにできないものか。。
Flutter今更チュートリアル
ライブラリが気になって調べてたけどまずはチュートリアルですよねJK
https://flutter.dev/docs/get-started/codelab
##### チュートリアルやってみて - Widgetの種類が大量にありそうで、これを適切に使うのがむずかしそう - pubspec.yamlにマテリアルデザインを使うかのフラグがあるみたい。特にいじらなきゃTrueになってる。 - Scaffold, Center, AppBar, Text - stful、デフォルトのテンプレートかな。便利。
その他
- AndroidStudioではShift-Shiftでファイル曖昧検索->Openできる。
- hot reloadっていってもボタンは押す必要あり。
Flutterで接続状態取得
実機で動作させる準備をしたかったけどやんごとなき理由（艦これ）のため、実機が埋まっているためFlutterライブラリ探索。
電波状態取得
以下のライブラリを使わせていただく。
サンプルソース見てみる
- kIsWebってなんだろう、ってことで調査。以下が見つかった。どうやらWeb向けコンパイルされたときにtrueになる模様。
- StatelessWidgetというのもあるらしい。Statefulがあったからそりゃそうか。Stateを持たなくていい分シンプル。
- StreamSubscription型というのがある模様。状態変化の受付とかソケットListen用って感じかな。今回の場合接続対象が変更されたとき用。
- Futureを結構使ってる。nodejsみたい。
- switchはbreak入れないとFallThroughする模様。
しかしこのライブラリはシンプルに接続先を見たいときにはいいけど、接続先基地局のIDや、電波強度を取得するライブラリが見つからない。。 もう少し別の検索ワードで調べてみたいところ。
Flutterでデバイス情報取得
デバイス取得用のライブラリ
このライブラリを利用させていただく。
Flutterの書き方をサンプルコード見ながら覚える
- StatefulWidgetクラスを継承してパーツを作成する
- createState()メソッドを使用して対応するStateクラス（を継承したクラス）のコンストラクタを実行
- Stateクラスの初期化はinitState()メソッドをoverrideして実装する模様
- initState()の冒頭でsuper.initState()を実行すること
- Future型を返却することで非同期処理ができそう
- 今回のようなデバイス情報取得みたいなH/W寄りなコードはAndroidかiOSかで分岐が必要そう
- 例外処理はtry {} on XXXException {}
- mountedという変数が謎だったので調査。以下に記載があった。
Stateクラスのメンバで、TrueでないとsetStateができない模様。つまり基本的にtrueになっている。
- ライブラリにあるクラスのProperty等はドキュメントを素直に見るべき
- dynamicという型を指定しておけばどの型を入れてもいいっぽい。けどリテラルだけかも。
- Stateクラスのbuild(BuildContext context)をoverrideすることで実際のAppを作成するっぽい。Stateクラスってところがちょっと違和感あるなぁ
- MaterialAppクラスを作成して返却する模様。多分他にもありそう。Materialっていうのはデザイン的な話かな。
- MaterialAppのコンストラクタに渡してるのは構造ぽい。Layout関連をそのうちちゃんと学習したいところ。
今日はこんなところで。次回はちゃんと実機で動かすための環境整備してみたい。
Flutterアプリのテスト
AndroidStudioで新規にFlutterプロジェクトを作るとtestディレクトリがあるのでテストを動かしたい。
テストには3種類あるようだが、今回は自動作成されているテストである、Widgetテストとインテグレーションテストを実行してみる。
まずは下記ページを参考に、自動で作成されたWidgetテストを動かしてみる。
読んでみたけど、テストコードの書き方が書いてあるだけで実行方法は特に書いていなかった。
と思ったらAndroidStudioのエディタ上に再生マークがあったので押してみたらテスト実行された。これでいいのか。。
続いてインテグレーションテスト。
これまた下記サイトを参考にしてみる。
なんか自動生成されているものと、サイトの説明でディレクトリ構成からして違うので困ったが、以下のパッケージドキュメントを見てなんとか実行。
具体的には以下のような感じ。
flutter drive --driver=integration_test\driver.dart --target=integration_test\app_test.dart
思ったより手間取ったので今日は終わり。
