Toolbar 配置
Toolbar 是用来替换之前的ActionBar 的, 方便定制, 和用户一致的界面体验
Toolbar 单独使用:
简单使用
-
配置 layout
<?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_height="wrap_content" android:layout_width="match_parent" android:minHeight="?attr/actionBarSize" android:fitsSystemWindows="true" android:background="?android:attr/colorPrimary" app:theme="@style/AppBar" android:elevation="4dp"> </android.support.v7.widget.Toolbar>
-
参数解释:
minHeight = "?attr/actionBarSize" : 设置最小高度为系统配置的 actionBar 的大小
-
fitsSystemWindows= "true" :
我们为什么要用fitsSystemWindows? System windows 指的就是屏幕上status bar、 navigation bar等系统控件所占据的部分。 绝大多数情况下，你都不需要理会status bar或者navigation bar 下面的空间，不过你需要注意不能让你的交互控件（比如Button）藏在status bar 或者 navigation bar下面。而android:fitsSystemWindows="true"的默认行为正好解决了这种情况，这个属性的作用就是通过设置View的padding，使得应用的content部分——Activity中setContentView()中传入的就是content——不会与system window重叠。 还有一些事情需要注意： fitsSystemWindows 需要被设置给根View——这个属性可以被设置给任意View，但是只有根View（content部分的根）外面才是SystemWindow，所以只有设置给根View才有用。 Insets始终相对于全屏幕——Insets即边框，它决定着整个Window的边界。对Insets设置padding的时候，这个padding始终是相对于全屏幕的。因为Insets的生成在View layout之前就已经完成了，所以系统对于View长什么样一无所知。 其它padding将通通被覆盖。需要注意，如果你对一个View设置了android:fitsSystemWindows="true"，那么你对该View设置的其他padding将通通无效。 在绝大多数情况下，默认情况就已经够用了。比如一个全屏的视屏播放器。如果你不想被ActionBar 或者其他System View遮住的话，那么在MatchParent的ViewGroup上设置fitsSystemWindows="true"即可。 或者，也许你希望你的RecyclerView能够在透明的navigation bar 下面滚动。那么只需将android:fitsSystemWindows="true" android:clipToPadding="false"同时使用即可, 滚动的内容会绘制在navigation bar下面，同时当滚动到最下面的时候，最后一个item下面依旧会有padding，使其可以滚到navigation bar上方（而不是在navigation bar下面滚不上来！）。 译者注：clipToPadding是ViewGroup的属性。这个属性定义了是否允许ViewGroup在padding中绘制,该值默认为true,即不允许。 android:background = "?arrt/colorPrimer" : 设置 Toolbar 背景颜色为对应在AppThemem 中设置的
android:elevation="4dp" : 设置android 手机的 X/Y/Z 中 Z 轴方向的偏移量
-
Java 代码中配置 title , 图标, 和点击事件:
@Override protected void onPostCreate(@Nullable Bundle savedInstanceState) { super.onPostCreate(savedInstanceState); Toolbar toolbar = findViewById(R.id.toolbar); toolbar.setTitle("Faces"); setSupportActionBar(toolbar); if (getSupportActionBar() != null) { getSupportActionBar().setDisplayHomeAsUpEnabled(true); getSupportActionBar().setDisplayShowHomeEnabled(true); toolbar.setNavigationOnClickListener(view ->{ onBackPressed(); }); } } //设置Toolbar 的title 为Faces,并打开和显示TOolbar 默认的返回键图标, 返回箭头 //setNavigationOnClickListener() 设置箭头点击事件. 为返回 //toolbar.setNavigationIcon(); 修改默认的图标 -
修改Toolbar 的样式
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <!-- Customize your theme here. --> <item name="colorPrimary">@color/msc_primary</item> <item name="colorPrimaryDark">@color/msc_primary_dark</item> <item name="colorAccent">@color/msc_accent</item> <item name="android:actionBarColor">@color/mac_primary</item> </style> <style name="ThemePopup" parent="Base.V7.Widget.AppCompat.Toolbar"> <item name="android:textColor">@color/white</item> <!--设置副标题颜色--> <item name="android:textColorSecondary">@color/white</item> </style>
<style name="Base.V7.Widget.AppCompat.Toolbar" parent="android:Widget">
<!-- 设置主标题的字体样式, 字体大小和颜色-->
<item name="titleTextAppearance">@style/TextAppearance.Widget.AppCompat.Toolbar.Title</item>
<!-- 设置副标题的字体样式, 字体大小和颜色-->
<item name="subtitleTextAppearance">@style/TextAppearance.Widget.AppCompat.Toolbar.Subtitle</item>
<!-- 设置Toolbar 最小高度-->
<item name="android:minHeight">?attr/actionBarSize</item>
<!-- 设置标题外边距-->
<item name="titleMargin">4dp</item>
<item name="maxButtonHeight">@dimen/abc_action_bar_default_height_material</item>
<item name="buttonGravity">top</item>
<!-- 设置可以折叠的图标-->
<item name="collapseIcon">?attr/homeAsUpIndicator</item>
<item name="collapseContentDescription">@string/abc_toolbar_collapse_description</item>
<item name="contentInsetStart">16dp</item>
<item name="contentInsetStartWithNavigation">@dimen/abc_action_bar_content_inset_with_nav</item>
<item name="android:paddingLeft">@dimen/abc_action_bar_default_padding_start_material</item>
<item name="android:paddingRight">@dimen/abc_action_bar_default_padding_end_material</item>
</style>
<!--会被默认设置的代码-->
<style name="Base.TextAppearance.AppCompat.Widget.ActionBar.Title" parent="TextAppearance.AppCompat.Title">
<item name="android:textSize">@dimen/abc_text_size_title_material_toolbar</item> <item name="android:textColor">?android:attr/textColorPrimary</item>
<item name="android:textSize">@dimen/abc_text_size_title_material_toolbar</item>
<item name="android:textColor">?android:attr/textColorPrimary</item>
</style>
给Toolbar 设置标题
- java 代码中设置Toolbar 为界面中使用的ActionBar, Menu 需要依付在 ActionBar 上面
@Override
protected void onPostCreate(@Nullable Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
Toolbar toolbar = findViewById(R.id.toolbar);
toolbar.setTitle("Faces");
setSupportActionBar(toolbar);
}
-
在 res/menu 中创建一个 home.xml 目录
layout-2018-02-07-114209.png
<?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">
<item
android:id="@+id/home"
android:icon="@drawable/ic_home"
android:title="@string/home"
app:showAsAction="always"
android:checkable="true"
android:iconTint="@color/white"
/>
</menu>
-
在Java 中直接使用menu
@Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.home, menu); return super.onCreateOptionsMenu(menu); } @Override public boolean onOptionsItemSelected(MenuItem item) { int itemId = item.getItemId(); switch (itemId){ case R.id.home: Toast.makeText(this, "home icon be click", 0).show(); break; } return super.onOptionsItemSelected(item); }
配合AppBarLayout 一起使用
<!--将包裹在AppBarLayout 里面的内容全部视为 ActionBar 的部分
在AppBarLayout 里面也可以包含 TabLayout(切换控件)
-->
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:subtitleTextColor="@color/white"
app:titleTextColor="@color/white"
app:popupTheme="@style/AppTheme.PopupOverlay" >
<android.support.v7.widget.AppCompatSpinner
android:id="@+id/locationSelect"
android:minWidth="150dp"
style="@style/common_spinner"
app:theme="@style/common_spinner"
android:popupTheme="@style/common_spinner"
android:visibility="gone" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
