Splash Screen with Full Image

1. Upload Full Image

• Click to upload the image. The image should be of size 1280x1920 pixels.

• The image will be adjusted automatically according to the mobile.

2. Splash Background Color

Select the background color for splash screen.

When you turn on the Enable Gradient toggle, additional customizations will appear.

- Color

• You have to select the two colors to create a perfect gradient effect.

- Gradient

• Select from the given different gradient effects. You can also create your own gradient effect by clicking on the “+” icon.

• By clicking on the “+” icon, two options will appear.

1. Type

• You have to select the type of gradient effect. It includes Linear, Radial, and Diagonal.

• You can also adjust the direction of the gradient effect by clicking on the “Degrees” option. It includes 45, 135, 225, and 315.

2. Stops

You can control how the two colors will be distributed in the gradient. You can control them using the % of the colors and how much effect they will have on the screen.

3. Advanced Splash Configuration

Select the splash appearance for the screen.

Hide Splash When

1. On Page Load Progress

The splash screen will disappear based on how much of the page is being loaded.

Settings To Hide Splash when On Page Load Progress

- Load Threshold

You have to define how much of your website content will load before the splash screen disappears.

- Minimum Display Time

You can control the minimum number of seconds the splash screen will be visible on the screen.

- Fade Out Animation

You can control the splash screen so it does not disappear suddenly. It should disappear smoothly. You can control this with two options: 200 ms and 500 ms.

2. After Fixed Duration

The splash screen will disappear after a fixed duration.

Settings To Hide Splash when After Fixed Duration

- Duration

You have to select the time for the splash screen to be visible on the screen. It includes 1, 2, 3, 4, and 5 seconds.

- Fade Out Animation

You can control the splash screen so it does not disappear suddenly. It should disappear smoothly. You can control this with two options: 200 ms and 500 ms.

3. On JavaScript Trigger

The splash screen will only disappear when the JavaScript is triggered.

Settings To Hide Splash when on JavaScript Trigger

- JS Trigger Configuration

You have to configure the JavaScript custom function on your website. So that it runs when your website is ready to display. Visit the Developer Documentation (opens in a new tab) for the integration.

- Fallback Timeout

You have to select the duration of the splash screen to hide if the JS code is not triggered. It includes 5, 8, 10, and 15 seconds of duration.

- Fade Out Animation

You can control the splash screen so it does not disappear suddenly. It should disappear smoothly. You can control this with two options: 200 ms and 500 ms.

Click on the “Save & Rebuild” button to save the changes and reflect in your app. After clicking on this button, you have to download the app again.

Preview