Kuika platform has the infrastructure that will enable you to add hybrid web screens to your mobile applications. Thanks to this infrastructure, you can make the elements and features that you use in web screens but are not available in mobile applications work with hybrid solutions.
This training content consists of the following topics:
Creating a mobile application.
Adding web screens to create a hybrid screen.
Mobile Application Creation
After logging in to the Kuika platform, click on the “New Apps” button to create a new mobile application via the “Apps” screen.
Enter a name for the application.
Select “Mobile compatible app” and then click on the “CREATE” button in the lower right corner.
For example, when you search for the “GaugeChart” element from the “Elements” panel in the “UI Design” module, it will not appear because this element can only be used in web applications. In order to use the “GaugeChart” element, you need to create a hybrid screen.
Adding Hybrid Web Screens to Mobile Apps
Open the “Screens” section on the left side of the “UI Design” module.
Click on the “+” icon next to “WEB SCREENS”.
Select “New Screen”. Then give a name and click on the “CREATE” button.
4. In the “Web Screen” screen that opens, you can now use the “GaugeChart” element from the “Elements” panel on the left side while in the “UI Design” module.
Drag and drop the “GaugeChart” element to “Web Screens”.
Go to the main page of your application and drag and drop a “Button” element from the “Elements” panel on the left side. Then give the button a name like “Navigate to New Screen”.
Add “Onclick>Navigation>Navigate” action to the Navigate to New Screen button from the “+ADD ACTION” drop-down menu in the “Properties” panel on the right side.
Add the web screen you created from the “To Screen” field as the target screen. (For example; KuikaWebScreen)
You can preview your application by clicking the “RUN” button in the upper right corner.
When you view the main screen, click on the button named “navigate to new screen”.
11. After clicking the button, you can switch to the new screen and view the “GaugeChart” element.
