Toolbar 如何修改标题、子标题字体大小和颜色,Toolbar menu字体的大小和颜色
实例讲解androidx.appcompat.widget.Toolbar控件的标题、子标题及其 menu字体的大小和颜色。
一、Toolbar的简单应用
1、设置导航栏图标
Java代码设置:
toolbar.setNavigationIcon(R.drawable.back);
xml设置:
app:navigationIcon="@mipmap/ic_launcher"
2、设置App的logo
Java代码设置:
toolbar.setLogo(R.mipmap.ic_launcher);
xml设置:
app:logo="@mipmap/ic_launcher"
3、支持设置标题和子标题
Java代码设置:
toolbar.setTitle("大标题"); toolbar.setSubtitle("子标题");
xml设置:
app:title="@string/app_name" app:subtitle="@string/app_name"
4、支持添加一个或多个的自定义控件
可以使用androidx.appcompat.widget.Toolbar包裹自定义控件。
5、支持Action Menu
6、设置Toolbar左右两边的间距,类似paddingLeft和paddingRight,可用于设置标题和子标题距离左侧的间距
<androidx.appcompat.widget.Toolbar android:id="@+id/view_bar" android:layout_width="match_parent" android:layout_height="wrap_content" app:contentInsetLeft="20dp" app:contentInsetRight="20dp" app:contentInsetStart="20dp" app:contentInsetEnd="20dp" app:title="@string/app_name" app:subtitle="@string/app_name" app:titleTextColor="@color/white" app:subtitleTextColor="@color/white" app:titleTextAppearance="@style/Toolbar.TitleText" android:background="@color/app_main_color" app:layout_constraintTop_toTopOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintLeft_toLeftOf="parent"/>
以上app:contentInsetLeft、app:contentInsetStart可以设置左边距,app:contentInsetRight、app:contentInsetEnd可以设置右边距。
二、修改ToolBar的标题、子标题字体大小和颜色,toolbar menu字体的大小和颜色
1、修改ToolBar的标题的字体颜色大小
在style文件上添加如下配置:
<!-- 设置Toolbar标题字体的颜色大小 --> <style name="Toolbar.TitleText" parent="TextAppearance.Widget.AppCompat.Toolbar.Title"> <!--toolbar标题字体大小--> <item name="android:textSize">24sp</item> <!--toolbar标题字体颜色--> <item name="android:textColor">@color/home_title_color</item> <!--toolbar标题字体粗体--> <item name="android:textStyle">bold</item> </style>
注意,新版的需要在themes.xml文件添加,旧版的在style.xml添加。
然后在布局文件的ToolBar中添加上如下设置进行使用:
app:titleTextAppearance="@style/Toolbar.TitleText"
或者在Java代码中进行如下设置:
toolbar.setTitleTextAppearance(this, R.style.Toolbar_TitleText);
2、修改ToolBar的子标题的字体颜色大小
<!-- 设置Toolbar 子标题subtitle标题字体的大小 --> <style name="Toolbar.SubTitleText" parent="TextAppearance.Widget.AppCompat.Toolbar.Title"> <!--子标题字体大小--> <item name="android:textSize">15sp</item> <!--子标题字体颜色--> <item name="android:textColor">@color/home_title_color</item> </style>
然后在布局文件的ToolBar中添加上如下设置进行使用:
app:subtitleTextAppearance="@style/Toolbar.SubTitleText"
或者在Java代码中如下设置:
toolbar.setSubtitleTextAppearance(this,R.style.Toolbar_SubTitleText);
3、修改ToolBar Menu的字体颜色大小
<!--toolbat mean的字体颜色和大小--> <style name="ToolbarTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="actionMenuTextColor">#ffffff</item> <!--menu字体颜色--> <item name="android:textSize">18sp</item> <!--menu字体大小--> </style>
然后在布局文件的ToolBar中添加上如下设置进行使用:
app:theme="@style/ToolbarTheme"
三、注意事项
1、在根布局中添加
xmlns:app="http://schemas.android.com/apk/res-auto"
2、在布局中设置大标题和二级标题正确方法是
app:title="大标题" app:subtitle="子标题"
而设置以下的方法是没有作用的
android:title="大标题" android:subtitle="子标题"
3、上边ToolBar Menu的style中item actionMenuTextColor前边是不能加android:的,加上之后没作用!
4、在使用Toolbar之前一定要去掉系统自带的ActionBar,可以给Activity使用NoActionBar主题,或者在setContentView()之前调用supportRequestWindowFeature(Window.FEATURE_NO_TITLE)(或者是requestWindowFeature(Window.FEATURE_NO_TITLE))。
5、若在代码中设置logo。大标题和子标题都要在setSupportActionBar(toolbar)前执行
<androidx.appcompat.widget.Toolbar android:id="@+id/view_bar" android:layout_width="match_parent" android:layout_height="wrap_content" app:contentInsetLeft="20dp" app:contentInsetRight="20dp" app:contentInsetStart="20dp" app:contentInsetEnd="20dp" app:title="@string/app_name" app:titleTextColor="@color/home_title_color" app:titleTextAppearance="@style/Toolbar.TitleText" app:subtitle="@string/app_name" app:subtitleTextColor="@color/app_main_color" app:subtitleTextAppearance="@style/Toolbar.SubTitleText" android:background="@color/app_main_color" app:layout_constraintTop_toTopOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintLeft_toLeftOf="parent"/>
四、ToolBar menu的使用
在代码中重写onCreateOptionsMenu方法
/** * 该方法是用来加载菜单布局的 * @param menu * @return */ @Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.menu_main, menu); return true; }
菜单的点击事件
private static Toolbar.OnMenuItemClickListener onMenuItemClickListener=new Toolbar.OnMenuItemClickListener() { @Override public boolean onMenuItemClick(MenuItem menuItem) { switch (menuItem.getItemId()){ //因为使用android.support.v7.widget.SearchView类,可以在 case R.id.action_search: break; case R.id.action_share: break; case R.id.action_more: break; } return true; } };
五、toolbar menu中app:showAsAction各个属性值作用
这个属性的值有:
1、always:使菜单项一直显示在ToolBar上。
2、ifRoom:如果有足够的空间,这个值会使菜单项显示在ToolBar上。
3、never:使菜单项永远都不出现在ToolBar上,在…的子项中显示。
4、withText:使菜单项和它的图标,菜单文本一起显示。