フローBuilder のボタン
このセクションでは、Adapty SDK バージョン 4.0 以降で動作する新しいフロービルダーについて説明します。
ボタンはフローのビルダーで、ユーザーのタップに反応するインタラクティブな要素です。次の用途に使用できます：
- プロダクトと連携して自動的に決済を処理する購入 CTA
- 画面間を移動するナビゲーション（次へ、戻る、閉じる、スキップ）
- 購入を復元する、利用規約、プライバシーポリシーなどのユーティリティリンク
購入 CTA、購入復元リンク、法的リンクは フッター 内に配置してください。フッターは画面の下部に固定され、スクロールする要素の上に重なって表示されます。
ボタンを追加する
ボタンを追加するには:
- + をクリックして Button を選択します。
- ボタンの種類を選択します。
- 購入ボタン、リンク、閉じるボタンにはあらかじめアクションが設定されています。リンクについては、ユーザーの遷移先URLを設定してください。その他のボタンタイプについては、Interactions パネルに移動してください。そこの Button triggers セクションで、ボタンが実行するアクションを設定します。
- Design パネルでボタンのデザインを設定します。
ボタンの種類
購入ボタン
購入ボタンを機能させるには、プロダクトをスクリーンに紐付けて Products 要素を追加してください。詳しくはガイドをご覧ください。
購入ボタンは、ユーザーがスクリーンで選択したプロダクトのアプリ内課金を開始します。SDK がトランザクションを自動で処理するため、アプリのコードで購入処理を実装する必要はありません。
購入ボタンを追加するには：
- + をクリックして Button を選択し、ボタンのプリセットを選びます。
- ボタンを選択した状態で、右パネルの Interactions タブを開きます。
- Add trigger > On tap をクリックし、Add action をクリックします。
- Action を Purchase、Product を
products.selectedProductに設定します。products.selectedProduct変数は、画面上で現在選択されているプロダクトに常に解決されます。
購入ボタンにアニメーションを追加すると、より注目を集められます。ペイウォールビルダーは現在、Pulse アニメーションタイプをサポートしています。 デザインパネルでアニメーションスタイルを設定します。
リンク
Terms of Use および Privacy Policy ボタンには、Open URL アクションが組み込まれています。リンク先の URL はそこで設定してください。Open URL が空のままの場合やインラインリンクが未設定の場合、プレビューと公開がブロックされます。
一部のストア要件に対応するため、以下へのリンクを追加できます：
- 利用規約
- プライバシーポリシー
- 購入の復元 リンクを追加するには：
- + をクリックし、Button > Links を選択します。これにより、購入の復元またはURLを開くといったアクションがあらかじめ設定されたインラインボタンの行が追加されます。含まれているボタンがすべて必要でない場合は、レイヤーパネルで不要なものを削除してください。
-
次に、ボタンのアクションを設定します：
- Restore purchases ボタンは、すでに購入の復元を処理します。
- 残りの各リンクについて：
- ボタンをクリックして選択し、右側の Interactions タブに切り替えます。
- フィールドにURLを貼り付けます。
- デフォルトでは、URLはシームレスなユーザー体験のためにアプリ内ブラウザで開かれます。外部ブラウザに遷移させたい場合は、Open in external browser チェックボックスを選択してください。
フローを閉じる
Close ボタンをクリックすると、フローが自動的に閉じます。
閉じるボタンを追加するには、+ をクリックして Button > Close flow を選択してください。
Absolute ポジションを使用すると、閉じるボタンを画面の隅に配置できます。
フローを閉じるアクションを使って、他のボタンでもフローを閉じるよう設定できます。
カスタムボタン
追加できるすべてのボタンは、タップ時に任意のアクションを実行するように設定できます：
- 次の画面へ移動する
- アラートを表示する
- 変数を設定する
- 画面要素の表示・非表示を切り替える
- URLを開く
- 購入を復元する
- 条件付きアクションを実行する