✨

FlutterFlow ウィジェットにアクションをつける

2021/06/19に公開

アクションの設定方法

FlutterFlow上でウィジェットごとにアクションを定義することができます。
アクションをつけると、アプリのイメージがより一層具体化されます。

現時点で設定可能なアクションは下記です。

アクションを起動させる方法も設定することができます。

左端に縦にメニューが並んでいて、上から4つ目がアクションを設定する画面になります。

左側にアクションを定義するメニューがあります。
アクションを定義するウィジェットを選択する必要がありますので、忘れずに選択してください。

ここではページの移動Navigateを設定しています。

Navigateの設定項目はさほど難しくないと思います。

また、アクションは複数設定できます。
例えば下記のようなことが考えられます。

アクションを定義すると、動きをプレビューで確認することができます。
ただし、今のところ画面の移動やアラート表示などで、接続したFirestoreとの連携はできません。
将来的にはできるようになるよう願うばかりです。

当然、実機やシミュレーターでアプリを起動すれば確認できますので、ソースをダウンロードするなどして起動してみてください。

私はプロトタイプを作る目的でFlutterFlowに興味を持ちましたが、アクションがつくとよりイメージがしやすくなります。
一方、プレビューではFirestoreとの連携ができず、アプリ上に表示される画面が実物とは異なったものになることもあります。

そんな場合はローカルでアプリを起動しますが、その手間は少しかかります。
ビルドには多少なりとも時間がかかります。
その手間が解消されてくると、よりノーコードとしての強みが増し、より普及する気がします。
将来的に実現することを期待しています。

次の記事では、アプリの表には見えにくい設定周りについて紹介しようと思います。