Application Bar

The app bar, also known as the action bar, is one of the most important design elements in your app's activities, because it provides a visual structure and interactive elements that are familiar to users. Using the app bar makes your app consistent with other Android apps, allowing users to quickly understand how to operate your app and have a great experience. The key functions of the app bar are as follows:

• A dedicated space for giving your app an identity and indicating the user's location in the app.
• Access to important actions in a predictable way, such as search.
• Support for navigation and view switching (with tabs or drop-down lists).

In its most basic form, the action bar displays the title for the activity on one side and an overflow menu on the other. Even in this simple form, the app bar provides useful information to the users, and helps to give Android apps a consistent look and feel.

Add a Toolbar to an Activity

1. Add the v7 appcompat support library to the project
2. Make the Activity extend AppCompatActivity:

   class MyActivity : AppCompatActivity() {
   // ...
   }
   

   3, in the app manifest, set the element to use one of appcompat's NoActionBar themes. Using one of these themes prevents the app from using the native ActionBar class to provide the app bar. For example:

   <application
    android:theme="@style/Theme.AppCompat.Light.NoActionBar"
    />
   

3. Add a Toolbar to the activity's layout. For example, the following layout code adds a Toolbar and gives it the appearance of floating above the activity:

   <android.support.v7.widget.Toolbar
   android:id="@+id/my_toolbar"
   android:layout_width="match_parent"
   android:layout_height="?attr/actionBarSize"
   android:background="?attr/colorPrimary"
   android:elevation="4dp"
   android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
   app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
   

4. In the activity's onCreate() method, call the activity's setSupportActionBar() method, and pass the activity's toolbar. This method sets the toolbar as the app bar for the activity. For example: ```kotlin

override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_my) // Note that the Toolbar defined in the layout has the id "my_toolbar" setSupportActionBar(findViewById(R.id.my_toolbar)) }

## Add Action Buttons

Menu items are defined as XML menu resources. To create an action bar, create a XML file in the `res/menu/` directory.

```xml
<menu xmlns:android="http://schemas.android.com/apk/res/android" >

    <!-- "Mark Favorite", should appear as action button if possible -->
    <item
        android:id="@+id/action_favorite"
        android:icon="@drawable/ic_favorite_black_48dp"
        android:title="@string/action_favorite"
        app:showAsAction="ifRoom"/>

    <!-- Settings, should always be in the overflow -->
    <item android:id="@+id/action_settings"
          android:title="@string/action_settings"
          app:showAsAction="never"/>

</menu>

app:showAction controls how buttons are displayed:

• ifRoom: the action is displayed as a button if there is room in the app bar for it; if there is not enough room, excess actions are sent to the overflow menu
• Always: This button is always placed in an application bar
• Never: This button is never placed in an application bar
• collapseAction View: This button can be shown as a widget
• withText: This button is displayed with text

Assigning a Menu

To assign a menu to an application bar, add the following to the activity:

  override fun onCreateOptionsMenu(menu: Menu): Boolean { 
      menuInflater.inflate(R.menu.main, menu) 

      return true 
    }

Responding to Actions

When an action is selected by te user the onOptionsItemSelected() method is called. It passes the MenuItem object to indict what item was clicked. You can override this method like such to invoke actions on menu item being clicked:

override fun onOptionsItemSelected(item: MenuItem) = when (item.itemId) {
    R.id.action_settings -> {
        // User chose the "Settings" item, show the app settings UI...
        true
    }

    R.id.action_favorite -> {
        // User chose the "Favorite" action, mark the current item
        // as a favorite...
        true
    }

    else -> {
        // If we got here, the user's action was not recognized.
        // Invoke the superclass to handle it.
        super.onOptionsItemSelected(item)
    }
}

Adding the UP Action

The up action allows for navigation to a parent activity.

Declare a Parent Activity

The android:parentActivityName attribute allows an Activity to support the up functionality. To enable define the parent relationship in the manifest as such:

<application ... >
    ...

    <!-- The main/home activity (it has no parent activity) -->

    <activity
        android:name="com.example.myfirstapp.MainActivity" ...>
        ...
    </activity>

    <!-- A child of the main activity -->
    <activity
        android:name="com.example.myfirstapp.MyChildActivity"
        android:label="@string/title_activity_child"
        android:parentActivityName="com.example.myfirstapp.MainActivity" >

        <!-- Parent activity meta-data to support 4.0 and lower -->
        <meta-data
            android:name="android.support.PARENT_ACTIVITY"
            android:value="com.example.myfirstapp.MainActivity" />
    </activity>
</application>

Enabling the Up button

In the onCreate method call setDisplayHomeAsUpEnabled(true) to turn on the up button.

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_my_child)

    // my_child_toolbar is defined in the layout file
    setSupportActionBar(findViewById(R.id.my_child_toolbar))

    // Get a support ActionBar corresponding to this toolbar and enable the Up button
    supportActionBar?.setDisplayHomeAsUpEnabled(true)
}