FlutterFlow公式情報よりアップデートを記載します。随時更新予定。
FlutterFlowについての解説は以下記事をご参照下さい。
2024/12/12
環境固有の展開設定
開発環境に基づいて、モバイルと Web の両方のデプロイメント設定をカスタマイズできるようになりました。これにより、ベータ環境で作業しているときに Web アプリを一意の URL (例: ecommerceflow-beta.flutter-flow.app ) にデプロイできるようになり、開発のさまざまな段階をより適切に管理できるようになります。
ライブラリをマーケットプレイスに送信する機能 🚀
ライブラリプロジェクトを FlutterFlow Marketplace に送信できるようになりました。FlutterFlow ライブラリを使用すると、コンポーネント、API 呼び出し、カスタム コード、データ型/列挙型、アクション ブロックなどの再利用可能なリソースを、完全なバージョン管理の下で FlutterFlow プロジェクト間で共有できます。
この機能により、FlutterFlow Marketplace を通じてライブラリを収益化することもできます。ライブラリを使用すると、他の API 駆動型ツールとの統合、pub.devのパッケージのラッパー、UI キットなどを作成できます。
Marketplace への提出方法と承認を受けるための基準の詳細については、ドキュメントを参照してください。
VSCode拡張機能のアップデート
FlutterFlow Visual Studio Code (VSCode)拡張機能の最新バージョンでは、開発エクスペリエンスを向上させるための更新がいくつか導入されています。新しいパネルが追加され、FlutterFlow によって追跡される変更されたファイルや、変更の同期に関連する警告が簡単に確認できるようになりました。拡張機能は、内部で Flutter バージョン管理 (FVM) を使用するようになり、プロジェクト間での Flutter バージョン管理が簡素化されました。また、信頼性を高めるためにいくつかの問題を修正し、拡張機能の安定性と一貫性を高めました。さらに、拡張機能のソースコードがオープンソースになったため、FlutterFlow コミュニティは、カスタムコード開発をさらに改善する新しい IDE 拡張機能を探索、貢献、構築できるようになりました。
Supabase クエリで Like フィルターをサポート
Supabase クエリを作成するときに、Like (大文字と小文字を区別しない) または Like (iLike) 関係を使用してデータをフィルターできるようになりました。これにより、内部で Postgres LIKE 機能が活用されます。 – ワイルドカード パターンを使用して文字列を一致させることができます。% は任意の文字シーケンスと一致し、_ は 1 つの文字と一致します。詳細については、Supabase のドキュメントを参照してください。
Supabase の onDataChange アクション トリガー
Supabase のストリーミング クエリでOnDataChangeアクション トリガーを使用できるようになりました。これにより、ストリーミング データが変更されるたびにアプリ コンポーネントを制御できるようになります。この機能は Firebase ですでに利用可能でしたが、Supabase をサポートするように拡張されました。
Supabase のカスタム リダイレクト URL でパスワードをリセットする
「パスワード リセット メールを送信」アクションを使用する場合、カスタム リダイレクト URL を設定できるようになりました。これにより、マジック リンクがユーザーを誘導するページを指定でき、さまざまな宛先 (ユーザー タイプに基づくなど) を柔軟に設定できます。
許可通知が表示されるタイミングをカスタマイズする機能
これまで、FlutterFlow では、ユーザーがアプリに認証されるとすぐにプッシュ通知の許可を要求するプロンプトが表示されていました。現在、プッシュ通知設定に新しい設定が追加され、許可要求ダイアログが表示されるタイミングを制御できるようになりました。
この設定をオフにすると、権限を必要とする特定のアクションが開始されたときにのみ権限要求がトリガーされ、より合理化されたユーザー エクスペリエンスが提供されます。
プライベートAPIクラウド機能のコストを管理する機能
FlutterFlow でプライベート API をデプロイすると、接続された Firebase プロジェクトにクラウド関数がデプロイされます。これらのクラウド関数に使用されるインスタンスの最小数と最大数を構成できるようになりました。
デフォルトでは、最小インスタンスは 1 に設定されており、アプリのレイテンシが短縮されます。ただし、パフォーマンスを最適化しながらコストをより適切に制御するために、最小値を 0 に設定することもできます。
ページとコンポーネントの OnDispose アクション トリガー
新しい onDispose アクション トリガーを使用すると、ページまたはコンポーネントが破棄されるときにロジックを実行できます。これは、アクティブなストリームをキャンセルしたり、SDK のクライアントを閉じたりして、リソースが適切にクリーンアップされるようにするなどのタスクに特に役立ちます。
マージ競合解決のための一括承認
マージ競合を解決するときに、いずれかのブランチからのすべての変更を受け入れることができるようになりました。これにより、たとえばメイン ブランチからすべての変更を取得したい場合に、競合をより迅速かつ簡単に解決できるようになります。
2024/11/21
ファイルのダウンロードアクション
ユーザーにアプリ内でファイルをダウンロードする機能を提供するのがこれまで以上に簡単になりました。新しいFile Downloadアクションを使用すると、ダウンロードする URL またはバイト変数を指定し、ファイルに名前を付けることができます。
このアクションやその他のファイル関連アクションの使用方法の詳細については、FlutterFlow ドキュメントをご覧ください。
パスワード リセット フローの更新 (Firebase および Supabase)
「Reset Password（パスワードのリセット）」アクションの名前が「Send Reset Password Email（パスワードのリセットメールの送信）」に変更されました。これは、ユーザーにパスワードのリセット メールを送るという本来の使用目的をより適切に反映するためです。
Supabase では、これにより、現在のユーザーをアプリに認証するマジックリンクが送信されます。Firebase では、これにより、Firebase によってホストされているパスワード変更 Web ページに移動する電子メールが送信されます。
また、新しいパスワードを入力として受け取り、Firebase または Supabase のいずれかで現在認証されているユーザーのパスワードを更新する新しい「パスワードの更新」アクションも追加しました。
Supabase プロジェクトの場合、このアクションを使用して新しいパスワード ロジックを実際に処理するためのページをアプリ内に作成する必要があります。
Firebase プロジェクトの場合、Firebase が提供するパスワード変更ページを利用することも、アプリ内に独自のページを作成することもできます。
onDragStarted + onDragCancel
ドラッグ可能なウィジェットに、onDragStarted と onDragCancel という2 つの新しいアクション トリガーが追加されました。これらは、ドラッグ可能なウィジェットのドラッグが開始されたときと、ドラッグが中断されたときに呼び出されます。
これにより、アプリ内でより複雑なドラッグ可能なエクスペリエンスを構築できます。
2024/11/14
Supabase ストリーミング クエリ
Supabase クエリのリアルタイム ストリーミングを有効にできるようになりました。
Supabase クエリを設定するときに、 「シングルタイム クエリ」トグルをオフにするだけで、結果をリアルタイムでストリーミングできます。
Supabase の Apple 認証
Supabase を使用する際に、メール認証や Google サインインに加えて、Apple 認証をアプリに追加できるようになりました。
これにより、アプリのサインイン オプションが強化されるだけでなく、Google サインインが提供されている場合は必ず Apple サインインが必要となる Apple の App Store ガイドラインへの準拠も保証されます。
アプリ設定で検索
アプリ設定ページに検索機能を追加しました。これは、FlutterFlow 内のさまざまなプロジェクト レベルの設定を簡単にナビゲートできる、シンプルかつ便利な方法です。
依存関係ページの改善
最近のアップデートで、プロジェクト依存関係ページが導入され、FlutterFlow ライブラリ プロジェクトを依存関係として追加したり、Dart パッケージの依存関係を表示したりできるようになりました。
現在、この機能が拡張され、ページがさらに便利になっています。 FlutterFlow バージョンでは、カスタム pub 依存関係 (Dart パッケージ) をアプリに追加したり、既存の依存関係のバージョンを調整したりできます。さらに、FlutterFlow では依存関係の競合を防ぐための役立つエラー メッセージが提供されるようになりました。
目標は、すべてのプロジェクトの依存関係を表示し、プロジェクトを正常にビルドして実行するために必要なアクションを実行するための一元的な場所を提供することです。
また、このページまたはカスタム コード エディターでカスタム pub 依存関係を追加すると、各カスタム コード リソースに同じ依存関係が表示されることにも気づくでしょう。
たとえば、カスタム ウィジェットで使用するために依存関係を追加したとします。ただし、カスタム アクションでは依存関係として表示されます。これは、依存関係がプロジェクト レベルで追加されるためです。
依存関係のエラーと警告も、カスタム コード エディターに表示されるようになりました。
チームライブラリ移行ツール
チーム ライブラリ (カスタム コード ライブラリ、API ライブラリ、チーム デザイン システム内のコンポーネント) をライブラリ プロジェクトに移行するのに役立つ移行ツールをリリースしました。
チーム ライブラリをライブラリ プロジェクトに移行する方法 については、こちらでガイドをご覧いただけます。
移行を行う前にプロジェクトの変更をコミットしておくことをお勧めします。そうすれば、予期しない変更を簡単に元に戻すことができます。
その他の改善点🛠️
- バグやリグレッションを減らすことを目的としたテストとQAプロセスの強化
- 画像ウィジェットで画像ファイルの種類を指定する機能 – SVGの種類を選択することで、SVG画像をより確実にサポートできます。
- カーソル位置の設定に関する問題を修正しました
- ライブラリに関連するいくつかのバグを修正しました
2024/10/23
フレックスウィジェット
新しい Flex ウィジェットは、columnとrowの代替として使用できます。特定の条件またはロジックに基づいて、レイアウト軸 (水平または垂直) を動的に設定できます。
これは、画面が広い場合は子要素を水平に、画面が狭い場合は子要素を垂直に配置するクリエイティブなレスポンシブ レイアウトに特に役立ちます。
ボタンの末尾のアイコン
ボタン ウィジェットにアイコンを追加するときに、アイコンをラベルの先頭に配置するか末尾に配置するかを選択できるようになりました。
CLI の環境タグ
CLI で –project-environment タグを使用して、特定の環境のコードを取得できるようになりました。これは、特定の環境のコードを取得してローカルの変更を適用し、個別のテスト環境または本番ホスティング環境にデプロイする必要がある場合に特に便利です。詳細については、CLI ドキュメントを確認してください。
ライブラリの値
ライブラリ値を使用すると、ライブラリ ユーザーはライブラリ プロジェクト内で使用する特定の値を渡すことができます。たとえば、ライブラリ開発者は API キーを保持するライブラリ値を作成できます。開発者は、FlutterFlow 内の他の変数と同じようにこの値を参照できます。ライブラリのユーザーがそれをプロジェクトにインポートすると、文字列値を設定するように求められます。詳細については、ライブラリに関するドキュメントを確認してください。
チームライブラリの廃止
チーム コードと API ライブラリは非推奨になりました。つまり、プロジェクト内で新しいチーム ライブラリを作成したり、既存のチーム ライブラリからインポート リソースを追加したりすることはできません。代わりに、ライブラリを確認してください。
2024/10/10
ツールチップのリッチコンテンツ
この新機能により、単純なテキスト ツールチップを超えて、画像、アイコン、ボタン、さらには書式設定されたテキストなど、さまざまなコンテンツ タイプをツールチップに追加できるようになります。アプリの UI 内で、より詳細なガイダンス、コンテキスト情報、実行可能なオプションをユーザーに提供できるようになりました。
ツールチップのコンテンツを含むコンポーネントを作成し、それをツールチップ ウィジェットに渡すだけです。
Supabase の開発環境サポート
開発環境を使用すると、開発ライフサイクルの段階に応じて、異なるバックエンド API またはデータベース プロジェクトを指定できます。環境ごとに異なる Supabase URL を指定できるようになりました。
まず、各環境に SupabaseAPIURL や SupabaseAnonKey などの環境値を作成します。次に、新しく作成したこれらの値を指すように Supabase プロパティを構成します。詳細については、ドキュメントを参照してください。
ブランチ間で開発環境を活用する能力
Supabase のサポートに加えて、環境を切り替えてメイン ブランチの外部に新しい環境値を追加する機能も導入しました。これにより、開発環境に接続して機能ブランチで新しい機能をテストし、準備ができたらその変更をメイン ブランチにプッシュできます。
暗黙的にアニメーション化された不透明度
このリリースでは、不透明度プロパティの下に新しいトグルを追加し、不透明度の変更を簡単にアニメーション化できるようになりました。不透明度を動的な値にリンクすると、アニメーションの曲線と期間をカスタマイズできるようになり、よりシームレスな遷移と洗練された視覚的エクスペリエンスが可能になります。
2024/10/2
Visual Studio コード拡張機能
FlutterFlow Visual Studio Code 拡張機能は、FlutterFlow のビジュアル アプリ構築プラットフォームと Visual Studio Code のコード編集機能を統合することで、開発者のエクスペリエンスを向上させるように設計されています。
今では、完全に統合された開発環境でカスタム コードを編集できます。これにより、コードベース全体を確認し、信頼性の高いリアルタイムのエラー検出とオートコンプリートのメリットを享受できるほか、Flutter の拡張機能や Microsoft の Copilot などのエコシステム ツールを活用できます。
Visual Studio Code 拡張機能のインストールと使用の詳細については、ドキュメントを参照してください。
FlutterFlow AI ツール
FFDC で紹介した AI ツールを最大限に活用してください。ツールバーの新しい FlutterFlow AI ツール メニューで利用できるいくつかの新しいツールをリリースできることを嬉しく思います。
- ページオートコンプリート
ページオートコンプリートは、ページのコンテキストに基づいて関連するウィジェットをページに追加し、部分的に構築されたページを簡単に完成させます。
- スケッチからコンポーネントへ
スケッチからコンポーネントへでは、コンポーネントのスケッチを追加できます。このスケッチには、組み込むウィジェットやレイアウトのアウトラインを含めることができます。また、AIツールにあなたが考えているデザインについてさらに詳しく伝える注釈を含めることもできます。
- 強化されたページとコンポーネントの生成
また、既存のページとコンポーネントの生成にもさまざまな改善を加えました。プロンプトからページまたはコンポーネントを生成すると、視覚的に魅力的な結果が表示されるようになります。
2024/8/9
より強力なライブプレビュー
ビルダーで直接ライブ プレビューを行えることは、FlutterFlow が非常に強力である理由の 1 つです。そのため、一部のウィジェット プロパティの定数値をレンダリングすることで、プレビューをさらに強力にしていきます。パディングや境界線の半径に定数を使用する場合、それらの値がプレビューで直接どのように表示されるかを確認できるようになりました。これにより、アプリ全体で一貫した値を使用できます。パディング定数を作成し、パディング プロパティ内でそれらの定数を活用するだけです。
サイズと幅のプロパティでレスポンシブな値を活用する場合も同様です。画面のサイズと幅に合わせてコンテナーのサイズと幅を設定し、その変更をプレビュー ビルダーで直接確認できます。次はアイテムの間隔を調整します。
カスタムデータ型と列挙型の名前変更
カスタム データ型または列挙型の名前を変更したいですか? 今ならできます! 名前を編集するだけで準備完了です! 手動でリファクタリングする必要はもうありません 🙂
ご存知ないかもしれませんが、カスタム データ タイプのフィールドの名前はダブルクリックで変更することもできます。
ローカル実行およびテストモードでデバッグモードをオフに切り替える機能
最近、デバッグ パネルをテスト モードとローカル実行の両方で利用できるようにしました。これはデバッグには最適ですが、パフォーマンスに影響する可能性があります。
そのため、過去 1 週間にわたってデバッグ ログをオフにする切り替えを追加し、顧客にリリースされるときにアプリのパフォーマンスをより正確に把握できるようにしました。テスト モード セッションのデバッグ ログをオフにするには、テスト モード セッション中にデバッグ パネルの横にある3 つのドット メニュー
をクリックします。
ローカル実行でこれをオフにするには、ローカル実行構成メニューでコード エクスポート設定を編集します。
マージにおけるブランチ履歴全体の比較
マージ中にブランチ履歴全体が考慮されるように、マージ ロジックにいくつか変更を加えました。つまり、同じ競合を複数回解決する必要がある場合があります。これは、マージ中に適用される変更をよりよく理解し、信頼できるようにするためです。安定性を高めるために、ブランチ履歴を短くすることをお勧めします。つまり、ブランチを作成し、変更を加えて、メインにマージしてから削除します。
2024/7/24
ページとコンポーネントの説明
私たちは、プロジェクトに明確さとコンテキストをもたらすメタデータを追加することを使命としています。ウィジェットまたはアクション レベルでのドキュメントはすでにサポートされています。新規または既存のページまたはコンポーネントに、要素の機能と使用方法を説明する説明を追加 できます。
生成されたコードには Dart ドキュメント コメントとして説明が追加されます。つまり、Flutter 対応 IDE でこれらのクラスを利用している場合は、クラス名にマウス カーソルを合わせると、ツールチップに説明が表示されます。
iOS の最小バージョンと Android の minSDK を制御する
場合によっては、新しい Android または iOS API を活用するパッケージを使用したいことがあります。多くの場合、これらのパッケージには最小 iOS バージョンまたは最小 Android SDK バージョンが必要です。
以前は、「The plugin …. requires a higher Android SDK version」などのエラーが表示され、アプリをビルドした後にネイティブ コードを変更する必要がありました。しかし、現在は、App Settingsのプラットフォームページから最小 iOS バージョンと最小 Android SDK バージョンの両方を制御できるようになりました。
リストを降順で並べ替える
リストを降順で並べ替えることもできるようになりました。
FlutterFlow 外でデバッグ パネル (Flutter Devtools 拡張機能) を活用する
前述のように、Devtools拡張機能を通じてデバッグパネルをローカルで実行するためのサポートを追加しました。しかし、時にはFlutterFlowの外でアプリを完全に実行したいこともあります。ほとんどの場合、FlutterFlow CLIを使用してコードをダウンロードし、FlutterとDartツールを使用して好きなように実行します。そこで、デバッグコードを取得できるフラグをCLIに追加しました。このデバッグコードは、デバッグパネルをサポートする生成されたコードにログを追加します。
以下の CLI コマンドを実行して、通常どおり実行するだけです。
flutterflow export-code –as-debug … Flutter Devtools
を開くとデバッグ パネルにアクセスできます。
2024/7/11
ストリーミング API 🛜
FlutterFlow がストリーミング API をサポートするようになりました。このアップデートにより、開発者はリアルタイムで動的なアプリケーションを簡単に作成できるようになります。ストリーミング API のサポートにより、チャット アプリなど、ライブ更新を必要とするアプリケーションに継続的なデータ ストリームを提供できます。
ストリーミング応答をサポートする API 呼び出しを接続するときは、詳細設定で「ストリーミング応答の処理」設定を切り替えるだけで、通常どおり API を活用できます。
デバッグ パネルの更新/ローカル実行のサポート 📱
数週間前、デバッグ パネルの最初のイテレーションをリリースしました。これには、アプリの現在のページで使用されている各変数の現在の値を表示する機能が含まれています。当初、この機能はテスト モード セッション用にリリースされました。その後、バックエンド クエリのサポートやパフォーマンス アップデートなど、多くの機能強化を行ってきました。
本日、ローカル実行用のデバッグ パネルをリリースできることを嬉しく思います。ローカル実行セッションを開始すると、Flutter Devtools を開くオプションが表示されます。Flutter Devtools 内に、FlutterFlow デバッグ パネルの新しいタブが表示されます。
テキストウィジェットの影 🔠
テキスト ウィジェットに影のサポートを追加しました。影を使用すると、アプリのデザインの外観を制御できるだけでなく、テキストが背景と似た色である場合や、テキストが画像の上に配置されている場合など、テキストを背景から目立たせるのにも役立ちます。
新しいドラッグ可能なウィジェットプロパティ 🤏
Draggable ウィジェットの子 WhenDragging および feedback プロパティを公開しました。これにより、ドラッグの実行中に表示するコンポーネントを選択できます。
2024/6/26
アニメーション化されたテキストスタイル ✨
テキスト ウィジェットにダイナミックなアニメーションを追加する新機能を発表できることを嬉しく思います。簡単な切り替えで、色やサイズなどのテキスト スタイル プロパティをアニメーション化して、テキスト要素に活気を与えることができます。この機能強化は、プロジェクトにさらなる魅力を加え、テキストの遷移をスムーズにし、視覚的に魅力的にするのに最適です。
その他の改善点 🛠️
- 再帰コンポーネントに関するいくつかの問題を修正しました
- Mux統合に関するいくつかの問題を修正しました
- デバッグパネルの機能強化
2024/6/13
デバッグパネル 🐜
テスト モード セッション中に利用できるようになった新しいデバッグ パネルを詳しく見てみましょう。この便利なツールは、状態変数、パラメーター、グローバル プロパティなど、ページ上のすべての変数の現在の値を表示し、アプリの動作をリアルタイムで包括的に把握できるようにします。
私たちはデバッグ パネルをさらに強化することに注力しており、今後のリリースでは変数パネルを拡張し、より多くのデバッグ ツールを導入する予定です。
再帰コンポーネント 🔃
FlutterFlow の再帰コンポーネントのパワーを解き放ちましょう。コンポーネントをそのコンポーネント自体の子として埋め込むことができるようになりました。これは、フォルダーやコメント スレッドなどの再利用可能なネストされた構造を作成するのに最適です。
Codemagic デプロイ出力の改善 💬
Codemagic のデプロイメント出力のインターフェースを全面的に見直し、より明確で直感的なものにしました。アプリのデプロイメントが失敗した場合、新しいデザインにより問題の根本原因を素早く特定し、より迅速なトラブルシューティングと解決が可能になります。この改善された出力により、デバッグに費やす時間が短縮され、開発に費やす時間を増やすことができます。
フォームフィールドでカーソルの位置を設定する 🖱️
FlutterFlow のフォーム設定アクションの新しいオプションを使用して、ユーザー入力をより細かく制御できます。カーソルの位置をテキスト フィールドの開始、終了、または選択範囲全体を強調表示に設定できるようになりました。この更新により、テキストの隠蔽などのカスタム機能を統合できるようになり、フォーム フィールドでのカーソルの表示方法と場所を管理することで、シームレスなユーザー エクスペリエンスが提供されます。
その他の改善点 🛠️
- いくつかのローカリゼーションの問題を修正しました
- キャンバスの背景色に関する問題を修正しました
- いくつかのコラボレーションワークフローのリファクタリング
2024/6/1
変数によるグラデーションカラー🌈
この改善により、変数値に基づいて動的なグラデーションを生成できるようになり、アプリのデザイン内で豊かで状況に応じた色の遷移が可能になります。この機能は、ユーザー操作に適応する魅力的なビジュアルを作成するのに最適で、グラデーションに洗練されたタッチを加えます。
変数による円グラフの色分け 🎨
FlutterFlow の新しい変数による円グラフの色分け機能を使用して、データの視覚化を強化します。このアップデートにより、変数値に基づいて円グラフのセグメントに動的に色を割り当てることができるため、グラフがより直感的で視覚的に魅力的になります。
「Config Diff」ビューで競合をマージする 🔃
FlutterFlow に新しく導入された「Config Diff」ビューを使用して、マージの競合を明確に解決します。この機能は、変更を明確かつ視覚的に比較することで競合解決プロセスを簡素化し、どのバージョンを受け入れるか、または変更するかについて十分な情報に基づいた決定を下すのに役立ちます。アプリの状態変数、定数、データ型、列挙型、API 値間の競合を管理するのに最適な Config Diff ビューは、更新のマージが簡単でエラーのないプロセスになることを保証し、全体的な開発ワークフローを強化します。
Config Diff ビューについて詳しくは、こちら をご覧ください。
FF 管理の Flutter ツールを公開 💬
FlutterFlow により、開発とデバッグの両方で同じ Flutter 環境を使用することがこれまで以上に簡単になりました。FlutterFlow で管理される Flutter バイナリを公開することで、コードの編集と実行に同じ Flutter バージョンを使用し、開発プロセス全体で一貫性を保つことができます。CLI で「flutterflow run」コマンドを選択するか、IDE を設定してこの管理された環境を直接活用することで、シームレスな移行とバージョン管理の問題の削減が実現します。
その他の改善点 🛠️
- 無料ユーザープロジェクト権限の更新
- FlutterFlowチュートリアルのバグを修正
- 固定コンポーネント/ページバックナビゲーション
2021/5/10
カスタムキャンバスカラー 🎨
この機能を使用すると、ビルダー内でキャンバス カラーを設定できるため、指定された背景色がないコンポーネントを簡単に表示できます。ビルダー環境を好みに合わせてカスタマイズし、可視性を向上させて、開発プロセス中にコンポーネントのすべての要素が目立つようにします。
変数によるアニメーション値 🔢
FlutterFlow の新機能により、変数でアニメーション値を設定できるようになり、アプリのアニメーションを次のレベルに引き上げることができます。インデックスに基づいてリスト アニメーションをずらすなど、洗練された遅延効果を作成して、アプリに視覚的に魅力的な要素を追加できるようになりました。タイミングとシーケンスを正確にカスタマイズし、ユーザーの注目を集めるスムーズでダイナミックなアニメーションでアプリが生き生きと動き出すのを見てください。
作成後にブランチ名を更新する ✍️
FlutterFlow では、ブランチ名を作成した後でも更新できるようになり、プロジェクトのバージョン管理の柔軟性が向上しました。この機能は、開発ワークフローを整理し、変更に適応させるのに最適で、ブランチ名が常に現在の目的や開発段階を反映するようにします。
その他の改善点 🛠️
- ローカル実行のバグを修正
- タブバーのバグを修正
- セットフォームフィールドのバグを修正
2024/4/26
アダプティブアイコンのサポート 📱
FlutterFlow は Android 向けの Adaptive Icons をサポートするようになりました。これにより、すべてのデバイスとランチャー テーマでアプリ アイコンが洗練され、プロフェッショナルに見えるようになります。この新しい機能を使用すると、さまざまなユーザー インターフェース環境に合わせてアプリ アイコンに合わせて自動的に調整されるアプリ アイコンの背景を指定できます。
通知カウントバッジアクション 🔔
この新しいエキサイティングなアクションにより、アプリで通知カウント バッジを表示できるようになり、ユーザーにアプリの更新や新しいコンテンツへの関与を促す視覚的なプロンプトを提供できます。これは、ユーザー インタラクションを強化し、ユーザーに情報を提供してつながりを維持するためのシンプルでありながら強力な方法です。
カラーピッカーのデザインが一新されました🎨
皆様のフィードバックを念頭に置き、カラー ピッカーが再設計されました。便利な「クリア カラー」アイコンをカラー セレクターに直接追加しました。これにより、余分なクリックがなくなり、デザイン プロセスが効率化されます。UI が改善されたため、プロジェクトでの色の選択と管理がこれまで以上に直感的かつ効率的になりました。
Apple プライバシー マニフェストのサポート 🔒
FlutterFlow は Apple のプライバシー マニフェストをサポートするようになり、iOS アプリ内でプライバシー権限をより効果的に管理できるようになりました。このアップデートにより、アプリケーションが Apple の最新のプライバシー要件に準拠することが保証され、ユーザー データの権限を簡単に処理して信頼性を高めることが
できます。5 月 1 日以降、Apple の承認にはプライバシー マニフェストが必須となることに注意してください。
コンテナのセーフエリア 🚧
コンテナの新しいセーフ エリア プロパティにより、FlutterFlow のレイアウト デザインの柔軟性が向上しました。これにより、ナビゲーション要素や重要なテキストなどの重要なコンテンツが、ノッチや丸い角などのデバイス固有の機能によって隠れないようにすることができます。このプロパティは、端まで広がるフル ページの背景と、可視性とアクセシビリティの保証が必要なオーバーレイ コンテンツを組み合わせる場合に特に便利です。
その他の改善点 🛠️
- アプリの状態変数のバグを修正
- JSON バグによるデータ型の修正
- 右クリックメニューのバグを修正
2024/4/19
カスタムイメージマップマーカー 📍
新しいカスタム イメージ マップ マーカー機能を使用すると、FlutterFlow のマップの視覚的な魅力を高めることができます。この機能では、Google マップのマーカーとして独自の画像を使用できます。
JSON のデータ型 🗃️
FlutterFlow の JSON 応答から直接データ型を生成可能に。
その他の改善点 🛠️
- 役立つツールチップを追加しました
- コード生成のバグを修正
- ウォークスルーのバグを修正
- go_router をアップグレードしました
2024/4/5
ドラッグ＆ドロップウィジェット 🤏
ユーザーはウィジェットを画面上でドラッグし、指定されたターゲットにドロップできるため、インタラクティブ性が強化されます。ウィジェット間で転送するデータを選択し、ホバーによる開始、終了、ドロップの受け入れのアクションを定義することで、エクスペリエンスをさらにカスタマイズできます。この機能は、アプリの機能を強化するだけでなく、ユーザー エンゲージメントとインタラクティブ性の創造的な可能性の世界を切り開きます。
Windows 用 Google サインイン 🔐
Windows デバイスでの FlutterFlow へのログインがこれまで以上にスムーズかつ安全になりました。
ローカル実行 IDE 構成 💾
新しいローカル実行 IDE 構成オプションを使用して、FlutterFlow エクスペリエンスをカスタマイズします。VS Code、Android Studio、IntelliJ などの好みの IDE を選択できるようになりました。このアップデートでは、パーソナライズされた開発環境が提供され、ワークフローがより効率的になり、お気に入りのツールと連携できるようになります。数回クリックするだけで IDE をセットアップし、快適さと生産性のために設計されたカスタマイズされたコーディング エクスペリエンスをお楽しみください。
UI ビルダーのデフォルト値
新しい UI ビルダーの表示値フィールドを使用して UI 構築エクスペリエンスを強化し、ビルダー内での明確さと効率性のために変数名を変更できるようになりました。この便利な機能により、ワークスペースを好きなように整理できるようになり、プロジェクト要素のナビゲートと管理がこれまで以上に簡単になります。
その他の改善点 🛠️
- ページ/コンポーネントの追加ボタンを左サイドバーに移動しました
- ウォークスルーの修正
- ローカル実行の修正
2024/3/22
Windows 用 FlutterFlow ✨
Windows デバイスから快適にアプリ開発をスムーズに、効率的に行うことができます。
新しい並列アクション 🔀
並列アクションにより、アプリ内でアクションを同時に実行できるようになりました。非同期アクションを同時に実行できるため、パフォーマンスが最適化され、ユーザー操作が効率化されます。この機能は、アプリの効率を高めるために設計されており、開発機能を強化するための継続的な取り組みを反映しています。
Firestore AND/OR クエリ 🤷♂️
Firestore クエリ内で AND/OR クエリを使用する機能が導入され、データベース操作の柔軟性とパワーが大幅に向上しました。このアップデートにより、より複雑で動的なデータ取得が可能になり、アプリ開発プロセスがさらにスムーズになります。
API インターセプター 🛜
API インターセプターが利用可能になったことをお知らせします。この機能を使用すると、API リクエストとレスポンスを傍受して変更できるため、アプリの外部インタラクションに対する制御が強化されます。カスタム ヘッダー、リクエスト本文の操作、レスポンス処理を有効にすることで、API インターセプターは API 通信を特定のニーズに合わせて調整し、より安全で効率的なアプリ機能を確保します。
CLI 経由でコードショートカットをダウンロードする 📥
新しい FlutterFlow CLI スニペットを使用すると、プロジェクトをローカル デバイスに直接エクスポートすることがさらに簡単になります。プロジェクト ID を手動でコピーして貼り付ける必要はなくなりました。</> アイコンをクリックし、提供されたスニペットをコピーして、ターミナルに貼り付けるだけです。これらの小さいながらも影響力のある改善により、開発者エクスペリエンスが大幅に向上すると考えています。
その他の改善点 🛠️
- ウォークスルーのバグ修正
- ローカル実行のバグ修正
- プロジェクト間でアクションをコピーする機能
2024/3/8
ローカル実行でデバイス上でテストする 📲
MacOS ユーザーにご利用いただけるエキサイティングな機能、FlutterFlow Local Run のリリースを発表できることを嬉しく思います。Local Run を使用すると、FlutterFlow アプリ内から複数のプラットフォームでアプリケーションをシームレスにテストできます。主な機能は次のとおりです。
⚡ インスタントリロード:ボタンをクリックするだけで、アプリの変更が即座に反映される魔法を体験してください。
⏳ 無制限のテスト期間:時計を見ることなく、テストに没頭できます。時間制限がないため、アプリのパフォーマンスとユーザーエクスペリエンスのあらゆる側面を詳細に調査できます。
🤳 ネイティブデバイステスト:最も重要な実際のデバイスでアプリをテストします。アプリの外観、操作性、機能が、IOS、Android、MacOS、Web 全体で思い描いたとおりであることを確認してください。
新しい Gemini AI アクション 🪄
新しい Gemini アクションを使用して、FlutterFlow 内で直接 Google の Gemini AI のパワーを体験してください。設定で Gemini API キーを追加し、アクション フロー エディタ内でアクションを追加するだけで、テキストを生成し、テキストと画像の入力を受け入れ、トークンを簡単にカウントできます。数回クリックするだけで、信じられないほどの AI 機能を FlutterFlow アプリに追加できます。
シームレスなアプリウォークスルー 🔎
このエキサイティングな新機能により、FlutterFlow 内で直接、アプリ用の魅力的でカスタム デザインのウォークスルーを作成できます。カスタマイズ可能な形状、色、コンポーネントの使用により、これらのウォークスルーは簡単にカスタマイズでき、アクション フロー エディターのアクションを介してトリガーできます。以下の短いチュートリアル ビデオを見て、FlutterFlow アプリにパーソナライズされたタッチを追加してください。
その他の改善点 🛠️
- 列挙型のさらなるサポート（例：アプリ状態の列挙型、ドロップダウン内の列挙型）
- Supabase アクションのクエリ
- ユーザビリティの修正（例：ウィジェットを置き換えるためのオプションの追加）
- コード生成の改善
2024/2/3
パラメータ付きコールバックアクション
コールバック アクションでパラメーターを取得できるようになりました。特定のコールバックを管理するために App State を使用する煩わしさはもうありません。この改善により、チームがさまざまなプロジェクト間で簡単に共有して使用できる強力なコンポーネント ライブラリを作成できるようになります。
アップグレードされたデータテーブル
DataTable ウィジェットは、複雑なデータ駆動型アプリケーションを構築するために、より強力で多用途になりました。列の並べ替えによるデータ整理の改善、選択の切り替えによるデータ操作の簡易化、カスタマイズ可能なページ区切りなど、さまざまな機能強化が行われました。
カラーピッカー 🎨
ワークフローを効率化し、デザインの一貫性を確保するように設計された、まったく新しいカラー ピッカーが導入されました。便利な検索機能が搭載され、境界線やコンテナーに最適な色合いをこれまで以上にすばやく見つけることができます。
プロジェクトを Flutter モジュールとしてエクスポートする 📦
FlutterFlow CLI を使用してプロジェクトを Flutter モジュールとして直接エクスポートする機能を導入しました。この強力な新機能は、FlutterFlow と既存のアプリケーション間のギャップをシームレスに埋めるように設計されており、FlutterFlow 内で開発された豊富でカスタマイズ可能なインタラクティブな機能を統合できます。
その他の改善点 🏗️
- PinCode フィールド ウィジェットのピンの長さを動的に設定できるようになりました。
- 複数選択ドロップダウンをクリアするための新しいアクションを追加しました。
- 「カスタム ID」トグルを使用して、Firebase ドキュメント用の独自のカスタム ID を作成できるようになりました。
- Admobs 用の UMP SDK を実装しました。
- 自動 Firebase セットアップに必要な Google 権限を削除するオプションが追加されました。
2024/1/12
SQLite ✅
FlutterFlow が SQLite をサポートするようになり、アプリケーションにオフラインおよびローカル データ ストレージ機能が追加されました。ユーザーはインターネットに接続していなくても、いつでもどこでもアプリにアクセスして使用できるようになりました。
新しい SQLite 機能の概要は次のとおりです。
- 初期データベースファイルをアップロードする
- 読み取りクエリを作成し、FlutterFlow バックエンドクエリで使用する
- 更新クエリを作成し、アクションで使用する
ヒント: 現時点ではローカル ファイルのみがサポートされています (別のデータベースと自動的に同期することはできません)。
この強力な新機能により、ユーザーにとってより堅牢でシームレスなエクスペリエンスを構築できます。
API 結果をデータ型として 🤖
API 結果をデータ型としてサポートするようになりました。以前は JSON パスを使用する必要がありましたが、時間がかかり、エラーが発生しやすかったです。現在は、API 結果をデータ型として解析するだけで済みます。これにより、不正なデータ型による厄介なバグがなくなり、UI への接続がはるかに簡単になります。
Supabase Google 認証 ✅
Supabase で Google 認証がサポートされるようになりました。これにより、ログイン プロセスが簡素化され、ユーザーは 1 回のクリックでアカウントのサインアップとサインインを行えるようになります。
新しいアニメーション効果 🪄
アニメーションは、視覚的なフィードバックを提供し、インタラクションをより魅力的で直感的なものにすることで、ユーザー エクスペリエンスを向上させます。
アニメーション機能を拡張し、Shimmer, Tint, Flipという 3 つの新しいオプションを追加しました。これで、さらに美しい UI インタラクションがワンクリックで実現します。
オーディオ録音を Firebase/Supabase にアップロードする 🔊
オーディオ録音を Firebase と Supabase にアップロードできるようになりました。アップグレードされた「Stop Audio Recording」アクションには、録音されたオーディオ バイト (ウィジェット状態内) を保存するオプションが含まれています。その後、「Upload File」アクションを使用して、録音されたオーディオを Firebase または Supabase にアップロードできます。
SwipableStack ウィジェットが更新されました 🖼️
更新されたパッケージを使用するこの新しいバージョンは、よりスムーズでバグが少なくなっています。
その他の改善点 🏗️
- 他のブランチからブランチを作成できるようになりました (また、メインをブランチにリベースすることもできます)。
- ページおよびコンポーネントの状態のリスト変数の初期値を設定できるようになりました。
- 言語セレクターにフラグを表示/非表示にするオプションが追加されました。
- Flow 経由でユーザー チャットを追加できるようになりました。
- ドロップダウン ウィジェットを改良し、複数選択のサポートを強化しました。
- GridView および StaggeredView の開始/終了間隔を定義できるようになりました。
- リスト変数のデフォルト値を設定できるようになりました。
2023/11/30
非ブロッキングアクション
アクションに「非ブロッキング」オプションを導入しました。以前は、シーケンス内のアクションは、前のアクションが完了するまで待機してから実行されていました。現在は、非ブロッキング オプションを選択すると、前のアクションが完了していなくても後続のアクションが実行されます。
非ブロッキング アクションは、結果が必要ない API 呼び出しの送信、分析イベントのログ記録、メールやプッシュ通知の送信、長時間実行されるサーバー プロセスの開始などの状況に最適です。
さらに、アクション ブロックにコメントを追加できるようになりました。
Backend Queryのアップデート
バックエンド クエリの操作をより高速かつ簡単にするために、いくつかの大きな更新を行いました。
- ウィジェット間でバックエンド クエリをコピーして貼り付けることができるようになったため、同じクエリを 2 回再作成する必要がなくなりました。
- クエリをウィジェットの任意の親または祖先に移動する新しいオプションを追加しました。
- クエリに適用したフィルターと順序の概要を表示するように UI を更新しました。
進捗状況を保存するための下書き
新しい下書き機能により、API 呼び出し、カスタム コード、子の生成、バックエンド クエリの進行状況が自動的に保存されます。これで、最後に停止したところから簡単に戻って作業を続行できます。
AppStateフィールドと定数の名前変更と変更
AppState フィールドと定数の名前を変更できるようになりました。名前を変更するためだけにアイテムを削除して再作成する必要がなくなります 。
ブール値アップグレード
ブール値の操作を容易にするために、いくつかのアップグレードを行いました。
- 新しい条件フローが追加されたため、「単一条件」と「複数条件」のどちらかを選択する必要がなくなりました。
- リストに「isSetAndNotEmpty」操作/リデューサーを追加しました。
- ブール演算やリデューサーを持たない変数に対しては、条件を自動的に作成します。
コンポーネントが使用されている場所を確認する
プロジェクト内でコンポーネントが使用されているすべての場所を確認したいですか? ウィジェットを選択して右クリックし、使用状況を表示するだけです。
コマンド パレット (Cmd/Ctrl + K) を使用して検索し、検索結果で ➡️ ボタンを押すと、そのコンポーネントが使用されている場所を見つけることができます。
その他の改善点
- テーマ ウィジェットのプロパティ (テキスト、アイコン、境界線の半径など) のリンクを解除できるようになりました。これにより、テーマ ウィジェットのスタイルが適用されたときに、これらのプロパティが適用されなくなります。
- ページまたはコンポーネントのパラメータ値の名前を変更すると、ウィジェットとアクション全体で自動的に更新されるようになりました。
- ドロップダウンに新しい「位置固定」オプションを追加しました。これにより、すべてのオプションがウィジェットの下に表示されるようになります。
- API 呼び出しの生のテキスト応答をプレビューできるようになりました。
- Switch、SwitchListTile、Checkbox、CheckboxListTile の無効化オプションを追加しました。条件が true の場合、ウィジェットはクリックできなくなります。
- 選択した JSONPath にデフォルトの名前が提供されるようになりました。
- ディープリンクは数字で始まるようになりました。
- 大きな変更を加えていない場合は、カスタム関数を再確認する必要がなくなりました。
- FlutterFlow の現在のステータスを表示するための新しいページを追加しました。新しいページ
- プロジェクトダッシュボードのデザインを更新しました。
Flutter プロジェクトで FlutterFlow UI コードを使用する
新しい
pub.dev
パッケージを使用すると、FlutterFlow で生成された UI コードを Flutter プロジェクトで簡単に使用できるようになります。このパッケージには必要なインポートがすべて自動的に含まれているため、FlutterFlow コードをプロジェクトにすばやく簡単に統合できます。
この強力な新しいパッケージの使用方法の詳細な手順については、pub.devをご覧ください。
2023/11/10
UI とパフォーマンスに関する推奨事項
アプリをより美しく、より高性能にするための推奨事項を自動的に検出して提供します。
- Optimizations（最適化）:アプリケーションのパフォーマンスの問題につながる可能性のある項目 (列に対するクエリなど) を特定します。
- UI Enhancements（UI の強化）: UI をより美しく、またはよりアクセスしやすくするための提案を特定します (例: タップするには小さすぎるボタン)。
それはまるで、デザインとパフォーマンスの専門家が傍らにいて、ユーザーにとって可能な限り最高のエクスペリエンスを生み出すのを手伝ってくれるようなものです。
Enumサポート
FlutterFlow は enum をサポートするようになりました。型の安全性を重視し、JSON パスまたは Document フィールドのタイプミスによるバグを回避したい場合、つまり、悪人ではない場合 は、enum が最適です。enum
enumは、固定数の定数値を含むデータ型です。たとえば、次のユーザー状態のリストは、”UserRole” : Admin、Editor、Subscriberと呼ばれる enum の値になります。
これらは、特定の条件に基づいて UI 状態が変化するシナリオに最適です。enum の操作を開始するには、[データ型] > [Enums] に移動します。
Flows
フローは、アプリに特定の機能を追加するための、事前に構成されたページとコンポーネントのコレクションです。UI 要素に加えて、フローにはアクション、ロジック、スキーマも含めることができます。ワンクリックで、アプリに強力な機能を追加できます。
たとえば、アカウント作成フローには、ログイン、アカウント作成、プロファイル編集、電話認証、パスワード忘れ用の完全に構成されたページが含まれています。
Constants
プロジェクト全体で使用できるアプリ全体の定数を定義できるようになりました。
定数の操作を開始するには、[アプリの値] > [定数] に進みます。
何でも検索🔎
検索をアップグレードして、ページとコンポーネントの名前、API 呼び出し、変数、カスタム コードを含めるようにしました。
プロジェクトで「ローカル状態」変数が使用されている場所を知りたいですか? 紫色の矢印ボタンを選択すると、プロジェクトでその項目が使用されているすべての場所が表示されます。
このアップグレードにより、プロジェクトをすばやくナビゲートして要素の使用方法を確認できるため、よりスムーズで効率的な開発エクスペリエンスが実現します。
近日公開予定: 任意のテキスト (ボタン ラベル/テキスト コンテンツなど) で検索できるようになります。
通知センター
Project DashboardのNotifications Center（通知センター）では、すべてのプロジェクト コメントと招待が 1 つの場所にまとめて整理されています。コメントをタップするだけで、プロジェクトが特定の場所で開きます。
OneSignal 統合
OneSignal 統合により、電子メールと SMS メッセージングが簡単に実現します。FlutterFlow を OneSignal に接続して、これまでにないほどユーザーを引き付ける可能性を実現できます。
この統合により、次の 2 つの主要なアクションを実行できます。
- AddUser with tags（タグ付きユーザーの追加）: メール/SMS メッセージの受信用にユーザーをシームレスに登録し、ターゲットを絞ったコミュニケーションのためにタグで分類します。これは、アプリ内のユーザー アクションやマイルストーンに反応するパーソナライズされたプッシュ キャンペーンの設定と自動化に最適です。
- DeleteUser : 必要に応じてユーザーを通知の受信から削除し、ユーザーの設定とプライバシー標準への準拠を確保することで、クリーンな状態を維持します。
ユーザー アカウントが作成された瞬間にカスタマイズされた電子メールまたは SMS キャンペーンをトリガーしたり、ユーザーの行動に基づいてメッセージをカスタマイズしたりすることを想像してみてください。これが FlutterFlow プロジェクトにおける OneSignal の威力です。
マークダウンウィジェット
Markdown ウィジェットを使用すると、シンプルな Markdown構文を使用してリッチ テキスト フォーマットをシームレスに統合できます。これにより、FAQ や製品の説明など、魅力的で視覚的に魅力的なテキスト機能を簡単に作成できます。AI ボットから応答がMarkdown構文の場合、Markdown ウィジェットを使用して簡単にレンダリングできます。
大きなフォントの視覚化
大きなフォントが UI でどのように表示されるかを視覚化できるようになりました。このツールは、大きなテキストを必要とするユーザーがアクセスしやすいようにするための鍵となります。大きなフォント サイズに対応するように UI を簡単にプレビューして調整できるため、アプリをより包括的でユーザーフレンドリーにすることができます。
DatePicker
DatePicker アクションにいくつかの大きな更新を加えました:
- 最小および最大の日付値を指定できるようになりました。
- 色、フォント、アイコン スタイルなどのスタイルを定義できます。
- Cupertino styleのオプションを追加しました。
Firebase のセットアップの簡素化
新しい Firebase プロジェクトを作成して構成できるようになりました。名前とプロジェクト リージョンを選択するだけで、残りの作業は自動的に処理されます。サービス アカウントを追加したり、新しいデータベースを構成したりする必要がなくなったため、Firebase の設定には数秒しかかかりません。
テキストフィールドのフォーカスコントロール
TextField は、ユーザーがフォーカスしていて、カーソルがその特定のフィールドでアクティブになっているときに「フォーカス」を持ちます。フォーカスは、ドロップダウン、チェックボックス、ボタンなどの他のウィジェットにも適用され、一般的な入力フィールドでは Tab/Shift-Tab で移動できます。
変数ドロップダウン メニューの新しい「Widget Focus State」オプションを使用して、TextField にフォーカスがあるかどうかを確認できるようになりました。これにより、ユーザーが特定のフォーム フィールドにフォーカスしたときに animations/componentsを表示または非表示にできます。
また、TextField のフォーカス状態が変わったときにアクションをトリガーする機能も追加しました。つまり、ユーザーがテキスト フィールドにフォーカスしたとき、またはテキスト フィールドから離れたときです。これにより、ユーザーがフィールド間を移動するときに UI が直感的に反応できるカスタマイズされたエクスペリエンスを構築できます。
その他の改善点
- 画像の高さと幅を変数で設定できるようになりました。
- テスト モードのステータス。テスト モード ボタンにテスト モードのステータスが表示されるようになりました。
- オレンジ: テストモードが構築中
- 緑: テストモードの準備完了
- 黄色: テストモードの有効期限が近づいています
- 赤: テストモードの有効期限が切れています
- デザイン システムでは、子要素を動的に生成するウィジェットがサポートされるようになりました。
- onToggle アクションがサポートされ、展開可能なウィジェットの変数として現在の展開状態が追加されました。
- 選択した属性でリスト変数を並べ替えることができるようになりました。
- マウスをホバーすると、右側のプロパティ パネルまたはカラー ピッカー メニューで色の 16 進数値が表示されるようになりました。
- TextField の最大長を変数で設定できるようになりました。
- デバイスの安全領域を表示するための新しい切り替えボタンを追加しました (Canvas 設定メニュー)。
- TextField のラベルとヒントを揃える新しい設定が追加されました。
- 画像キャッシュの幅と高さを定義することで、アプリのパフォーマンスを向上できるようになりました。
- API の SSL ピンニングが許可されるようになりました (詳細設定)。これは、レガシー API を使用している場合を除き、通常は推奨されません。
- Apple ログインを使用して MacOS アプリにサインインできるようになりました。
- 最新の RevenueCat SDK にアップグレードされました。
- プロジェクトダッシュボードの読み込みが高速化され、場合によっては大幅に高速化されるようにアップグレードされました。
2023/10/24
カスタム API 認証
FlutterFlow が API ベースの認証をサポートするようになりました。これで、カスタムバックエンド、任意のバックエンドと統合するアプリケーションを構築できるようになりました。
これは、ログイン/ログアウトに「Custom Authentication」アクションを使用し、認証されたユーザーのデータを更新することで機能します。開始するには:
- 「Settings > Authentication」に移動し、認証タイプを「Custom」に設定します。
- 「Custom Authentication > Login」アクションを追加できるようになりました。
- 必要な API callを行い、Loginアクションでuser idとauthentication/refresh tokensを更新します。
- Logout/Update User更新アクションも利用できます。
カルーセルウィジェット + アクション
カルーセルには、画像やカードなど、ユーザーがスワイプできる一連のアイテムが表示されます。これらは通常、インタラクティブなスライドショー、画像ギャラリー、またはアプリケーションでの機能表示を作成するために使用されます。たとえば、eコマースアプリでは、カルーセルを使用して注目の製品のグループを展示できます。
新しいカルーセルウィジェットに加えて、一連のカルーセルアクション (Next, First, Jump Toなど) も追加しました。これらの追加機能を組み合わせることで、よりカスタマイズされた魅力的なユーザーエクスペリエンスを構築できます。
JSON <-> データ型
APIの操作がずっと簡単になりました。新しい JSON からデータタイプへの機能を使用すると、API応答と同じ構造のデータタイプを作成し、APIによって返された JSON をデータタイプに変換できます。プロジェクト全体でこのデータタイプを 1 回作成するだけで済みます。JSONパスやリクエストにタイプミスがなくなります。
アクションフローのUXの改善
以下のことが可能になりました。
- 複数条件の条件ラベルの表示。
- アクション名の変更。
- 条件付きアクション + ループに関するドキュメントの追加。
その他の改善点
- drawerの幅を動的に（変数によって）設定できるようになりました。
- カレンダーウィジェットのタイトルとアイコンの位置を変更できるようになりました。
- iPad サポートを無効にできる新しい高度な iOS 設定 (Settings > Platforms) を追加しました。
- ConditionalBuilder を Wrap Widget オプションとして追加しました。
- コンポーネント内のフォームフィールドに対して、set/clear form fields アクションを使用できるようになりました。また、PinCode ウィジェットにフォーム フィールドの設定オプションも追加されました。
- API ライブラリ内を検索できるようになりました。
- TextFields の長さカウンターを非表示にする機能を追加しました。
- プロジェクト ダッシュボードからプロジェクトの名前を変更できるようになりました。
- 右クリック メニューに、前/後に貼り付ける新しいオプションを追加しました。
- 年間料金プランの使用時にカスタム ドメインを購入できる機能が追加されました。
- プロジェクトから関連するデザイン ライブラリを直接開くことができるようになりました。heme Settings > Go To Design Library を選択します。
- 提出内容の確認と承認の方法をより明確にするために、新しい Marketplace submission guidelines が作成されました。
Widget Treeの改善
キーボードを使用してWidget Treeをよりすばやく移動できるようになりました。
- 上/下: 親ウィジェットと子ウィジェットの間を移動します
- 左/右: 親ウィジェットの兄弟間を移動します
さらに、UI ビルダーに表示されないアイテムをcopy/pasteするオプションも追加されました。
ページとコンポーネントのクイック追加ボタン
プロジェクトに新しいページやコンポーネントをさらに簡単に追加できるように、新しいボタンを追加しました。
2023/9/9
複数選択Dropdown
Multi-Select Dropdownでは、ユーザーがリストから複数の選択肢を選択できます。例えば、旅行アプリの場合、ユーザーは無料Wifiやスイミングプールなど、好みのアメニティを選択して物件を絞り込むことができます。
この新しいWidgetにより、より洗練されたユーザー体験を作ることができます。
Reorderable List（並び替え可能なリスト）
Reorderable Listを使えば、ユーザーが好きに項目を並べ替えることができるようになります。
例えば、ToDo管理のようなアプリで優先順位をつける際、タスク行を上下にドラッグして並び替えることができます。この機能により、ユーザーのエンゲージメントとアプリ内での滞在時間を高めることが可能になります。
この機能を使用するためには、プロジェクトにListViewを追加し、Reorderableをオンに切り替える必要があります。また、無限スクロールを有効にしている場合は使えません。
Firebaseパフォーマンスモニタリング
Firebaseパフォーマンスモニタリングを使うことで、リアルタイムのアプリパフォーマンスのデータを取得することができます。性能問題に早期に積極的に対処することで、ユーザー体験を向上させ、エンゲージメントを高めることができます。
この機能の追加は、Settings > Firebase > Performance Managementから可能です。
PinCodeのアップデート
• Pincodeをクリアするアクションが追加されました。
• Pincode Widgetの使用時に表示されるデフォルトのキーボードタイプを定義できるようになりました。
Custom Image For 404 Errors 🖼️
404エラーで表示する、独自のカスタム画像を設定できるようになりました。この追加機能により、エラーページにもブランド独自のアイデンティティを反映させることができます。
デプロイ履歴
デプロイ履歴の確認機能が追加されました。
WebおよびMobile 向けデプロイの日時とステータスが表示されるようになりました。
これにより、デプロイのステータスを追跡し、以前の成功したバージョンに戻すことがより簡単になります。
この新しいオプションは、[設定] > [Web Publishing]または[Mobile Publishing] > [Deployment History]で確認できます。
Pull to Refreshのアップグレード
読み込み中のIndicatorをカスタマイズできるようになりました。
ChoiceChipsのアップグレード
- 角丸、背景色・文字色・アイコンカラー、幅の設定ができるようになりました
- 選択できないChipの色の設定ができるように
- ChoiceChips WidgetをWrap可能に
その他
• メモリ内/未アップロードの画像やPDFを表示できるようになりました！
• ボタンサイズを画面幅の%で設定できるようになりました。
• Check Box Widgetの選択/非選択時のテキストスタイルを定義できるようになりました。
• TextFieldの最大文字数を定義できるようになりました。
• CanvasKitをサポートしました。
• 画像を親の内側に配置するためのImage Alignmentプロパティを追加しました。
• キーボード（またはマウス）を使って、数値プロパティ（コンテナの幅など）を増減できるようになりました。
• 変数と条件を操作するためのUIを更新し、クリック数と開発時間を削減しました。
• Run、Test、Publish用のメニューを更新しました。
• Local StateのUIをより使いやすく更新しました。
2023/8/11
Splash画面のアップグレード
より高度なSplash画面のカスタマイズのための新機能を追加。
- Splash画面の最小表示時間を設定可能になりました。
- Splash画面を表示する最小時間を設定可能になりました。
- WEB上でSplash画面を表示しないように設定可能になりました。
HeroAnimation（コンポーネント用）
HeroAnimationは、画面から別の画面への遷移をする際に、よりスムーズでシームレスに見せるエフェクトのことですが、コンポーネント用のHeroAnimationがサポートされ、より魅力的でまとまりのある画面遷移を作成できるようになりました。
TabBarの強化
TabBarを使うことでコンテンツを複数のセクションに整理し、表示されるコンテンツをすばやく切り替えることができます。以下の機能が強化されました。
- TabBarがWidgetStateをサポートするようになりました。
- 新しいTab変更アクションを追加しました。
- 未選択のTabのフォントスタイルを定義できるようになりました。
デザイン周りのオプション強化 🎨
- AutoSize Textの強化：最小フォントサイズと最大フォントサイズを設定できるようになりました。
- ScrollBarの色の設定：ブランドカラーに合わせ、スクロールバーの色を設定できるようになりました。
- Web Appsのステータスバーの色の設定： Wen Appsのカスタムステータスバーの色を定義できるようになり、アプリケーションに洗練されたタッチを追加できます。
Read Document From Reference アクション 📚
ReferenceからDocumentを読み込む新しいアクションが追加されました。これにより、ユーザーのプロフィールや商品の詳細など、必要な時に必要な情報を得るためにDocumentを読み込むことができます。
他
- Design System（Teams/Enterpriseプラン用）でリアルタイムコラボレーションが可能になりました。
- CustumCodeがFlutterFlowの依存関係をオーバーライドしている場合に表示する新しい警告を追加しました。
- 新しいビルドを開始するとき、またはAPKやコードをダウンロードするときに、カスタムコードのバリデーションがオプションになりました。
- POST & PUT & Patch APIのクエリパラメータをサポートしました。
- TextFieldsのSubmit Typeを定義できるようになりました（キーボードにDone、Next、Returnなどを表示するかどうかなど）。
2023/7/21
FlutterFlowコミュニティのリニューアル
- トピック別フォーラム： APIやカスタムコードなど特定のトピックに特化したフォーラムを導入し、必要な情報を得やすくなりました。
- 検索機能の改善： 検索機能がアップグレードされ、質問に対する回答をより簡単に見つけることができるようになりました
- Jobボード：協業先を見つけ、新しいキャリアの機会を探索します。
- ShowCase：FlutterFlowを使って作ったアプリを紹介できます
- プロフィールの強化： 強化されたユーザープロフィールで、あなたの経験についてより多くのことを共有できるように。
- WishList： 希望する新機能や、連携機能について投票できます。
新しいコミュニティに参加するには、AccountResourceページ > CommunityResourse > FlutterFlow Communityを開いてください。
Loopアクション
Action内で “while”でのループがサポートされました。
無限スクロール機能対応
より多くのリスト系Widgetに無限スクロール機能が追加されました。
PageView、GridView、StaggeredViewに無限スクロールのサポートが追加されました。この新機能は簡単に実装でき、より良いユーザー体験を構築するのに役立ちます。
ユーザーがPageViewでフォトアルバムをめくっているときでも、GridViewで商品を閲覧しているときでも、StaggeredViewでPinterestのようなレイアウトを閲覧しているときでも、無限スクロールはシームレスなコンテンツの流れでユーザーを惹きつけます。
Actionの一時無効化
Actionを無効にする新しいオプションが追加されました。この機能はデバッグ時に、特定のアクションを一時的に無効化（またはコメントアウト）することができます。
Widgetの不透過率（Opacity）が選択可能に
WidgetのOpacityを定義できるようになりました。この新機能は、透明なボタンから目を引くオーバーレイ効果まで、創造的な可能性の全く新しい世界を開きます。
特典プログラムの追加
新しいFlutterFlow Perks Programでは、Google Cloud、Algoliaなどのパートナーから50,000ドル以上の割引を提供しています。
FlutterFlowダッシュボードの “Perks Program “タブに移動して、特典をご確認ください！
他
- Firebaseに最初にアップロードしたLocalファイル(Bytes)をアップロードできるようになりました。
- FirebaseまたはSupabase認証使用時に、ユーザーのメールアドレスを更新するアクションを追加しました。
- オーディオプレイヤーをバックグラウンドで再生し続けるオプションを追加しました。
- Webアプリケーションで、HTMLの代わりにCanvasKitレンダラーを使用できるようになりました。
- （yyyy/MM/DDなど）独自の日付フォーマットを追加できるようになりました。
- キーボードの矢印を使用して、縦または横のリスト内で項目を移動できるようになりました。
2023/7/8
FlutterFlow AI Gen 公開
FlutterFlow AI Genが全ユーザーに公開されました。
- Page生成：作りたいものを記述して、AIでUI開発を始められます。
- Schema生成：あなたのアイデアを数秒でバックエンドSchemaに変換します。
- Component生成：再利用可能なアプリコンポーネントを即座に構築します。
- Theme生成：テキストの説明からユニークで美しい配色を簡単に作成できます。
- Code生成：ChatGPT Turboでパワーアップした新しいAIコードアシスタントをが利用できます。
参考：https://embed.zenn.studio/card#zenn-embedded__c3f3d49190e21
データ変更トリガーのAction 📄
Firestoreでデータが更新されたときにアクションをトリガーできるようになりました。この新機能により、たとえばDocumentのフィールドの値が変更されたときに自動的に新しいページに移動するなど、データの更新を動的に処理できるようになります。
複数ファイルのアップロード
ファイルアップロードのActionにて、ユーザーが一度に複数のファイルをアップロードできるようになりました。この機能強化により、OnBoarding時のKYCフローの一環として複数の書類をアップロードするような作業を省力化でき、ユーザーのエクスペリエンスが大幅に向上します。
GitHub Firebase Auth 😸
GitHub の認証情報を使ってサインインできるようになりました。この新機能を追加するには、数回ポチポチするだけ！
WidgetTree内からWidgetの削除が可能に 💡
WidgetTree内での作業をより簡単にするために、新しいWidgetの削除機能を追加しました。Widgetを選択 > 右クリック > Remove Widgetで削除できます。
この新機能は、階層内の次の親に再割り当てすることで、子ウィジェットの削除を回避します。
他
- Componentに複数のActionパラメータを指定できるようになりました。
- BottomSheet Actionで使用するComponentにActionパラメータを渡せるようになりました。
- HTML文字列からウェブビューのコンテンツを設定できるようになりました。
- Supabase認証ユーザーのためのSupabase JWT Tokenフィールドをサポートしました。
- Firebase/Supabaseストレージにローカルファイル(バイト)をアップロードできるようになりました。
2023/6/21
Firestore Query Action
Firestore Queryをトリガーする新しいActionを追加しました。
この機能により、Actionがトリガーされたときに関連するデータを読み込むことができます。
これにより、実際に必要な時だけ必要なデータを読み込むことで、より効率的で、レスポンスが良く、ユーザーフレンドリーな体験を提供します。
Sticky Header Widget 🍯
Sticky Headerは画面上部に固定され、残りのコンテンツは下にスクロールするWidgetです。
例えば、Airbnbでリスティング広告をスクロールしている間、検索バーとフィルターは画面上部に固定されます。 これがSticky Headerです。
Audio Recording 🎙️
音声録音の開始と停止のための新しいアクションが追加されました。音声ベースのインタラクションを簡単に構築できるようになりました。この機能により、メモアプリで音声メモを録音したり、言語アプリで発音の練習をしたりといった、新機能が可能になります。
要素の間隔をより簡単に設定できるように 💡
新しいitems spacingプロパティにより、Row・Column・ListViewの子要素間に定義されたスペースを自動的に適用することができるようになりました。
Unsplash画像検索機能 🖼
Unsplashとの統合により、FlutterFlow内からUnsplashの画像を閲覧、追加することができます。
他
- Uploadされたファイル（Bytes）とUint8ListがCustumActionと関数の引数で使用できるようになりました。
- アプリで使用するKotlinのバージョンを設定できるようになりました。
- TextFieldsのカーソルカラーとカスタムエラーメッセージのスタイルを定義できるようになりました。
- ActionListを再編成し、「State Management（状態管理）」「Utility（ユーティリティ）」、「Integrations（統合）」の3つの新しいカテゴリーを追加しました。
- 右クリックでWidgetメニューを開く新しいショートカットを追加しました。
