FlutterレアWidgets選
紹介
3年前から(flutter1.x)からFlutterエンジニアになり、
会社でも、自分でもサービスを作り上げました、便利でファンになりました。
今はFlutter2.xになりまして、色なWidgetを追加や改善されましたと聞かれて、
自分は結構たくさんのパーツを活用しましたが、2.xで開発を進む中に、こんなものあるでしょうか、あんなパーツありえるでしょうかと思いつづ、flutterを深堀しました。
このパーツいいですね
えええ、こんなWidgetあるんだ
自作のWidgetよりいいじゃん
とかの感想結構出ました。
そんな中に、同じくFlutter開発者のみんな様に、自分のメモにも、
ちょっとレアなWidgetsをリストアップし、開発の時、参考できれば幸いです。
人によってレア度は違ったりしたら、申し訳ございません。
WillPopScope
Androidでは戻るボタンがありまして、このパーツ何を言えば、AndroidとiOSを統一させるものと感じますね。
開発当初はテストとかで発覚しました、今後、自分はいつも、下記のように処理していました。
WillPopScope(
onWillPop: () => Future.value(false),
child: ....
)
Flexible/Expanded
Flex的なレイアウトを作るとき、愛用するパーツで間違い無いです。
Flexible(
flex:(XXX)
fit:FlexFit.tight
....
)
下記と同じ効果です。
Expanded(
flex:(XXX)
....
)
Stepper
ユーザーに順番的に手続きをやる時、これはすごくいいと思います。
横と縦選択でき、ステップ内容をコントロールするならば、組み合わせでいけるかもしれない。
FittedBox
サイズ合わなくて、画面でワーニング出たことよくありますね。
このWidgetはまさに救われているところです。
サイズ合わなくても、ちゃんと父親のWidgetのサイズに合わせていきます。
Hero
画像を一つのWidgetとしてタグ付けて、例えば、
ダイアログとか、詳細画面とか、カスタマイズ性があり、いいですね。
ChoiceChip
タグを選択する時、使えそうなWidgetでした。
前がカスタマイズして作ったが、今後こちらを活用したいと思います。
SliverAppBar
Materialデザインと合わせるため、自分は一番よく使われているパーツでした。
注意するのはappBar追加しないでね(見ればわかるですけど
Wrap
Androidのwrap_content知っている人ならばすぐわかります。
このWidgetで、ビッタリこのパーツで抑えるというイメージでした。
リスト超えた場合、自動的に改行したりするのは助かります。
ExpansionTile
よく問い合わせで、問題に対して、回答は展開する形で行っていました。
ExpansionTile動き
表示したい内容
Range Slider
範囲選択ですね。ただし、0〜1の間なので、場合によって、変換しないといけないかもしれない。
Visibility
場合によって、表示したり、しないたりの状況あり、これのコントロールは便利と思います。
AnimatedCrossFade
結構かっこいいアニメションパーツです、自分のお気に入りです。
GridPaper
ノートみたいです、数学系のアプリ出そうです。
Tooltip
ウェブ開発の時、よく提示で表示するものです、flutterはwebサポートしているなら、これを活用そうですね。
Table
ありまして、あんまに使っていないなぁ。
スマホ開発の中に、テーブルを使って、何かを表示するのは珍しいかもしれないが、iPadやウェブでは活躍しそうです。
GestureDetector
InkWell派とGesture派がどちらでもいいと思います。
自分的には、GestureDetectorのほうがイベント多くて、使う場面は多いと思います。
GestureDetector(
onTap:(function xxx)
....
)
InteractiveViewer
Widgetの拡大縮小や移動の時、このWidgetは完璧かと思います。
(最初はズーム機能付きのWidgetを自作しましたが、これをみて、完敗しましたw
「2048」のミニゲーム作れそうな気がします。
CheckboxListTile
Checkboxがよく使われて、このWidgetは確かにあんまに使われていないですね。
実際の開発では、チェックボックスは基本的にデザイン的に定義されて、デザインに拘りがなく、
設定画面の場合、いい選択肢と思います。
SelectableText
テキストは選択できるようになります。
文書の内容を選択して、検索したり、保存したり、色々操作したい時、すごく便利なWidgetです。
まだ、SelectableText.richでRichTextみたいに使えるので、Text系の自作もうやめます。
ListWheelScrollView
とにかくカッコいいリストビューですね。
BackdropFilter
画像に弄りたいとき、使ってみたいですね。
Autocomplete
Googleみたいに検索するとき、愛用したい。
Offstage
ステージから降ろすか、上がるかみたいな操作できます。
Visibilityと違って、可視化コントロールしているより、OffstageはWidgetの居場所をコントロールしているかと思います。
コメント
いかがでしたでしょうか。
時間は有限であり。
車輪はある、もう作らなくていい
という信念でアプリやサービスを開発しましょうw
自作アプリでも、会社で大きめなプロジェクトでも役に立つと嬉しいです。
今後はレア的なWidgetはありましたら、まだここで追加したいと思います、よろしくお願いします。
Discussion