The UI controls that appear in the center region of the header. If centerItems is not empty, and titleAlign is HorizontalAlign.CENTER, the title text renderer will be hidden.

In the following example, a settings button is displayed in the center of the header:

var settingsButton:Button = new Button();
settingsButton.label = "Settings";
settingsButton.addEventListener( Event.TRIGGERED, settingsButton_triggeredHandler );
header.centerItems = new <DisplayObject>[ settingsButton ];

The default value is null.

Determines if the leftItems, centerItems, and rightItems are disposed or not when the header is disposed.

If you change this value to false, you must dispose the items manually. Failing to dispose the items may result in a memory leak.

The default value is true.

The default IStyleProvider for all Header components.

The default value is null.

See also

The value added to the styleNameList of each of the header's items. This variable is protected so that sub-classes can customize the item style name in their constructors instead of using the default style name defined by DEFAULT_CHILD_STYLE_NAME_ITEM.

See also

The UI controls that appear in the left region of the header.

If leftItems is not empty, and titleAlign is HorizontalAlign.LEFT, the title text renderer will appear to the right of the left items.

In the following example, a back button is displayed on the left side of the header:

var backButton:Button = new Button();
backButton.label = "Back";
backButton.styleNameList.add( Button.ALTERNATE_STYLE_NAME_BACK_BUTTON );
backButton.addEventListener( Event.TRIGGERED, backButton_triggeredHandler );
header.leftItems = new <DisplayObject>[ backButton ];

The default value is null.

The number of text lines displayed by the header. The component may contain multiple text lines if the text contains line breaks or if the wordWrap property is enabled.

See also

The UI controls that appear in the right region of the header.

If rightItems is not empty, and titleAlign is HorizontalAlign.RIGHT, the title text renderer will appear to the left of the right items.

In the following example, a settings button is displayed on the right side of the header:

var settingsButton:Button = new Button();
settingsButton.label = "Settings";
settingsButton.addEventListener( Event.TRIGGERED, settingsButton_triggeredHandler );
header.rightItems = new <DisplayObject>[ settingsButton ];

The default value is null.

The text displayed for the header's title.

In the following example, the header's title is set:

header.title = "I'm a Header";

The default value is "".

See also

A function used to instantiate the header's title text renderer sub-component. By default, the header will use the global text renderer factory, FeathersControl.defaultTextRendererFactory(), to create the title text renderer. The title text renderer must be an instance of ITextRenderer. This factory can be used to change properties on the title text renderer when it is first created. For instance, if you are skinning Feathers components without a theme, you might use this factory to style the title text renderer.

If you are not using a theme, the title factory can be used to provide skin the title with appropriate text styles.

The factory should have the following function signature:

function():ITextRenderer

In the following example, a custom title factory is passed to the header:

header.titleFactory = function():ITextRenderer
{
    var titleRenderer:TextFieldTextRenderer = new TextFieldTextRenderer();
    titleRenderer.textFormat = new TextFormat( "_sans", 12, 0xff0000 );
    return titleRenderer;
}

The default value is null.

See also

An object that stores properties for the header's title text renderer sub-component, and the properties will be passed down to the text renderer when the header validates. The available properties depend on which ITextRenderer implementation is returned by textRendererFactory. Refer to feathers.core.ITextRenderer for a list of available text renderer implementations.

In the following example, some properties are set for the header's title text renderer (this example assumes that the title text renderer is a BitmapFontTextRenderer):

header.titleProperties.textFormat = new BitmapFontTextFormat( bitmapFont );
header.titleProperties.wordWrap = true;

If the subcomponent has its own subcomponents, their properties can be set too, using attribute @ notation. For example, to set the skin on the thumb which is in a SimpleScrollBar, which is in a List, you can use the following syntax:

list.verticalScrollBarProperties.@thumbProperties.defaultSkin = new Image(texture);

Setting properties in a titleFactory function instead of using titleProperties will result in better performance.

The default value is null.

See also

The value added to the styleNameList of the header's title text renderer. This variable is protected so that sub-classes can customize the title text renderer style name in their constructors instead of using the default style name defined by DEFAULT_CHILD_STYLE_NAME_TITLE.

To customize the title text renderer style name without subclassing, see customTitleStyleName.

See also

The text renderer for the header's title.

For internal use in subclasses.

See also

Constructor.

If the component's dimensions have not been set explicitly, it will measure its content and determine an ideal size for itself. If the explicitWidth or explicitHeight member variables are set, those value will be used without additional measurement. If one is set, but not the other, the dimension with the explicit value will not be measured, but the other non-explicit dimension will still need measurement.

Calls saveMeasurements() to set up the actualWidth and actualHeight member variables used for layout.

Meant for internal use, and subclasses may override this function with a custom implementation.

Creates and adds the titleTextRenderer sub-component and removes the old instance, if one exists.

Meant for internal use, and subclasses may override this function with a custom implementation.

See also

Determines if the text wraps to the next line when it reaches the width (or max width) of the component.

In the following example, the header's title is wrapped:

header.wordWrap = true;

The default value is false.

The alignment of the items vertically, on the y-axis.

In the following example, the header's vertical alignment is set to the middle:

header.verticalAlign = VerticalAlign.MIDDLE;

The default value is feathers.layout.VerticalAlign.MIDDLE.

See also

If enabled, the header's top padding will be increased to account for the height of the OS status bar when the app is rendered under the OS status bar. The header will not add extra padding to apps that aren't rendered under the OS status bar.

iOS started rendering apps that aren't full screen under the OS status bar in version 7.

In the following example, the header's padding will account for the iOS status bar height:

header.useExtraPaddingForOSStatusBar = true;

The default value is false;.

See also

Space, in pixels, between the title and the left or right groups of items. If NaN (the default), the default gap property is used instead.

In the following example, the header's title gap is set to 20 pixels:

header.titleGap = 20;

The default value is NaN.

See also

The preferred horizontal position of the title.

If titleAlign is set to HorizontalAlign.LEFT, but leftItems is not empty, the title will be positioned slightly to the right of the left items. If centerItems is also not empty, the title will not be displayed.

If titleAlign is set to HorizontalAlign.RIGHT, but rightItems is not empty, the title will be positioned slightly to the left of the right items. If centerItems is also not empty, the title will not be displayed.

If titleAlign is set to HorizontalAlign.CENTER, but centerItems is not null, the title will not be displayed.

In the following example, the header's title alignment is set to prefer the left side:

header.titleAlign = HorizontalAlign.LEFT;

The default value is feathers.layout.HorizontalAlign.CENTER.

See also

Space, in pixels, between items. The same value is used with the leftItems and rightItems.

Set the titleGap to make the gap on the left and right of the title use a different value.

In the following example, the header's gap between items is set to 20 pixels:

header.gap = 20;

The default value is 0.

See also

The minimum space, in pixels, between the header's left edge and the header's content.

In the following example, the header's left padding is set to 20 pixels:

header.paddingLeft = 20;

The default value is 0.

See also

The minimum space, in pixels, between the header's bottom edge and the header's content.

In the following example, the header's bottom padding is set to 20 pixels:

header.paddingBottom = 20;

The default value is 0.

See also

The minimum space, in pixels, between the header's right edge and the header's content.

In the following example, the header's right padding is set to 20 pixels:

header.paddingRight = 20;

The default value is 0.

See also

The minimum space, in pixels, between the header's top edge and the header's content.

In the following example, the header's top padding is set to 20 pixels:

header.paddingTop = 20;

The default value is 0.

See also

Quickly sets all padding properties to the same value. The padding getter always returns the value of paddingTop, but the other padding values may be different.

In the following example, the header's padding is set to 20 pixels:

header.padding = 20;

The default value is 0.

See also

The font styles used to display the title's text.

In the following example, the font styles are customized:

header.fontStyles = new TextFormat( "Helvetica", 20, 0xcc0000 );

Note: The starling.text.TextFormat class defines a number of common font styles, but the text renderer being used may support a larger number of ways to be customized. Use the titleFactory to set more advanced styles.

The default value is null.

See also

The font styles used to display the title's text when the header is disabled.

In the following example, the disabled font styles are customized:

header.disabledFontStyles = new TextFormat( "Helvetica", 20, 0x999999 );

Note: The starling.text.TextFormat class defines a number of common font styles, but the text renderer being used may support a larger number of ways to be customized. Use the titleFactory to set more advanced styles on the text renderer.

The default value is null.

See also

A style name to add to the header's title text renderer sub-component. Typically used by a theme to provide different styles to different headers.

In the following example, a custom title style name is passed to the header:

header.customTitleStyleName = "my-custom-header-title";

In your theme, you can target this sub-component style name to provide different styles than the default:

getStyleProviderForClass( BitmapFontTextRenderer ).setFunctionForStyleName( "my-custom-header-title", setCustomHeaderTitleStyles );

The default value is null.

See also

A background to display when the header is disabled. If the property is null, the value of the backgroundSkin property will be used instead.

In the following example, the header's disabled background skin is set to a Quad:

header.backgroundDisabledSkin = new Quad( 10, 10, 0x999999 );

The default value is null.

See also

A display object displayed behind the header's content.

In the following example, the header's background skin is set to a Quad:

header.backgroundSkin = new Quad( 10, 10, 0xff0000 );

The default value is null.

See also

The default value added to the styleNameList of the header's items.

See also

The default value added to the styleNameList of the header's title text renderer.

See also