Demo1meterial Design Primer: Navigation bar (using toolbar)

In the Holo era, the navigation bar is the part of the application, it is difficult to modify, set its properties, under the new design specification, this old usage is no longer advocated, instead of using the toolbar component instead of the navigation bar function.

toolbar is a user interface component, as long as it is placed in the navigation bar position can be used as a navigation bar, the advantage is its flexibility. The first step in using toolbar is to set the application theme property to Noactionbar:
Style.xml:

<style name="AppTheme"parent="Theme.AppCompat.Light.NoActionBar">

After that, create the Toorbar.xml file under the Layout folder:
Toolbar.xml:

<?xml version= "1.0" encoding= "Utf-8"?><Android.support.v7.widget.Toolbar    xmlns:android="Http://schemas.android.com/apk/res/android"    Xmlns:app="Http://schemas.android.com/apk/res-auto"    Android:id="@+id/toolbar"    Android:layout_width="Match_parent"    Android:layout_height="Wrap_content"    Android:background="? Attr/colorprimary"    Android:minheight="? Attr/actionbarsize"    App:theme="@style/themeoverlay.appcompat.actionbar"></android.support.v7.widget.Toolbar>

The theme property of the toolbar here is @style/themeoverlay.appcompat.actionbar. In the main layout we only add the toolbar, and then, in the OnCreate method, you can load the toolbar into the navigation bar using the Setsupportactionbar method:
Mainactivity.java:

 Public  class mainactivity extends appcompatactivity {    PrivateToolbar Toolbar;@Override    protected void onCreate(Bundle savedinstancestate) {Super. OnCreate (Savedinstancestate);        Setcontentview (r.layout.main_layout);        toolbar = (toolbar) Findviewbyid (R.id.toolbar); Toolbar.settitle ("I am Toolbar");        Toolbar.settitletextcolor (Color.White); Toolbar.setsubtitle ("Toolbar");//For the toolbar header class setting to be called before Setsupportactionbar () will be validSetsupportactionbar (toolbar); }}

The navigation bar is already new style, but this is not enough, we have to add the menu button above, in fact, the menu options on the toolbar are similar to the Activity menu, the usage is the same, the difference is the effect is different. Now create the menu file:
Toolbar_menu.xml:

<?xml version= "1.0" encoding= "Utf-8"?><menu xmlns:android="http://schemas.android.com/apk/res/android"Xmlns:app ="Http://schemas.android.com/apk/res-auto">        <itemandroid:id="@+id/mtoolbar_share"android:title="Share"  app:showasaction="Always"android:icon="@android:d rawable/ic_menu_ Share "/>                                    <itemandroid:id="@+id/mtoolbar_message"android:title="Message"  app:showasaction="Always"android:icon="@android:d rawable/ic_dialog_email" />                                </Menu>

Here is the key to a property, that is Showasaction, this property determines whether the menu will appear on the navigation bar, set to always indicate that the menu bar continues to appear under the menu bar. The next task is to rewrite the Oncreateoptionsmenu method in the activity to load the menu, overriding the Onoptionsitemselected method in response to the menu message. The code will not stick, directly on:

Finally, we want to add the main button (the leftmost button, Navigation) to the navigation bar, just specify its icon and pass in the Onclicklisener object to implement the key function:

toolbar = (Toolbar)findViewById(R.id.toolbar);toolbar.setTitle("I am toolbar");toolbar.setTitleTextColor(Color.WHITE);toolbar.setSubtitle("toolbar"//对于ToolBar标题一类的设置要在 setSupportActionBar()之前调用才会有效setSupportActionBar(toolbar);toolbar.setNavigationIcon(android.R.drawable.sym_def_app_icon);toolbar.setNavigationOnClickListener(new View.OnClickListener() {    @Override    publicvoidonClick(View v) {        Toast.makeText(MainActivity.this"Navigation", Toast.LENGTH_SHORT).show();    }});

So far, the new style of navigation bar has been explained, the effect is as follows:

The next article will be the implementation of the side-by-side menu feature that works with the navigation bar navigation.

Demo Source: Demo1:toolbar

Demo1meterial Design Primer: Navigation bar (using toolbar)