フローのプレビュー

フローをさまざまな画面タイプでプレビューする方法は2つあります：

• デバイスでプレビュー：開発のどの段階でも、実際のデバイスでフローの見た目を確認できます。
• Adapty ダッシュボードでプレビュー：デザイン中にフローをプレビューできます。

デバイスでプレビューする

実機でフローをプレビューするには:

1. iOS または Android 向け Adapty モバイルアプリをダウンロードする。
2. フロービルダーで Test on device をクリックする。

3. フローのロケールを選択する。
4. デバイスカメラで QR コードをスキャンするか、リンクを開く。Adapty モバイルアプリでフローが表示される。

トラブルシューティング

フローがプレビューで開かない場合、アクションの未完了、空のスクリーン、またはプロダクトが紐付けられていないことが主な原因です。詳細はよくある問題をご覧ください。

Adapty ダッシュボードでのプレビュー

フロービルダーのプレビューエリアを使って、さまざまな画面タイプでフローをプレビューできます。これにより、さまざまなデバイスや画面サイズでフローが適切に表示されることを確認できます。

プレビュー下のコントロールを使うと、次のことができます。

• プレビューするデバイスを選択する。
• 横向きと縦向きのプレビューモードを切り替える。
• ライトモードとダークモードを切り替える。
• ロケールを切り替える。

プロダクトとオファーのプレビュー

プレビューは、Adapty カタログからプロダクト変数を読み込みますが、これはデバイスが解決する内容の一部のみをカバーしています。

• prod_title は Adapty に保存されているプロダクトタイトルを表示します。prod_price と prod_price_per_* 変数は Adapty に保存されている米ドル建ての価格を表示します。ユーザーにはストアのローカライズされた価格が表示されます。
• offer_price、offer_billing_period、offer_full_duration は未解決のままとなるため、プレビューでは変数名が波括弧付きで表示されます（例：{{products.selectedProduct.offer_price}}）。これらの値は SDK がアプリ内でフローをレンダリングする際に渡されます。
• is_free_trial、is_pay_up_front、is_pay_as_you_go は、プロダクトカードで選択されたオファーに従います。オファーがない場合、3 つすべてが false になります。オファーがある場合、プレビューは従量課金（pay-as-you-go）として扱います。

オファータイプに関する条件はプレビューで切り替わりますが、デフォルトでは「pay-as-you-go」のブランチのみが表示されます。他のブランチを確認するには、支払いモードをシミュレートしてください：

1. キャンバス上で、オファーが設定されているプロダクトカードを選択します。
2. 右パネルの Product の下にあるオファードロップダウンを開きます。
3. Preview as の下で、Free trial、Pay up front、または Pay as you go を選択します。

これら3つの変数に関するすべての条件が、そのカードで選択されたモードで再レンダリングされます。Preview as は1つのプロダクトカードに対してのみ適用され、公開するフローには何も変更を加えず、カードのオファーを変更するとリセットされます。