Flutter memo
mint? lineCount;
assert(lineCount == null);
?がついているのはnull許容型。
assertは引数がfalseになると例外を発生する。
mFunction makeAdder(int addBy) {
return (int i) => addBy + i;
}
void main() {
// Create a function that adds 2.
var add2 = makeAdder(2);
// Create a function that adds 4.
var add4 = makeAdder(4);
assert(add2(3) == 5);
assert(add4(3) == 7);
}
変数にFunction型の値を渡すと後で実行できる
mRubyとDartの対照表
左の値がない時に右の値を代入する
b ||= value
b ??= value;
クラスの確認
p a.class
print('The type of a is ${a.runtimeType}');
特定のデバイスで起動する場合
flutter run -d device_id
デバイスのidは、flutter devicesで端末情報の次に表示されるemulator-5554など
mVSCodeの場合、右クリック -> Format Document から整形できる
mパッケージの追加方法
-
pubspec.yamlに追加するパッケージを記載 flutter pub get
mwidgetにはいくつか種類がある。
-
StatelessWidget
- immutabel 不変
- ヘッダーなど？
-
StatefulWidget
-
State
mFlutterでもReduxも使えるらしい！
mvoid _incrementCounter() {
setState(() {
_counter++;
});
}
voidの後の関数名に_がつくのはなぜ？
_ がつくものは、ライブラリの中でだけ参照できるらしい。private的なもの？
m@overrideって何してる？
->
mdart migrate --apply-changes でnull safetyに対応してないプロジェクトを対応できるらしい
mprimaryColorとprimarySwatchの違いはなんだろう
mVSCodeの左側にあるデバッグメニューからビルドすると、⌘ + sでの保存時にホットリロードしてくれるので便利。
が、なぜか手元の環境ではiOSだけ動かなかった
miOSのウィジットカタログめっちゃ面白そう。使ってみたい。iOS用のウィジットを配置するとAndroidではどういう挙動になるのかも気になる
mlinterで警告が出るパターンが色々あって面白い
mFlutterで最初にプロジェクトを作った時にやっておくべきこと
m必読のHuman Interface Guidelines
mFlutter Awesome
いい感じのサンプルとかチュートリアル探すのにとてもいい
mこのハンズオン良さそうなのでやってみる。API叩いて一覧表示する方法が分かりそう
mpubspec.ymlにassetsを指定すると、ビルド・デプロイ時にファイル、画像などがアプリ側から利用できる
Suzuriのチュートリアルではこれで.envを追加しているが、バンドルに含まれてしまい読まれるので良くない
mStatelessWidget を継承する上で必要なこと
- ミュータブルなフィールドを持っていないこと
- Widgetを返すbuildメソッドをオーバーライドすること
(ミュータブルなフィールド = finalキーワードが付与されていないフィールド）
mクラスの上部によくあるfinal String title;みたいな何も代入されていない変数、クラスに渡された引数がコンストラクタでこれに代入されてるっぽい。なんで仮引数みたいな書き方しないんだろう
mFlutterは宣言的にコードを記述する。
状態を変えたいときは
○新しい状態を与えてウィジェットを作り、古いウィジェットを破棄する
×状態を変える
buildメソッドは新しい状態を与えて以前のウィジットを破棄するために用いる
mFlutter provider
mこのチュートリアル良さそうなのでSUZURIのが終わったらやる
mSUZURIのハンズオンではflutter_dotenvがnull safety対応していなかったので、こちらを利用
mChangeNotifierクラスってなんだろ
mFlutterのPWAサポート
mウィジットの中に書くこれはコンストラクタらしい。
const OnlineFriendPage({Key? key}) : super(key: key);
main() {
Hoge hoge = new Hoge(); //Ⅰインスタンス生成
print(hoge.title); // fooと表示される
}
class Hoge {
String title;
Hoge() : this.foo(); //コンストラクタ
Hoge.foo() {
this.title = 'foo';
}
Hoge.title(this.title);
}
こんな感じで、クラスの中にある
Hoge() : this.foo()コロンを使うことでリダイレクト先のコンストラクタを指定できる。
上の例のように、コンストラクタからコンストラクタを呼ぶ処理は、redirecting constractorsと呼ぶらしい。
main() {
Hoge hoge = new Hoge('foo'); //Ⅰインスタンス生成
print(hoge.title); // fooと表示される
}
class Hoge {
final String title;
Hoge(this.title);
}
これはAutomatic field initializationと呼ばれるもので、コンストラクタでクラス名(this.フィールド名)と指定すれば、代入処理を書かなくても自動で代入してくれる。
const OnlineFriendPage({Key? key}) : super(key: key);
これはredirecting constractorsでsuper(key: key);を指定していて、継承元のStatelessWidgetのコンストラクタを呼び出している。
mこのレシピ集めっちゃいい。
色々なユースケースが詰まってる！
mDartのlateについて
mローカルストレージにデータを保存する
mFutureから変数を取得する場合は、こんな感じにシンプルに書ける
mTextFieldから値を取得する
mstate管理に使う変数やcontrollerの値は、Widgetの外に配置しないと画面が更新される際にリセットされてしまうので注意
mBottomNavigationBarについてよくまとまっている記事
mFlutterアイコンの一覧
mEffective Dart
命名とかの基準が書いてあるので読む
mAppBarに戻るボタンを表示しない方法
automaticallyImplyLeading: false
デフォルトだと表示されるので、ログイン画面とかはこの設定にするのが良さそう