画像、動画、アイコン
フロービルダーの Media カテゴリには、Image、Video、Icon の3種類のメディア要素があります。
画像や動画を、ノッチやホームインジケーターの背後を含む画面全体に表示するには、すべてのオフセットを0に設定して固定配置し、Ignore safe area を選択します。詳しくはレイアウトと配置をご覧ください。
画像
.JPG、.PNG、.GIF ファイルを最大 20 MB までアップロードできます。
- Aspect — 画像をコンテナに合わせる方法を設定します：
- Fit — 画像をトリミングせずにコンテナ内に収まるようにスケーリングします。
- Fill — 画像をコンテナに合わせて引き伸ばします。
- Cover — 必要に応じてトリミングしながら、コンテナ全体を覆うようにスケーリングします。デフォルト値です。
- Use custom media ID — 後述のカスタムメディアIDを参照してください。
ビデオ
.MP4 または .WEBM ファイルをアップロードできます。ファイルサイズは最大50 MB、長さは最大30秒です。最小解像度は640x640ピクセルです。
- Aspect — Fit、Fill、またはCover。デフォルトはFillです。
- Loop — ビデオをループ再生します。デフォルトでオンです。
- Use custom media ID — 下記のカスタムメディアIDを参照してください。
ビデオはエディタのプレビューでは再生されません。キャンバスには静止フレームが表示されます。デバイス上での実行時、ビデオはデフォルトでミュートで再生されます。Loopがオンの場合、無限に繰り返されます。
動画終了時にアクションをトリガーする
メイン記事：アクション
Video 要素は、動画が末尾に達したときに発火する On playback finished トリガーをサポートしています。Interactions パネルで設定して、別の画面へ遷移したり、CTAを表示したり、その他のアクションを実行できます。
アイコン
バンドルされている Tabler Icons ライブラリから、2種類のビジュアルスタイルで数千のアイコンを選択できます：
- Stroke — アウトラインのみ。
- Filled — 塗りつぶし。
ピッカーでキーワード検索してアイコンを探せます。アイコンの色は Color ピッカーで設定します。保存済みのカラースタイルを選択するか、カスタムカラーを設定してください。
カスタムメディアID
画像や動画の背景にもカスタムメディアIDを設定できます。
画像や動画の要素にカスタムメディアIDを付けておくと、アプリのコードから実行時に差し替えることができます。たとえばユーザーが選んだアバターを表示するなど、パーソナライズされたビジュアルに活用してください。
フローBuilder でアップロードしたメディアはフォールバックとして機能します。実行時にコードからそのIDのメディアが提供されなかった場合、フォールバックが表示されます。
ImageまたはVideo要素でカスタムメディアIDを有効にするには：
- アップロードエリアの下にある Use custom media ID チェックボックスを選択します。
- メディア ID を入力します。
- フォールバック画像または動画をアップロードします。
アプリのコードでは、メディア ID を使ってメディアを取得します。SDK API の詳細については、アセットのカスタマイズ を参照してください。