上一篇介绍了ToolBar的最基本的用法,本篇我接着上一篇来说一下ToolBar的其他用法。如果不清楚基本用法的可以参照我的上一篇博文:
blog.csdn.net/james_shu/a…
注意上次的代码都是在Toolbar toolbar= (Toolbar) findViewById(R.id.toolbar);与setSupportActionBar(toolbar);之间进行设定的。
其中setSupportActionBar(toolbar);指定了我们的ToolBar会继承使用ActionBar的一些属性。
其中,当我们未设定标题的时候,ToolBar默认会显示APP的lable,而且显示在屏幕的左上角,类似的效果还有其他的几个,下面我首先介绍当不使用setSupportActionBar(toolbar);时,为了满足我们的业务需求,我们所需要进行的定制操作。
1.标题的设定:
toolbar.setTitle("Title");//设置主标题
toolbar.setSubtitle("Subtitle");//设置子标题同样的,我们也可以在布局文件中进行指定:
app:subtitle="Title"
app:title="Subtitle"注意,通过上面的方式设置的标题默认是在ToolBar标题栏的左上角,我们如果要将标题居中显示, 可以在xml自定义标题,此时的setTitle可以设置为空。ToolBar在不继承ActionBar的属性的时候,Title默认是消失的
<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="自定义标题"
android:textSize="16sp"
android:layout_gravity="center"
/>
</android.support.v7.widget.Toolbar>实现的效果:
2.菜单的设定:
当我们使用ActionBar时,经常在标题栏的右上角显示我们的菜单,而在我们的ToolBar中设定也很简单:
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(),"提示",Toast.LENGTH_SHORT).show();
break;
case R.id.item_menu:
Toast.makeText(getApplicationContext(),"菜单",Toast.LENGTH_SHORT).show();
break;
case R.id.item_shop:
Toast.makeText(getApplicationContext(),"购物",Toast.LENGTH_SHORT).show();
break;
}
return true;
}
});注意,当时用了setSupportActionBar(toolbar);时,上面的设定会失效,下文会有说明。
当然目前的设定可定制性仍然还没有完全体现出来。默认的Menu都会显示在右边,如果我们要将我们的菜单也能在左边显示呢?support-v7包为我们提供了ActionMenuView这个控件来完成定制功能。
首先在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="自定义标题"
android:textSize="16sp"
android:layout_gravity="center"
/>
</android.support.v7.widget.Toolbar>
将ActionMenuView放在ToolBar的第一个子View的位置,就能将菜单在左边显示。同时为了去掉左边默认带的边距我们需要指定两个属性:
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"然后我们可以在代码中设定:
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(),"提示",Toast.LENGTH_SHORT).show();
break;
case R.id.item_menu:
Toast.makeText(getApplicationContext(),"菜单",Toast.LENGTH_SHORT).show();
break;
case R.id.item_shop:
Toast.makeText(getApplicationContext(),"购物",Toast.LENGTH_SHORT).show();
break;
}
return true;
}
});目前实现的效果如下:
当然,ToolBar中的菜单选项可以设定加载布局文件:
<item
android:id="@+id/item_menu"
android:title="菜单"
app:actionLayout="@layout/action_menu"
app:showAsAction="ifRoom" />或者在代码中设定:
MenuItem menuItem=actionMenuView.getMenu().findItem(R.id.item_menu);
menuItem.setActionView(R.layout.action_menu);监听事件的设定:
menuItem.getActionView().setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
}
});ToolBar是MD规范中的控件,当然Google官方也为我们指定了设置ToolBar上按钮属性的方式:
<!--指定按钮文字的颜色-->
<item name="android:actionMenuTextColor">#0000FF</item>
<!--指定按钮文字的样式-->
<item name="android:actionMenuTextAppearance">@style/ActionMenuTextAppearance</item>
<!--指定按钮的风格-->
<item name="android:actionButtonStyle">@style/ActionButtonStyle</item> <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>3.导航图标的设定:
toolbar.setNavigationIcon(R.drawable.ic_menu_slideshow);
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(getApplicationContext(),"导航栏按钮",Toast.LENGTH_LONG).show();
}
});下面介绍当使用setSupportActionBar(toolbar);时,由于我们会继承ActionBar自带的一些属性,所以此时我们的可定制性不是那么高,但是会更加方便快捷
1.标题的设定:
如果我们在代码中使用了ToolBar的setTitle的函数,那么新设定的值会覆盖原来的Label效果。当然在xml中的定制也是一样的。
2.菜单的设定:
如果我们使用setSupportActionBar(toolbar);,我们无法使用上面的方式设定菜单而应该使用传统的方式:
@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(),"提示",Toast.LENGTH_SHORT).show();
break;
case R.id.item_menu:
Toast.makeText(getApplicationContext(),"菜单",Toast.LENGTH_SHORT).show();
break;
case R.id.item_shop:
Toast.makeText(getApplicationContext(),"购物",Toast.LENGTH_SHORT).show();
break;
}
return true;
}3.导航栏的设置:
ActionBar actionBar = getSupportActionBar();
if (actionBar != null) {
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setHomeAsUpIndicator(R.drawable.ic_menu);
}Ok,我能想到的ToolBar的使用方式就这些,如果你有更好的使用方式,请给我留言,谢谢。
