Convert to Mobile

If you want your end users to use your App on Dragonce Mobile App, you must create the mobile version of the pages first. In the Page Builder, you can convert a page to a mobile version, which can be inserted into the Mobile App Page List.

Click 'Mobile View' on the top right corner of the Page Builder. Then, click 'Save'.

You will see the preview of the mobile pages. A page in the web version may be converted into several mobile pages. All form, table and calendar will be converted into a mobile page.

Here are the meaning of the controls in the picture:

Refresh

Reset the page to the last updated version.

Widget List

List of widgets in the current page arranged according to the layers they are placed in.

Page Data Source

Set up data source from other forms to insert the data into widgets on the current page.

Know More: Data Source

Value Stock

Widgets value can be stored as temporary data.

Value Stock

Widgets value can be stored as temporary data.

Activity Log

The history of all actions taken by the App Designer on the page.

Save

Save changes.

Reset

Reset all mobile pages back to default settings.

Clear

Clear and remove all mobile pages created.

Web View

Go back to the Page Builder of the web version of the page.

Back to Page List

Leave without saving.

Mobile Page Visibility Setting

When you click on the mobile page, there are 2 visibility setting buttons on the left hand corner.

Set All Widget Invisible: All widgets in the mobile page will be invisible to the user.
Set All Widget Visible: All widgets in the mobile page are visible to the user. This is the default visibility setting to all mobile pages. When users select ‘Set All Widget Visible’, the button will be displayed in grey.

Form Settings

If the Page Builder contains a Form, it will open a separate mobile page with the heading ‘Application Name' for you to configure. You can click on the widget, and the Quick Settings Panel will appear, allowing you to make the necessary adjustments.

Form

Web-Version Name: Set up the displayed name of the form in the mobile page
Form Name Alignment: Adjust the alignment of names within the web version.

Widget

Web-Version Name: Set up the displayed name of the widget in the mobile page
Visibility: When users change the visibility setting of a widget to invisible, the widget will no longer be visible to the user. By default, widgets are set to visible. You can make a widget invisible by clicking on it once.
Widget Name Alignment: Adjust the alignment of names within the web version.

Form Table Settings

If the Page Builder contains a Form Table, it will open a separate mobile page with the heading 'Table Name' for you to configure the Form Table. You can click on the Form Table, and the Quick Settings Panel will appear, allowing you to make the necessary adjustments.

Filters

For tables, calendars and charts, you can click "Filter" on their Quick Settings Panel to configure their Filter Settings. By this setting, users can filter out wanted records instead of searching all records from the table or calendar. For example, for Leave Calendar, users can filter out leave records for Sick Leave only.

Table Layout

For reference tables and other tables, you can click on their Quick Settings Panel to configure their table layout:

1. Choose a layout style from the 4 options.

2. Choose widget(s) as the header, description 1 and 2. The value in these widgets in each form record will be shown as the header and description.

3. Click ‘Submit’.

Record Creation Settings Override

For form tables, the table Record Creation Settings in mobile can be overridden by customizing the Add button.

Remove Button

Delete the form table from the mobile app page.

Page updated

Report abuse