Customize Folder Backgrounds

Your users connect to the application on different types of devices (mobile phones, computers, tablets, etc.), so there is no standard wallpaper size to integrate into the application.
That is why we have implemented a wallpaper composition system consisting of layers that can be perfectly adapted to all screen sizes.

What is a layer? To simplify: it's an image.

This system allows you to compose a customized background with multiple layers that will overlap to create your new folder background!

You can even add a video background!

Creation Process with Layers:

1/ From your Studio, edit the folder by clicking on the icon.

More convenient and quicker for previewing your background at each level of the hierarchy!

2/ Click on "Create a New Background" 

and then "Add a New Layer." 

Note: Click "Create a Background from Existing" if you want to keep the current background.

3/ Layers overlap to form your new background.

Preview

Your background is displayed instantly! You can see the result for different device types in portrait or landscape. You can adjust and refine your elements right away, saving a considerable amount of time!

Position

On each layer, you can choose where on the screen the image should appear (bottom left or right, center, etc.).

Resizing

On each layer, you can modify the appearance of the image with the following options:

• Cover Entire Screen

The image on this layer will take up the entire screen size.

If the image is too small, it will be stretched to fill the screen.

If the image is larger than the screen, parts of the image will be cropped.

• Fit Within Screen

Your image is entirely visible on the screen, without being cut or distorted. If your image is taller than it is wide, two white bars will appear on your application (on the right and left).

Example : 

• Width (33% / 50% / 66% / 100%)

The image will be resized and displayed based on the selected percentage of the screen width.

Make sure to choose the placement of this layer on the image.

Example 33% :

• Height (33% / 50% / 66% / 100%)

The image is resized based on the chosen percentage of the screen height. Make sure to choose the placement of this layer on the image.

Example 66%: The image is displayed in the middle and covers 66% of the screen height.

• Navigation Bar Height (x2 / x3)

The image is as wide as the application's navigation bar. Choosing x2 or x3 will enlarge the image compared to the navigation bar.

Additional Features

•  How to delete a layer?  Click on the red cross.

• How to change a layer while keeping the settings?  Use the "Replace" button.  

You can also download on your computer the layer using the "Download" button.

• How to add a link to a background element?  Double click on the name of the image.

You can link an image to a content or subfolder in the current folder.