Components support different parameters depending on the component type. Refer to individual component documentation to see which parameters are supported.
style This is the most common parameter and defines the style class name. All components support this, but not all style parameters might not be supported in some edge cases (video for example).
onclick Second most commonly used parameter, which defines an action upon click. All components support this. This can be either one onclick object obtained with any of the $this->getOnclick helpers or an array of several onclicks. When array is defined, client will execute commands in order they are defined in the array. IMPORTANT NOTE HERE: some onclicks return an array (most notably route when it has saveparameters), whereas most onclicks will return and object.
variable Used by text, form elements and images. This helps client tie the data. For example, if you set a variable outside of the component, when variable is defined the value would get updated immediately. Common example case is where you have a clickable field which reveals a selector element that sets the value.
NOTE: you can use either actual variable id’s together with $this->getVariableId(‘name’) or give them as strings. If the variable is defined for the app, the client would always send id instead of the string. All async functionalities require that the variable exists for the app and they need to be defined by id, NOT STRING.
id Id of the element. This is used when showing or hiding elements with onclick, by swipestack and swipe components. If you have multiple swipe components in the view with a swipe indicator, they must have id’s defiend. If you only have one swipe element, the swipe navigation will default to that even without id.
hint Shows a hint on the background of “field-text” or “field-textview” if the components have no content. Uses the form style with opacity set to 0.6.
activation Initially or keep-open. Initially means that the text field is in focus when opening the view, keep-open will keep the focus in the form field and keyboard open even when the view is submitted.
submit_menu_id Menuid to submit when submit_on_entry is defined. This is available for your model as $this->getMenuId();
submit_on_entry Submit view when text is edited in the field. This can be used to make suggestive search for example. Note that filter is often a better option as it doesn’t require turnaround to the server.
update_on_entry Instructs the mobile client to update all linked components when the component value changes. Components are linked by setting the same “variable”.
filter_on_entry It can be either 1 or 0. When this flag is set on a field-text components the mobile client will filter out all 1st level components that has “filter” set and “filter” does not contain the current text in the field-text component.
input_type phone, number, name, uppercase, lowercase, email
autocorrect Either 0 or 1. Default is 0,
value Initial value of the field.
activation Initially or keep-open. Initially means that the text field is in focus when opening the view, keep-open will keep the focus in the form field and keyboard open even when the view is submitted.
maxlength Max length of the field content. Number of characters, also whitespace is counted.
disable_onclick_when_keypad_is_on This will disable all clickable items as long as the keyboard is open.
Example of defining a select element:
$selectstate_female = array('variable_value' => "male",'style' => 'selector_role_selected','allow_unselect' => 1,'animation' => 'fade');
$selectstate_male = array('variable_value' => "female",'style' => 'selector_role_selected','allow_unselect' => 1,'animation' => 'fade');
$col[] = $this->getText('{#female#}',array('variable' => 'gender','selected_state' => $selectstate_female,'style' => 'selector_role', 'active' => 1));
$col[] = $this->getVerticalSpacer('10%');
$col[] = $this->getText('{#male#}',array('variable' => 'gender','selected_state' => $selectstate_male,'style' => 'selector_role'));
$this->data->footer[] = $this->getRow($col,array('margin' => '14 40 31 40','text-align' => 'center'));
selected_state Parameters for this compoenent when its selected
allow_unselect Whether the option can be unselected
animation Fade or none
active If the element is currently active
other_variables An array with variable names. Its used when a component has “selected_state” and when selected it should also select all other components that has variable name that matches and item in this list
If the elements are using the same variable, it behaves like a radio button, if they have different variables, it acts as checkboxes.
image_fallback when clicked, change to this image immediately
lazy can load after view, shows a loader
tap_to_open will open a full screen image when clicked
tap_image image asset name to be used on the full screen view
Map component uses Google maps to display a map. Note that you need to define Google Maps API key in your app settings for this to work. Please refer to Google documentation:
position Lat, lon of the map position.
zoom Zoom level.
map_type roadmap, satellite, hybrid, terrain.
markers Array of map markers
autostart Starts video when entering the view.
showplayer Shows player controls.
loop Loops the video.
date Unix time
date_format For example MM / dd / yyyy
show_only_current_month Shows only the current month and won’t allow navigating between months
disable_swipe Disables the swipe in the calendar component and replaces it with buttons
selection_style Style name
weekend_style Style name
weekdays_style Style name
header_style Style name
today_style Style name
remember_position Remembers the position of the swiped page between refreshes and when navigating out from the action.
hide_scrollbar Hides bottom scroll bar
topbar_title Changes the action’s top bar. This must be defined for the main level of the element which is inside the swipe.
animation nudge. If this is set, the swipe component will make a small nudge movment when entering the view. This will hint user that the content is swipable.
active_color This is used to specify the color of the active dot in “swipe-navigation” component.
inactive_color This is used to specify the color of the inactive dots in “swipe-navigation” component
Swipe component is a very powerful component, which allows the actions to be recorded by the backend in an asynchronous manner. This provides seamless user experience when swiping items in the swipe stack.
leftswipeid Menuid to call when swiping an element left. Menuid is available with $this->getMenuId();
rightswipeid Menuid to call when swiping an element right. Menuid is available with $this->getMenuId();
upswipeid Menuid to call when swiping an element up. Menuid is available with $this->getMenuId();
downswipeid Menuid to call when swiping an element down. Menuid is available with $this->getMenuId();
prevswipeid Is set when the item is swiped. Its automatically assigned by the server to either leftswipeid or rightswipeid depending on which direction the item was swiped.
backswipeid Menuid to call when returning an element back from the swipe_back_content.
overlay_right A component that will be rendered on top of the card that the user is swiping.
overlay_left A component that will be rendered on top of the card that the user is swiping.
overlay_up A component that will be rendered on top of the card that the user is swiping.
overlay_down A component that will be rendered on top of the card that the user is swiping.
swipe_back_content An array with components that the user can swipe back. When the user do “swipe-back” the first item from this array will be returned to the ‘swipestack’ component with an animation.
Dynamic swipe component can call the server with following parameters on $_REQUEST:
swid
world_ending
backwards
merge_before
Component parameters:
dynamic Defines the element to be dynamically loading
world_ending Yes, really, don’t ask about parameter naming. This is the menuid that gets called when we are near the cached content ending. This is a que for the backend to provide more items.
id Id of the swipe container, needed for dynamic swipes
item_scale set this to 1 to have scaling effect when swiping
transition swipe
preserve_position preserve the swipe position between action refreshes
initial_swipe_id items need to have swipe_id defined in order to use this. Opens the swipestack on this page.
item_width width of the items
remember_position used by non-dynamic swipes. Remembers users position between action refreshes.
merge_data If this is set to 1, client will merge the new data based on swipe_id’s. This way the backend doesn’t need to fetch the entire swipe stack, only new items.
Best example of the swipestack you can find from action Mcalendar.
ad_size Sizes are:
– ‘banner’ => ‘{%small%} (320×50)’,
– ‘large’ => ‘{%large%} (320×100)’,
– ‘rectangle’ => ‘{%box%} (300×250)’,
ad_id required, ID as defined in the Google Ads console or AdColony
Remember to add variable for the slider. If you have also variable2 defined, this will display a range slider.
min_value Numeric. Minimum value to set.
max_value Numeric. Maximum value to set.
step Numeric. In what increments the slider moves.
hide_tooltip 1 or 0 whether the value is hidden when dragging the value
tooltip_prefix Prefix for the value. For example currency.
tooltip_suffix Suffix for the value. For example currency.
track_height Height of the slider itself, excluding thumbs.
left_track_color Hex. Color of the selected part.
right_track_color Hex. Color of the unselected part.
thumb_color Color for the slider’s handle.
thumb_image Use image instead of the default slider handle.
thumb_height Height for the slider’s handle.
variable2 Variable where second slider from the range slider is saved.
min_range Numeric. Minimum range for range slider
max_range Numeric. Maximum range for range slider
text_content Text content shown inside the bar. Styling the text is done by giving style parameters for the element itself.
progress_image Use image instead of the color for the progress bar itself.
progress_color Hex. Color for the inactive part of the progess bar.
track_image Use image instead of color for the active part.
track_color Hex. Color for the active part of the progess bar.
next_page_id You can access this with $this->getNextPageId() in the model. Use this to retrieve paged results.
lazy Lazy loading of the content, where we reveal the next page even if all content might not be fully loaded yet.
show_loader Whether to show the loader when reaching the end of the current page.
timer_id Id of the timer component. This needs to be defined, client uses this to keep track of the time on the client side.
submit_menu_id Menuid to call when countdown reaches zero
mode countdown. Count down instead of up. Default is to count up.