Android: Toolbar、AppBarLayout
ToolBar是google退出的一个应用程序动作条
包括:
- 设置导航栏图标
- 设置应用程序Logo
- 设置标题
- 设置子标题
- 添加各种自定义控件
- 添加动作条菜单
API:https://developer.android.com/reference/android/support/v7/widget/Toolbar.html
1. 兼容处理,使用v7兼容包,build.gradle配置
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
compile 'com.android.support:appcompat-v7:24.0.0'
2. 隐藏默认的动作条,可以使用NoActionBar的theme,也可以在activity使用代码
3. 布局文件中可以支持出了动作条菜单actionmenu外的所有功能,
但是一定要添加自定义命名空间,指向 http://schemas.android.com/apk/res-auto
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.AppBarLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="wrap_content" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <android.support.v7.widget.Toolbar android:id="@+id/toolBar" android:layout_height="match_parent" android:layout_width="match_parent" android:background="?attr/colorPrimary" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" app:layout_scrollFlags="scroll|enterAlways" app:navigationIcon="@mipmap/ic_back" app:logo="@mipmap/ic_launcher" app:title="@string/app_name" app:subtitle="@string/home_title" app:subtitleTextColor="@color/bt_accent" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="TestCustomView" /> </android.support.v7.widget.Toolbar> </android.support.design.widget.AppBarLayout>
4. 通过代码实现Toolbar的创建及menu事件监听
activity
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
package com.media.customplayer; import android.support.design.widget.NavigationView; import android.support.design.widget.NavigationView.OnNavigationItemSelectedListener; import android.support.v4.view.GravityCompat; import android.support.v4.widget.DrawerLayout; import android.support.v4.widget.DrawerLayout.DrawerListener; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.support.v7.widget.Toolbar; import android.support.v7.widget.Toolbar.OnMenuItemClickListener; import android.util.Log; import android.view.MenuItem; import android.view.View; public class PlayerActivity extends AppCompatActivity { private final String TAG = "PlayerActivity"; private DrawerLayout mPlayerDrawer; private NavigationView mNaviView; private Toolbar mToolbar; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_player); mPlayerDrawer = (DrawerLayout) findViewById(R.id.palyer_drawer_layout); mPlayerDrawer.addDrawerListener(drawerListener); mNaviView = (NavigationView) findViewById(R.id.navi_view); mNaviView.setNavigationItemSelectedListener(naviItemSelectedListener); updateToolbar(); } private DrawerListener drawerListener = new DrawerLayout.DrawerListener() { @Override public void onDrawerSlide(View drawerView, float slideOffset) { Log.v(TAG, "onDrawerSlide: slideOffset = " + slideOffset); } @Override public void onDrawerOpened(View drawerView) { Log.v(TAG, "onDrawerOpened"); } @Override public void onDrawerClosed(View drawerView) { Log.v(TAG, "onDrawerClosed"); } @Override public void onDrawerStateChanged(int newState) { Log.v(TAG, "onDrawerStateChanged: newState = " + newState); } }; private OnNavigationItemSelectedListener naviItemSelectedListener = new OnNavigationItemSelectedListener() { @Override public boolean onNavigationItemSelected(MenuItem item) { switch (item.getItemId()) { case R.id.navi_all: Log.v(TAG, "播放所有音乐"); break; case R.id.navi_playlists: Log.v(TAG, "播放音乐列表"); break; default: Log.v(TAG, "点击按钮: " + item.getItemId()); } item.setChecked(true); mPlayerDrawer.closeDrawer(GravityCompat.START, true); return true; } }; private OnMenuItemClickListener menuItemClickListener = new OnMenuItemClickListener() { @Override public boolean onMenuItemClick(MenuItem item) { switch (item.getItemId()) { case R.id.navi_all: Log.v(TAG, "播放所有音乐"); break; case R.id.navi_playlists: Log.v(TAG, "播放音乐列表"); break; default: Log.v(TAG, "点击按钮: " + item.getItemId()); } item.setChecked(true); return true; } }; private void updateToolbar() { mToolbar = (Toolbar) findViewById(R.id.player_toolbar); mToolbar.setNavigationIcon(R.mipmap.ic_back); mToolbar.setLogo(R.mipmap.ic_launcher); mToolbar.setTitle(R.string.app_name); mToolbar.setSubtitle(R.string.home_title); mToolbar.inflateMenu(R.menu.player_toolbar_menu); mToolbar.setOnMenuItemClickListener(menuItemClickListener); } }
menu layout
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<?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"> <group android:checkableBehavior="single"> <item android:id="@+id/navi_all" android:icon="@mipmap/ic_allmusic_black_24dp" android:title="@string/drawer_allmusic_title" app:showAsAction="ifRoom"/> <item android:id="@+id/navi_playlists" android:icon="@mipmap/ic_playlist_music_black_24dp" android:title="@string/drawer_playlists_title" android:checked="true" /> <item android:id="@+id/navi_sub_item_bottom_1" android:icon="@mipmap/ic_allmusic_black_24dp" android:title="@string/drawer_sub_playlist_title" /> <item android:id="@+id/navi_sub_item_bottom_2" android:icon="@mipmap/ic_allmusic_black_24dp" android:title="@string/drawer_sub_playlist_title" /> </group> </menu>
5. 修改action menu的颜色
style.xml
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<resources> <!-- Base application theme. --> <style name="PlayerTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="colorPrimary">#ffff5722</item> <item name="colorPrimaryDark">#ffbf360c</item> <item name="colorAccent">#ffff5722</item> <item name="alertDialogTheme">@style/Theme.AppCompat.Dialog.Alert</item> </style> <style name="PlayerTheme.ToolBar" parent="PlayerTheme"> <item name="android:textColorPrimary">#00B8D4</item> </style> </resources>
activity
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
mToolbar.setPopupTheme(R.style.PlayerTheme_ToolBar);
可以是布局文件
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
app:popupTheme="@style/PlayerTheme.ToolBar"
AppBarLayout
AppBarLayout是一个垂直方向的LinearLayout,是为MaterialDesign设计的AppBar(包括的view都会认为是appbar),支持手势滑动。
posted on 2016-07-14 16:20 alvin.zhang 阅读(2228) 评论(0) 编辑 收藏 举报