Titanium.UI.iOS.Toolbar

Object of Titanium.UI.iOS.

Platform	Since
iPhone	0.8
iPad	0.8

Summary

An iOS toolbar, which can contain buttons and certain other controls.

Description

A toolbar can contain buttons, as well as certain other widgets, including text fields and labels.

To provide spacing between items in the toolbar, you can use the special iOS system button types, FIXED_SPACE and FLEXIBLE_SPACE.

Note that toolbars are positioned like other views (using the top and bottom properties, for example), but the iOS Human Interface Guidelines have specific requirements for placing toolbars: on iPhone, a toolbar should be at the bottom of the window. On the iPad, a toolbar should appear at the top or bottom of a window.

Use the Titanium.UI.iOS.createToolbar method to create a toolbar.

Code Examples

Simple Toolbar

The following code excerpt creates a simple toolbar, placed at the bottom of the window.

var send = Titanium.UI.createButton({
    title: 'Send',
    style: Titanium.UI.iPhone.SystemButtonStyle.DONE,
});
 
var camera = Titanium.UI.createButton({
    systemButton: Titanium.UI.iPhone.SystemButton.CAMERA,
});
 
var cancel = Titanium.UI.createButton({
    systemButton: Titanium.UI.iPhone.SystemButton.CANCEL
});
 
flexSpace = Titanium.UI.createButton({
    systemButton:Titanium.UI.iPhone.SystemButton.FLEXIBLE_SPACE
});
 
var toolbar = Titanium.UI.createToolbar({
    items:[send, flexSpace, camera, flexSpace, cancel],
    bottom:0,
    borderTop:true,
    borderBottom:false
}); 
win.add(toolbar);

Note the use of the flexible space for positioning the toolbar buttons -- the FLEXIBLE_SPACE button doesn't appear as a button, but a variable space between the controls on either side of it. Available space in the toolbar is divided between all of the flexible space buttons in the toolbar. Without the flexible spaces in this example, the toolbar buttons would be grouped tightly together on the left side of the toolbar.

Methods

Name	Summary
add	Adds a child to this view's hierarchy.
addEventListener	Adds the specified callback as an event listener for the named event.
animate	Animates this view.
convertPointToView	Translates a point from this view's coordinate system to another view's coordinate system.
fireEvent	Fires a synthesized event to any registered listeners.
hide	Hides this view.
remove	Removes a child view from this view's hierarchy.
removeEventListener	Removes the specified callback as an event listener for the named event.
show	Makes this view visible.
toImage	Returns an image of the rendered view, as a Blob.

Properties

Name	Type	Summary
anchorPoint	`Point`	Anchor point where animation should occur, relative to the view's boundaries.
animatedCenterPoint	`Point`	Current position of the view during an animation. read-only
backgroundColor	String	Background color of the view.
backgroundDisabledColor	String	Disabled background color of the view. (Android only.)
backgroundDisabledImage	String	Disabled background image for the view, specified as a local file path or URL. (Android only.)
backgroundFocusedColor	String	Focused background color of the view. (Android only.)
backgroundFocusedImage	String	Focused background image for the view, specified as a local file path or URL. (Android only.)
backgroundGradient	`Gradient`	A background gradient for the view.
backgroundImage	String	Background image for the view, specified as a local file path or URL.
backgroundLeftCap	Number	Size of the left end cap.
backgroundSelectedColor	String	Selected background color of the view.
backgroundSelectedImage	String	Selected background image url for the view, specified as a local file path or URL.
backgroundTopCap	Number	Size of the top end cap.
barColor	String	Background color for the toolbar.
borderBottom	Boolean	If `true`, a border is drawn on the bottom of the toolbar.
borderColor	String	Border color of the view.
borderRadius	Number	Border radius of the view.
borderTop	Boolean	If `true`, a border is drawn on the top of the toolbar.
borderWidth	Number	Border width of the view.
bottom	Number or String	View's bottom position, in platform-specific units.
center	`Point`	View's center position, in the parent view's coordinates.
focusable	Boolean	Whether view should be focusable while navigating with the trackball. (Android only.)
height	Number or String	View height, in platform-specific units.
items	Array<`Titanium.UI.View`>	An array of buttons (or other widgets) contained in the toolbar.
keepScreenOn	Boolean	Whether to keep the device screen on. (Android only.)
layout	String	Specifies how the view positions its children. One of: 'absolute', 'vertical', or 'horizontal'.
left	Number or String	View's left position, in platform-specific units.
opacity	Number	Opacity of this view, from 0.0 (transparent) to 1.0 (opaque).
right	Number or String	View's right position, in platform-specific units.
size	Object	Size of the view as a dictionary of width and height properties.
softKeyboardOnFocus	Number	Determines keyboard behavior when this view is focused. (Android only.)
top	Number or String	The view's top position.
touchEnabled	Boolean	Whether view should receive touch events.
transform	Object	Transformation matrix to apply to the view.
translucent	Boolean	If `true`, a translucent background color is used for the toolbar.
visible	Boolean	Boolean value indicating whether the view is visible.
width	Number or String	View's width, in platform-specific units.
zIndex	Number	the z index position relative to other sibling views

Events

Name	Summary
click	Fired when the device detects a click against the view.
dblclick	Fired when the device detects a double click against the view.
doubletap	Fired when the device detects a double tap against the view.
longclick	Fired when the device detects a long click. (Android only.)
longpress	Fired when the device detects a long press.
pinch	Fired when the device detects a pinch gesture.
singletap	Fired when the device detects a single tap against the view.
swipe	Fired when the device detects a swipe gesture (left or right) against the view.
touchcancel	Fired when a touch event is interrupted by the device.
touchend	Fired when a touch event is completed.
touchmove	Fired as soon as the device detects movement of a touch.
touchstart	Fired as soon as the device detects a touch gesture.
twofingertap	Fired when the device detects a two-finger tap against the view.