動画 要約 与えられたサイズに応じて柔軟にwidgetのサイズを変えたい場合はFlexible widgetを使おう flex値を指定することで、widget毎の幅を調整することもできる。（3つのwidgetを2:3:1の幅で配置するなど） fitプロパティを使うことで、スペースだけ確保してそのスペースの中で自由にwidgetの幅を指定することもできる。 内容 widgetのサイズが固定の場合、w […]
動画 要約 リストの行がアニメーション無しに増えたり減ったりすると、ユーザーから見て何が起きたのかわかりにくい AnimatedListを使えば、行の追加削除がアニメーションで表現されるためわかりやすい 内容 動的に変化するリストは多くのアプリ開発で必要になります。 リストのアイテムは常に追加、削除、変更される可能性がありますが、その際、アニメーション無しでリストの内容が変化するとユーザーに混乱を […]
動画 要約 widgetをユーザーにドラッグさせたい場合はDraggable widgetを使おう ドラッグ先はDragTarget widget で実装できる ドロップ可否の判定やドラッグ後の再ビルドなど、様々な関数が用意されている 内容 モバイルアプリには様々なUIパターンがあります。ドラッグもその１つです。 例えば、e-mailアドレスを他のコンポーネントに移したり、ドキュメントを他のフォル […]
今回は #30 ValueListenableBuilderについてです。 動画 要約 １つの値をアプリの各所から参照している場合、値に変更があると複数箇所で再ビルドしなければならず、とても大変 そんなときはValueListenableBuilderを使おう 値が変更された場合、ValueListenableBuilderにその変更が通知され、自動で再ビルドしてくれる 内容 アプリの様々な場所 […]
動画 要約 widgetを特定のサイズにしたい場合はSizedBoxを使おう SizedBoxでwidgetをラップしてheight、widthを指定するだけ SizedBox.expandでいっぱいに広げることもできる 空のSizedBoxでwidget間に余白を確保する、という使い方もできる 内容 widgetを特定のサイズにしたい場合があります。 FlutterではSizedBoxを使って簡 […]
動画 要約 左右にスワイプして項目を削除するUIパターンはDismissibleを使って実現できる 削除時にはonDismissedというコールバックが実行されるので、onDismissedの中でStatefulWidget.setState等を実行できる。 内容 左右にスワイプすることでリストの項目を削除する動きはよくあるUIパターンの１つです（通知の既読、Gmailのアーカイブ等）。 Flu […]
動画 要約 Flutterでアニメーションを実現する方法のひとつにAnimatedBuilderがある 開発者はbuilderメソッド内でアニメーションの状態に応じて自由にwidgetを構築することができる 内容 Flutterのアニメーションフレームワークはwidgetを簡単にアニメートでき、開発者に多くの選択肢を提供しています。 特にAnimatedBuilderはオススメです。 使い方は簡単 […]
動画 要約 Stackのchildrenの位置はPositionedを使って指定しよう top, bottom, left, right, hight, widthを数値で指定することができる Positioned.fillを使うことで、Stackのスペースを埋めるように配置することもできる 内容 Stackは素晴らしいwidgetです。 widgetを思いのままに互いに組み合わせたり上に重ねたり […]
動画 要約 Align widgetでwidgetの配置位置を自由に変えられる（左寄せ、下寄せなど） 数値を使って細かく位置を指定することもできる 内容 様々なwidgetを組み合わせて使えるということは、Flutterの最大の特徴です。 しかし、親widgetの好きな場所に子widgetを配置するにはどうすればいいでしょうか？例えば、Container widgetの中にText widgetを […]
動画 要約 BackdropFilterは画像をサポートするwidget 画像を回転させたり、傾けたり、ぼかしたりしたい場合はBackdropFilterを使おう 画像の一部をぼかしたり編集することもできる 内容 Flutterはimageを良くサポートしており、アセットからまたはネットワーク経由で画像を読み込みます。 その後、画像を回転させたり、傾けたり、ぼかしたりしたい場合はどうすればいいで […]
