二、Toolbar
2017-06-01 本文已影响77人
Serenity那年
一、Toolbar类的继承关系：
Toolbar类的继承关系.png
二、Toolbar中主要功能的说明
主要功能展示
三、Toolbar中主要属性的说明
使用Toolbar控件时，必须在根布局中自定义nameSpace，而不是使用android，如果使用了android会无效，比如xmlns：wl = "http://schemas.android.com/apk/res-auto"，使用时：wl:navigationIcon = "@mipmap/ic_launcher"
常用属性如下：
- 1.wl:navigationIcon 用来设置最左边的导航按钮，一般为返回按钮等；
- 2.wl:logo 用来设置logo图标的；
- 3.wl:title 用来设置主标题；
- 4.wl:subtitle 设置子标题，在主标题下面；
- 5.wl:titleTextColor 设置主标题的字体颜色；
- 6.wl:subtitleTextColor 设置子标题的字体颜色；
- 7.wl:titleTextAppearance 设置标题相关属性，如：字体，颜色，大小；通常refrence一个style；
- 8.wl:subtitleTextAppearance 设置子标题相关属性；
- 9.android:background 设置Toolbar整体的背景；注意：这里使用的命名空间是android；
- 10.wl：theme 设置Toolbar主题样式，用来设置溢出菜单重的字体颜色、大小，设置溢出菜单显示的图标，设置显示在Toolbar上字体颜色；详情见下面customStyle.xml文件设置；
- 11.wl:popupTheme 用来设置overflow menu的主题样式；
四、Toolbar中主使用说明
- 1.具体xml中的使用
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
//这里必须配置自定义命名空间
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.androidwanga.serenitynanian.serenityproject.MainActivity">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="4dp"
app:title="@string/app_name"
app:subtitle="subtitle"
//用来配置溢出菜单中的属性
app:theme="@style/ToolBarTheme"
app:navigationIcon="@mipmap/ic_launcher"
android:background="?attr/colorPrimary"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
>
//TODO这里用来放子控件
<TextView
android:layout_width="wrap_content"
android:text="自定义View"
android:layout_height="wrap_content" />
</android.support.v7.widget.Toolbar>
</LinearLayout>
- 2.toolbar中使用theme来配置溢出菜单中的属性
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
<style name="ToolBarTheme" parent="AlertDialog.AppCompat.Light">
<!--设置toolbar溢出菜单的文字颜色-->
<item name="android:textColor">@color/colorAccent</item>
<!--设置toolbar溢出菜单的文字大小-->
<item name="android:textSize">20sp</item>
<!--设置显示在toolbar上菜单文字的颜色；网上说此处不能写命名空间android的，
但是在实际的测试中，写不写效果都能出现-->
<item name="actionMenuTextColor">#FFFFFF</item>
<!--更换toolbar overFlow menu icon-->
<item name="android:actionOverflowButtonStyle">@style/OverflowIcon</item>
</style>
<style name="OverflowIcon" parent="Widget.AppCompat.ActionBar.Solid">
<item name="android:src">@mipmap/ic_launcher_round</item>
</style>
效果图如下：
效果图.png
五、Activity中的使用
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mToolbar = (Toolbar) findViewById(R.id.toolbar);
mToolbar.setTitle("woca");
setSupportActionBar(mToolbar);
//设置NavigationIcon的点击事件
mToolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(MainActivity.this, "1", Toast.LENGTH_SHORT).show();
}
});
mToolbar.setLogo(R.mipmap.ic_launcher_round);
mToolbar.inflateMenu(R.menu.item_menu);
//设置logo距离NavigationIcon的距离的
// mToolbar.setContentInsetStartWithNavigation(0);
//设置overflow menu中的item监听
mToolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()) {
case R.id.menu_one:
Toast.makeText(MainActivity.this, "one", Toast.LENGTH_SHORT).show();
break;
// case R.id.menu_tow:
// Toast.makeText(MainActivity.this, "two", Toast.LENGTH_SHORT).show();
// break;
// case R.id.menu_three:
// Toast.makeText(MainActivity.this, "three", Toast.LENGTH_SHORT).show();
// break;
}
return false;
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.item_menu,menu);
return true;
}
