General Configurations

Overview

In this document we mainly will right panel options.

Screen Setting

Screen Setting mainly used  to apply same property to all the screen controls.
In right panel tapping on page layout will open up the following window.

  • 1) Apply to screen’s all objects :Enabling this will give you option to change only those properties that are changed in this window.
  • Tapping on save will apply all the properties to all the controls.
  • 2) Properties : Different control’s property is given in this window to be  apply on the controls. Lets discuss about the properties.

Text Property

Below properties  are explained in detail in Label  Control. Please refer Controls - 2 Text document.

  1. Font Face
  2. Font Size
  3. Color

Button

Below properties  are explained in detail in button  Control. Please refer Controls - 3 Buttons Controls document.

  1. BackgroundColor
  2. Font Size
  3. Button State
  4. Title Color for all states
  5. Image for all states

Picker

Below properties  are explained in detail in button  Control. Please refer Controls - 3 Buttons document.

  1. BackgroundColor
  2. Font Size
  3. Button State
  4. Title Color for all states
  5. Image for all states

Application Layout

Application Layout mainly used  to apply same property to all controls of all the screens  of the app .
In right panel tapping on application layout will open up the following window.

  1. Apply to all screen objects : Enabling this will give you option to change only those properties that are changed in this window.
  2. Tapping on save will apply all the properties to all the controls.
  3. Properties : Only those common controls properties are available that are available in all the screen.

Base Navigation Bar

Below properties  are explained in detail in Navigation Bar  Control. Please refer Controls - 1 View  document.

  1. Background Color
  2. Background Image

Below properties  are explained in detail in Navigation button  Control. Please refer Controls - 3 Button  document.

  1. Background Color
  2. Background Image
  3. Font Face
  4. Font Size
  5. Button State
  6. Title Color for all states
  7. Image for all states

Below properties  are explained in detail in Label  Control. Please refer Controls - 2 Text document.

  1. Font Face
  2. Font Size
  3. Color

Text Property

Below properties  are explained in detail in Label  Control. Please refer Controls - 2 Text Controls document.

  1. Font Face
  2. Font Size
  3. Color

Button

Below properties  are explained in detail in button  Control. Please refer Controls - 3 Buttons Controls document.

  1. BackgroundColor
  2. Font Size
  3. Button State
  4. Title Color for all states
  5. Image for all states

Page Settings

Below properties  are explained in detail in View  Control. Please refer Controls - 1 View document.

  1. Background Color

Picker

Below properties  are explained in detail in button  Control. Please refer Controls - 3 Buttons Controls document.

  1. BackgroundColor
  2. Font Size
  3. Button State
  4. Title Color for all states
  5. Image for all states

Third Party

To integrate third party apis  you need to do few configuration in Third party Option in right side panel.
Tapping on Third Party will open up the following window.

A number of third party apis are provided here. You can make use of search to search the api.

Following are the list of Api that are provided in this window:

  1. Facebook
  2. Twitter
  3. Flurry
  4. Paypal
  5. AdMob
  6. Google+
  7. Linkedin
  8. Dropbox

Tap on done to add any of the above Api. In this document we will show the example of Facebook and Twitter .

Select on facebook and twitter and tap on done to configure the facebook  and twitter api in the app.
As per the selection  FB Application ID, Twitter OAuth and Twitter App URL need to be provided.

Tap on Save button  to save all the configuration.

This is very important while configuring the facebook or twitter or any other api in the app.

You need to provide proper data related to apis in this window for successful configuration in the app.

Push Notification

As the name itself suggests its a one kind of notification from any app that gives updates about any event in the app.

In the right panel there is a option to configure push notification in the app.
Tapping  on the push notification will open up the following window:

Tap on Add Push Notification  to configure datasource for the app to receive push notification.
Following window will open where you can configure datasource for push notification.

Note : Only those datasource will available that are having push notification module.

After successful configuration of the  datasource for the push notification you will get something like this in push notification window as shown in below image :

  1. Edit : Edit the configured datasource.
  2. Settings : This option will be used to configure actions when the push notification event  wil be received. Tapping on this will open the following window:
  3. Push Notification View

    • The action  related to this event will be called when user taps on the view button of the alert of the push notification or slides out the notification on the home screen of the device or taps on the view from the Notification tray.

    Double tap to add any action on this event.

  4. Delete : Delete the datasource.

Switch project and Rollback

This option is used to switch project and rollback the changes in the  screen.

Tapping on this will open up the following panel at the bottome :

Lets discuss about above image :

You can search the apps from the list of apps. To switch on to other project tap on any of the projects in the list. After tapping whole configuration of the selected project will be loaded in the window.

In this tool the summary of the last change of the UI of the current screen can be trace through this option.
You can revert back to previous change on the screenby tapping on this Dot button.
You can go back forth on this slider of changes  by tapping on the dot button.
After refreshing the page you won’t be able to trace the changes.