This is an overview of the most common usage of ActionBar. For more information about the available properties, methods, or events, head over to the complete API documentation for ActionBar.
<ActionBar>
is a UI component that provides a toolbar at the top of the activity window.
This component is the NativeScript abstraction for the Android app bar and the iOS navigation bar.
<ActionBar title="MyApp" />
<ActionBar>
<StackLayout orientation="horizontal">
<Image src="res://icon" width="40" height="40" verticalAlignment="center" />
<Label text="NativeScript" fontSize="24" verticalAlignment="center" />
</StackLayout>
</ActionBar>
<ActionBar title="My App" android.icon="res://icon" android.iconVisibility="always" />
By default, a border is drawn at the bottom of the <ActionBar>
. In addition to the border, on iOS devices a translucency filter is also applied over the <ActionBar>
.
To remove this styling from your app, you can set the flat
property to true
.
<ActionBar title="My App" flat="true" />
Name | Type | Description |
---|---|---|
title | String | Gets or sets the title shown in the bar. |
android.icon | String | Gets or sets the icon to be shown on Android devices. |
android.iconVisibility | String | Gets or sets icon visibility on Android devices. |
flat | boolean | Removes the border on Android and the translucency on iOS. Default value is false . |
Android | iOS |
---|---|
android.widget.Toolbar | UINavigationBar |