ビルダーでオンボーディングをカスタマイズした場合、ユーザーに表示するためにモバイルアプリのコードでレンダリングを行う必要はありません。そのようなオンボーディングには、オンボーディング内で表示される内容とその表示方法が両方含まれています。

始める前に、以下を確認してください：

1. オンボーディングを作成している。
2. オンボーディングをプレースメントに追加している。

オンボーディングを表示する

オンボーディングを表示するには、createOnboardingView メソッドで作成した view に対して view.present() メソッドを使用します。各 view は一度しか使用できません。オンボーディングを再度表示する必要がある場合は、createOnboardingView をもう一度呼び出して新しい view インスタンスを作成してください。

try {
  const view = await createOnboardingView(onboarding);
  
  view.setEventHandlers({
    onClose: (actionId, meta) => {
      console.log('Onboarding closed:', actionId);
      return true; // Allow the onboarding to close
    },
    onCustom: (actionId, meta) => {
      console.log('Custom action:', actionId);
      return false; // Don't close the onboarding
    }
  });
  
  await view.present();
  console.log('Onboarding presented successfully');
} catch (error) {
  console.error('Failed to present onboarding:', error);
}

iOSの表示スタイルを設定する

present() メソッドに iosPresentationStyle パラメーターを渡すことで、iOSでのオンボーディングの表示方法を設定できます。このパラメーターには 'full_screen'（デフォルト）または 'page_sheet' を指定できます。

await view.present({ iosPresentationStyle: 'page_sheet' });

オンボーディング内のリンクの開き方をカスタマイズする

デフォルトでは、オンボーディング内のリンクはアプリ内ブラウザで開きます。これにより、ユーザーがアプリを切り替えることなくアプリ内でウェブページを閲覧できるシームレスなユーザー体験が提供されます。

外部ブラウザでリンクを開くことを希望する場合は、openIn パラメーターを browser_out_app に設定することでこの動作をカスタマイズできます：

await view.present({ openIn: 'browser_out_app' }); // default — browser_in_app

次のステップ

オンボーディングを表示したら、ユーザーのインタラクションとイベントを処理しましょう。オンボーディングイベントの処理方法を学んで、ユーザーのアクションに応答し、アナリティクスを追跡してください。