什么是Toolbar?
appbar_sheets.png头到尾,工具栏可以包含以下可选的元素:
- A navigation button(导航按钮)。这里可能是向上箭头,导航菜单,关闭,折叠,完成或应用程序中选择的其他图标。这个按钮应始终用于访问工具栏指定内容的容器内的其他导航目标,或者离开当前的上下文。
- A branded logo image(标志性的logo图片)。
- A title and subtitle(标题或者子标题)。
- One or more custom views(或多个视图)。
- *An action menu
*(动作菜单)。
如何使用Toolbar?
Android Api中给我们提供了多个版本的Toolbar给我们使用,包括3.0引入的ActionBar和v21中的Toolbar,但是为了达到应用体验的一致性以及如今纷繁复杂的android平台差异化的情况下我们选择__
android.support.v7.widget.Toolbar__的Toolbar来使用。
-
添加android.support.v7.widget.Toolbar的依赖
dependencies { compile 'com.android.support:appcompat-v7:25.3.1' }
-
确保Activity继承自AppCompatActivity:
public class MyActivity extends AppCompatActivity { // ... }
-
布局中添加如下代码:
<android.support.v7.widget.Toolbar android:id="@+id/my_toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary" android:elevation="4dp" android:theme="@style/ThemeOverlay.AppCompat.ActionBar" app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
Material Design 规范建议应用栏具有 4 dp 的elevation.
-
在 Activity 的 onCreate()方法中,调用 Activity 的 setSupportActionBar()方法,然后传递 Activity 的工具栏。该方法会将工具栏设置为 Activity 的应用栏。例如:
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_my); Toolbar myToolbar = (Toolbar) findViewById(R.id.my_toolbar); setSupportActionBar(myToolbar); }
给Toolbar添加Action View & Action Providers
appbar_with_button.png添加Action View
要添加Action View我们需要了解2个属性:
-
actionViewClass:实现action widget的类
-
actionLayout:操作的布局
举个例子,把SearchView 组件添加到toolbar上<item android:id="@+id/action_search" android:title="@string/action_search" android:icon="@drawable/ic_search" app:showAsAction="ifRoom|collapseActionView" app:actionViewClass="android.support.v7.widget.SearchView" />
效果如下图:
action_view.png
如果你需要配置这个action,在你的Activity的重写方法onCreateOptionsMenu()。你可以通过 getActionView()
拿到view的引用。
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.main_activity_actions, menu);
MenuItem searchItem = menu.findItem(R.id.action_search);
SearchView searchView =(SearchView) MenuItemCompat.getActionView(searchItem);
// Configure the search info and add any event listeners...
return super.onCreateOptionsMenu(menu);
}
另外,如果想单独处理当action展开或者收缩,你可以定义一个实现MenuItem.OnActionExpandListener接口的类,然后调用setOnActionExpandListener()。如下代码所示:
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.options, menu);
// ...
// Define the listener
OnActionExpandListener expandListener = new OnActionExpandListener() {
@Override
public boolean onMenuItemActionCollapse(MenuItem item) {
// Do something when action item collapses
return true; // Return true to collapse action view
}
@Override
public boolean onMenuItemActionExpand(MenuItem item) {
// Do something when expanded
return true; // Return true to expand action view
}
};
// Get the MenuItem for the action item
MenuItem actionMenuItem = menu.findItem(R.id.myActionItem);
// Assign the listener to that action item
MenuItemCompat.setOnActionExpandListener(actionMenuItem, expandListener);
// Any other things you have to do when creating the options menu…
return true;
}
添加Action Provider
要添加一个Action Provider,首先在资源文件res/menu/下面添加资源文件,并添加actionProviderClass属性,然后把actionProviderClass的名字填写完整。
举个例子,下面代码是声明了一个 ShareActionProvider,功能是能够允许你的app分享数据到其他app:
<item android:id="@+id/action_share"
android:title="@string/share"
app:showAsAction="ifRoom"
app:actionProviderClass="android.support.v7.widget.ShareActionProvider"/>
总结
Toolbar的android api支持的操作大概也就这些,具体详细可以参考Toolbar官方的api文档。下面我将在关于Toolbar你需要知道的各种sao姿势(主题篇)中介绍如何管理Toolbar的样式。
网友评论
<item android:id="@+id/action_search"
android:title="@string/action_search"
android:icon="@drawable/ic_search"
app:showAsAction="ifRoom|collapseActionView"
app:actionViewClass="android.support.v7.widget.SearchView" />
然后在在Activity里面重写OnCreateOtionsMenu去设置SearchView就可以了