Gadgets utilized in this application

Sectioned Control Segments are upward tabs utilized for cell phones.
Framework Layout To adjust the substance of the application.
Camera To access the versatile camera to take pictures.
Picture To show the caught pictures.
List To access and show the contacts from the versatile.
Making a Mobile App
Click the Create button on the Project Listings page of WaveMaker, and select Mobile as a stage.
Project-Type hybrid mobile app development platform, 

Enter the name of the application, set a symbol to address your application, and give a short portrayal to the application.
Planning Base
Set the screen size to your beloved cell phone, or pass on it to default settings.
Simplified Segmented Control gadget on the material.
MobApp-layout1

Name the Titles to Camera and Contact separately, and erase the additional portions.

MobApp-layout2

Adding Camera
On the Camera’s fragment, simplified the camera gadget.

Select the Save To Gallery property for the camera gadget. This empowers the application to save pictures to the exhibition on your cell phone.

Select the Camera fragment and set Horizontal Align property to Align focus. This carries the camera to focus arrangement.

MobApp-segment1

Showing Captured Pictures
Intuitive the Grid Layout gadget. Utilize just a single section and eliminate the excess segments. Set the segment width to 12 and adjust focus. This permits you to adjust the image while showing.

Intuitive the Picture gadget onto the Grid Layout section and set the tallness and width to 150px.

MobApp-picprops

Tie the image source to Camera gadget and select the localFilePath property, and snap Bind.

cross-platform mobile application development tools 

Planning Contacts
To configuration contacts page, make a gadget variable and tie that to the rehashed areas of the rundown. Follow the means depicted underneath.

Go to the Contact section by tapping the Contact tab.
Make a Variable for Data Source
Click Variables from the header. Click New Variable and, select the Device type.

Create_Variables

For the Service type, select contacts from the dropdown.

Give a name to the variable; for instance, Device_Contacts, and snap Done.

MobApp-mobvar

Then, check the containers for Update information on input change and Request information on page burden, and save and close. This guarantees that the variable gets set off when you run the application.

Adding List Widget
Simplified the List gadget onto the Contact section.

For the Retrieve Data From choice, select Existing Variable.
For Select a variable, pick Device_Contacts as information source.
For Select information hub, click dataSet to choose, and click Next.
MobApp-listbind

Select layout as Actions List, and set pagination to Infinite Scroll. This guarantees that every one of the contacts load in a solitary page.

MobApp-listbind2

MobApp-listbind3

Set fields for the rundown. Select Name and set subtitle to displayName from the dropdown, and snap Done.

MobApp-listbind3

The rundown shows as continuing in the plan mode. Eliminate all superfluous components from the rundown, including picture gadget and offer symbol.

MobApp-segment2

Adding Repeated Sections of List
Intuitive one more List inside the List made in the past advance.

For the Retrieve Data From choice, select Existing Variable.
For Select a variable, pick Device_Contacts as information source.
For Select information hub, click phoneNumbers to choose, and click Next.
MobApp-segment2

Select layout as Actions List, and set pagination to Infinite Scroll. It’s obvious, venture 2 for adding list.

Set fields for the rundown. Select Name and set inscription to esteem from the dropdown, and snap Done. It’s just plain obvious, venture 3 for adding list.

In plan mode, the rundown inside-another-rundown should look as displayed beneath. Eliminate all superfluous components from the rundown, including picture gadget and offer symbol.

MobApp-segment2

See App
Run, to see the application.
NOTE
You can’t utilize the camera, or see any information in contacts. These are gadget explicit highlights that work in portable as it were.

 

Leave a Reply

Your email address will not be published.