Если вы настроили пейвол с помощью Paywall Builder, вам не нужно думать о его рендеринге в коде мобильного приложения — всё необходимое уже содержится в самом пейволе: и что показывать, и как это показывать.

Чтобы показать пейвол, вызовите метод view.present() на объекте view, созданном методом createPaywallView. Каждый объект view можно использовать только один раз. Если нужно показать пейвол повторно, снова вызовите createPaywallView, чтобы создать новый экземпляр view.

const view = await createPaywallView(paywall);

view.setEventHandlers({
  onUrlPress(url) {
    window.open(url, '_blank');
    return false; 
  },
});

try {
  await view.present();
} catch (error) {
  // handle the error
}

Таймер, заданный разработчиком

Чтобы использовать таймеры, заданные разработчиком, в своём мобильном приложении, укажите timerId — в данном примере CUSTOM_TIMER_NY, Timer ID таймера, заданного разработчиком в дашборде Adapty. Это позволяет приложению динамически обновлять таймер с корректным значением — например, 13д 09ч 03м 34с (рассчитывается как время окончания таймера, например Новый год, минус текущее время).

const customTimers = { 'CUSTOM_TIMER_NY': new Date(2025, 0, 1) };

const view = await createPaywallView(paywall, { customTimers });

В этом примере CUSTOM_TIMER_NY — это Timer ID таймера, заданного разработчиком в дашборде Adapty. Таймер обеспечивает динамическое обновление значения в приложении — например, 13д 09ч 03м 34с (рассчитывается как время окончания таймера, например Новый год, минус текущее время).

Диалоговое окно

Используйте этот метод вместо стандартных диалоговых окон, когда на Android отображается пейвол. На Android обычные алерты появляются позади пейвола и становятся невидимы для пользователя. Данный метод гарантирует корректное отображение диалога поверх пейвола на всех платформах.

try {
  const action = await view.showDialog({
    title: 'Close paywall?',
    content: 'You will lose access to exclusive offers.',
    primaryActionTitle: 'Stay',
    secondaryActionTitle: 'Close',
  });
  
  if (action === 'secondary') {
    // User confirmed - close the paywall
    await view.dismiss();
  }
  // If primary - do nothing, user stays
} catch (error) {
  // handle error
}

Настройка стиля отображения на iOS

Настройте способ отображения пейвола на iOS, передав параметр iosPresentationStyle в метод present(). Параметр принимает значения 'full_screen' (по умолчанию) или 'page_sheet'.

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