# Native Notification Screen

The Native Push Notification Screen allows your app users to see a list of all the push notifications you’ve sent them. This feature ensures that users never miss an important update, offer, or message from your app.

{% hint style="danger" %}
This feature is not available to test in the **Preview App**. To test it, request a new build and install the APK on an Android device or use TestFlight to install the iOS app on an iPhone.
{% endhint %}

<figure><img src="https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FT3X9eAqOeI7Lepq6aQjZ%2FScreenshot%202025-12-13%20at%205.03.05%E2%80%AFPM.png?alt=media&#x26;token=fec5e0d6-eb7f-43c3-b11e-317a9a5bf29f" alt=""><figcaption></figcaption></figure>

## <mark style="color:green;">How to setup Native Notification Screen?</mark>

### Screen Customization

#### Screen Title

Enter the title you want for the notification screen (e.g., “Notifications” or “Updates”). This will appear at the top of the screen.&#x20;

#### Screen background color

Set the background color of the notification screen.

* **Background Color:** Choose a color using the color picker or enter a hex code.
* **Opacity:** Adjust transparency if required.

#### Unread indicator color

Choose the color for the unread notification dot.

![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FK72aiuEZas63hrQyczdZ%2FScreenshot%202025-12-13%20at%205.06.06%E2%80%AFPM.png?alt=media\&token=4c2942fb-c454-4877-95bb-7362e246b9b1)![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FssbdI5blzDRu6BqUCOHM%2FScreenshot%202025-12-13%20at%205.18.04%E2%80%AFPM.png?alt=media\&token=1ffe4f9f-ddba-4a26-92fb-66c273713cb4)

#### Push title

The **Push Title** controls the typography used for notification titles.

You can fully customize how the title text appears:

* **Text Style:** Choose a predefined style or select **Custom** for manual control.
* **Font Size:** Set the size of the push notification title text.
* **Font Weight:** Choose the emphasis level (e.g., Regular, Medium, Bold).
* **Font Style:** Available only for **Premium plan users**. Select a custom font family to enhance visual branding.
* **Text Color:** Pick a color using the color picker or hex code.

![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FP2v9J3qx2IlDA2JhklSp%2FScreenshot%202025-12-13%20at%205.06.50%E2%80%AFPM.png?alt=media\&token=1d3f1fe0-b8a6-4f70-85bd-58695cbb6e25)![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FRIK8X189TyNpRL7x2yzy%2FScreenshot%202025-12-13%20at%205.16.00%E2%80%AFPM.png?alt=media\&token=6e53690a-a4fc-471d-b7fc-57a9360de21f)

#### Push message

The **Push Message** defines the styling of the notification body text.

Available customization options:

* **Text Style:** Choose **Default** or **Custom**.
* **Font Size:** Set an appropriate size for message readability.
* **Font Weight:** Control text emphasis.
* **Font Style (Premium):**\
  Available only for **Premium plan users** to apply custom font families.
* **Text Color:** Select a color using a hex code or color picker.

![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2F1weUOUnE9N7ngYdymHYJ%2FScreenshot%202025-12-13%20at%205.23.46%E2%80%AFPM.png?alt=media\&token=29e20ba0-cd1c-4e06-80f2-853bf1faefcc)![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FLa9Afjbu45qaDrL9zaPF%2FScreenshot%202025-12-13%20at%205.25.01%E2%80%AFPM.png?alt=media\&token=e19650f4-3e24-4292-9911-ff8a8495d22d)

## <mark style="color:green;">How to add Notification Screen in the app?</mark>

{% tabs %}
{% tab title="Native Notification Screen Button" %}
Check [**Native Notification Screen Button**](https://help.twinr.dev/screen-customization/tab-bar/navigation-bar/navigation-bar-buttons/native-notification-screen-button) documentation.
{% endtab %}

{% tab title="Custom URL" %}
1.) Go to Navigation Bar and add [linker button](https://help.twinr.dev/screen-customization/tab-bar/navigation-bar/navigation-bar-buttons/linker-button) Add **nativepushscreen://twinr.dev** in URL field as shown below.

<figure><img src="https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2Fa0FeHUwPvkHKsqcfSW2w%2FScreenshot%202025-02-22%20at%203.11.08%E2%80%AFPM.png?alt=media&#x26;token=cad9a8e9-3da1-48b5-abfe-78db2f448c94" alt="" width="563"><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}