AdaptyUI is an open-source framework that is an extension to the Adapty SDK that allows you to easily add purchase screens to your application. It’s 100% open-source, native, and lightweight.

Requirements

• react-native-adapty >=2.4.7

Installation

1. Add dependency to your project:

yarn add @adapty/react-native-ui

2. (iOS target) Install iOS pod

pod install --project-directory=ios/

Usage

0. Configure a paywall view in your Dashboard

Enable and configure no-code paywall as described in the docs.

1. Fetch a paywall

Fetch a paywall that has no-code paywall enabled as described in the SDK documentation.

import {adapty} from 'react-native-adapty';

try {
  const paywall = await adapty.getPaywall("YOUR_PAYWALL_ID");
} catch (error) {
  // handle the error
}

2. Create & configure a view

Create a view with a fetched paywall

import {createPaywallView} from '@adapty/react-native-ui';

const view = await createPaywallView(paywall);

Optionally, you can track any of the following events:

view.registerEventHandlers({
  onCloseButtonPress() { 
    // ...
    return true;
  },
  onPurchaseCompleted() {
    // ...
    return true;
  },
  onRestoreCompleted() {
    // ...
    return true;
  },
  onProductSelected() { /* ... */ },
  onPurchaseStarted() { /* ... */ },
  onPurchaseCancelled() { /* ... */ },
  onPurchaseFailed() { /* ... */ },
  onRestoreFailed() { /* ... */ },
  onRenderingFailed() { /* ... */ },
  onLoadingProductsFailed() { /* ... */ },
});

Returning true from an event callback dismisses (closes) a paywall modal & removes all event listeners for this view. Note the places, where return true; is provided — these events close a paywall modal by default.

3. Present a visual paywall

You can display and hide a modal using these methods consecutively:

view.present(); // shows a view

view.dismiss(); // hides a view

3. Full Documentation and Next Steps

We recommend that you read the full documentation. If you are not familiar with Adapty, then start here.

Contributing

• Feel free to open an issue, we check all of them or drop us an email at [email protected] and tell us everything you want.
• Want to suggest a feature? Just contact us or open an issue in the repo.

Like AdaptyUI?

So do we! Feel free to star the repo ⭐️⭐️⭐️ and make our developers happy!

License

AdaptyUI is available under the MIT license. Click here for details.