Introduction

The AI Assistant property allows to generate UI for your Ionic apps created with Appery.io and is available for the Content and Html components only.

Working with AI Assistant Property

Content Example

In this sample, using the AI Assistant property is demonstrated for using with the Content component.

1. In the DESIGN panel of the App Builder Screen1 page, select the Content component.
2. Go to the PROPERTIES view on the right to check out the AI Assistant property.
3. Now, click the corresponding AI Assistant button.
4. The AI Assistant editor will open in the modal window:

6. From the drop-down menu on the right, select the language for your request, then enter your query or use speech recognition to input your request.

6. Click Generate.
7. The requested form is generated:

👍

TIP

You can use the tooltip for more request examples:

HTML Example

For this example, we will use the Html component.

1. In the DESIGN panel of the App Builder Screen1 page, go to the PALETTE panel on the left.
2. Drag the Html component and drop to the Content area.
3. Select the Html component and click the AI Assistant button on the right.
4. In the AI Assistant editor, enter the following query: Generate a form for editing the data of the following object:{_id: "someid", name: "2-100 symbols", description: "10-1000 symbols", date: "03.10.2025"}
5. Hit Generate:

5. Now, check that the AI Assistant option did the trick and the Html component is instantly filled with all the nested components defined by the query above:

📘

NOTE

Enable the Generate new variables/methods checkbox to automatically create new variables/functions needed for new UI elements.

These variables/functions will be automatically added to the CODE tab and can be renamed at any time.