ui ‐ Web Components For iOS [DRAFT] - cobocombo/Scriptit-Core GitHub Wiki

This module provides a simple and intuitive way to build native feeling GUIs for iOS. It is modeled and built on the Onsen UI JavaScript component library. Each component has it's own class with a variety of properties and methods to build beautiful iOS apps. Almost all properties can be defined in the constructor of the component, or separately after the main object has been defined. For example:

let button = new ui.Button({ text: 'Tap Me!' });

is the same as:

let button = new ui.Button();
button.text = 'Tap Me!';

---

ActionSheet

The action sheet is a component used for displaying a list of options and asking the user to make a decision. It is composed of ActionSheetButtons that are customizable and can accept functions as actions.

Properties

• buttons: Array of ActionSheetButtons.
• cancelTextColor: The text color of the cancel button. Any valid CSS color value will be accepted.
• title: Title of the sheet shown above the buttons.

Methods

• dismiss ({ animated = true }): Method to dismiss the action sheet.
• present ({ animated = true }): Method to present the action sheet.

Usage

let shareButton = new ui.ActionSheetButton({ text: 'Share'});
let deleteButton = new ui.ActionSheetButton({ text: 'Delete', textColor: 'red' });
let sheet = new ui.ActionSheet({ title: 'Action Sheet Example', buttons: [ shareButton, deleteButton ] });
sheet.present();

---

ActionSheetButton

Properties

• onTap: Function to be called when the user taps the button.
• text: Text to be displayed inside the button.
• textColor: The text color of the button. Any valid CSS color value will be accepted.

Usage

let savebutton = new ui.ActionSheetButton();
saveButton.text = 'Save';
saveButton.textColor = 'green';
saveButton.onTap = () => { console.log('Save button tapped!') };