I follow up on the most basic uses of the ToolBar in this article with other uses of the ToolBar. If you are not sure about basic usage, please refer to my last post: blog.csdn.net/james_shu/a…
Note that the previous code is in the Toolbar = (Toolbar) findViewById(R.i.Toolbar); With setSupportActionBar (toolbar); Is set between. Which setSupportActionBar (toolbar); Specifies that our ToolBar inherits properties that use the ActionBar. When the title is not set, the ToolBar default displays the lable of the APP in the upper left corner of the screen. There are several other similar effects. In order to meet our business requirements, we need to carry out custom operations. 1. Title setting:
toolbar.setTitle("Title");// Set the main title
toolbar.setSubtitle("Subtitle");// Set the subtitleCopy the codeSimilarly, we can specify this in the layout file:
app:subtitle="Title"
app:title="Subtitle"Copy the codeNote that the title set above defaults to the upper-left corner of the ToolBar title bar. If we want to center the title, we can customize the title in XML and set setTitle to empty. The Title disappears by default when the ToolBar does not inherit the properties of the ActionBar
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="? attr/actionBarSize"
android:background="@color/colorPrimary"
app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/colorAccent"
android:text="Custom title"
android:textSize="16sp"
android:layout_gravity="center"
/>
</android.support.v7.widget.Toolbar>Copy the codeEffect achieved:
2. Menu Settings:
When we use the ActionBar, we often display our menu in the upper right corner of the title bar, and the Settings in our ToolBar are simple:
toolbar.inflateMenu(R.menu.main);
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()){
case R.id.item_tips:
Toast.makeText(getApplicationContext(),"Tip",Toast.LENGTH_SHORT).show(a);
break;
case R.id.item_menu:
Toast.makeText(getApplicationContext(),"Menu",Toast.LENGTH_SHORT).show(a);
break;
case R.id.item_shop:
Toast.makeText(getApplicationContext(),"Shopping",Toast.LENGTH_SHORT).show(a);
break;
}
return true;}});Copy the codeNote that the setSupportActionBar(toolbar) was used; , the above Settings will be invalid, as explained below. Of course, the current customizability is still not fully realized. The default Menu is displayed on the right. What if we wanted our Menu to be displayed on the left as well? The support-v7 package provides the ActionMenuView control for customization. First define it in XML:
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="? attr/actionBarSize"
android:background="@color/colorPrimary"
app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
>
<android.support.v7.widget.ActionMenuView
android:id="@+id/action_menu_view"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/colorAccent"
android:text="Custom title"
android:textSize="16sp"
android:layout_gravity="center"
/>
</android.support.v7.widget.Toolbar>
Copy the codePlace the ActionMenuView in the first child of the ToolBar to display the menu on the left. Also, to get rid of the default margin on the left we need to specify two properties:
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"Copy the codeThen we can set it in code:
ActionMenuView actionMenuView= (ActionMenuView) findViewById(R.id.action_menu_view);
getMenuInflater().inflate(R.menu.main,actionMenuView.getMenu());
actionMenuView.setOnMenuItemClickListener(new ActionMenuView.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()){
case R.id.item_tips:
Toast.makeText(getApplicationContext(),"Tip",Toast.LENGTH_SHORT).show(a);
break;
case R.id.item_menu:
Toast.makeText(getApplicationContext(),"Menu",Toast.LENGTH_SHORT).show(a);
break;
case R.id.item_shop:
Toast.makeText(getApplicationContext(),"Shopping",Toast.LENGTH_SHORT).show(a);
break;
}
return true;}});Copy the codeThe current results are as follows:
Of course, menu options in the ToolBar can set the layout file to load:
<item
android:id="@+id/item_menu"
android:title="Menu"
app:actionLayout="@layout/action_menu"
app:showAsAction="ifRoom" />Copy the codeOr set it in code:
MenuItem menuItem=actionMenuView.getMenu(a).findItem(R.id.item_menu);
menuItem.setActionView(R.layout.action_menu);Copy the codeSetting of listening event:
menuItem.getActionView().setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
}
});Copy the codeThe ToolBar is a control in the MD specification, and Google officially specifies how to set the ToolBar button properties:
<! -- Specify the color of the button text -->
<item name="android:actionMenuTextColor">#0000FF</item>
<! -- Specify the style of the button text -->
<item name="android:actionMenuTextAppearance">@style/ActionMenuTextAppearance</item>
<! -- Specify button style -->
<item name="android:actionButtonStyle">@style/ActionButtonStyle</item>Copy the code <style name="ActionMenuTextAppearance" parent="@android:style/TextAppearance.Holo.Widget.ActionBar.Menu">
<item name="android:textSize">18sp</item>
<item name="android:textStyle">bold</item>
</style>
<style name="ActionButtonStyle" parent="Widget.AppCompat.Light.ActionButton">
<item name="android:minWidth">44dp</item>
<item name="android:paddingLeft">16dp</item>
<item name="android:paddingRight">16dp</item>
<item name="android:paddingBottom">16dp</item>
<item name="android:paddingTop">16dp</item>
</style>Copy the code3. Navigation icon setting:
toolbar.setNavigationIcon(R.drawable.ic_menu_slideshow);
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(getApplicationContext(),Navigation bar button,Toast.LENGTH_LONG).show(a);}});Copy the codeHere’s how to use the setSupportActionBar(Toolbar); When, we will inherit some properties of ActionBar, so our customizability is not so high, but it will be more convenient and fast 1. Title setting: If we use the ToolBar’s setTitle function in our code, the new value overwrites the original Label effect. The same is true for customizations in XML, of course. 2. Menu Settings: If we use setSupportActionBar(Toolbar); Instead of using the above method to set the menu, we should use the traditional method:
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.main,menu);
return super.onCreateOptionsMenu(menu);
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()){
case R.id.item_tips:
Toast.makeText(getApplicationContext(),"Tip",Toast.LENGTH_SHORT).show(a);
break;
case R.id.item_menu:
Toast.makeText(getApplicationContext(),"Menu",Toast.LENGTH_SHORT).show(a);
break;
case R.id.item_shop:
Toast.makeText(getApplicationContext(),"Shopping",Toast.LENGTH_SHORT).show(a);
break;
}
return true;
}Copy the code3. Navigation bar Settings:
ActionBar actionBar = getSupportActionBar();if (actionBar ! = null) { actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setHomeAsUpIndicator(R.drawable.ic_menu);
}Copy the codeOk, these are the only ways I can think of using the ToolBar. If you have a better one, please leave me a comment. Thanks.