ToolBar使用基础

回顾 ActionBar

在 Android 系统中把UI界面分成了两大部分,一部分是System UI,也就是系统 UI。而另一部分则是应用 UI,通俗地说也就是我们应用能布局的那一部分。

ActionBar 的问题,在显示上来说是属于应用 UI 的一部分,因为我们毕竟要在宝贵的界面空间中开辟出一块重要的区域展示它,但是我们却又不能对其完全控制,因为 ActionBar 毕竟是由系统创建并对其进行相关参数的初始化。

在实际开发过程中会看到 ActionBar 的身影,但是它并非是系统提供给我们的那个 ActionBar,而是开发者自己用布局生成的一个模拟的 ActionBar

基于上面的一些问题,推出一个新的控件 Toolbar 来取代ActionBar。

默认情况下,Toolbar 和 ActionBar 在外观上并没有太大的区别,只是说 Toolbar 更自由了,而不像 ActionBar 那样有太多系统定制的条条框框。

ActionBar 与 ToolBar 比较

标题文本,Toolbar 取代 ActionBar 后很清爽,默认只显示一个标题文本,默认情况下该标题文本会使用 AndroidManifest 中当前 Activity 节点下 label 标签所对应的文本,如果当前 Activity 节点下没有 label 标签则查找上级节点 application 中的 label 标签文本显示,这点与 ActionBar 类似。

Toolbar本质只是个普通的控件,ActionBar 我们只要设置好了主题系统就会根据当前主题创建不同的 ActionBar 样式添加到你的应用界面中,但是 Toolbar 不一样,我们需要在布局中进行添加。

ToolBar 替代 ActionBar

在你的 Activity 中调用 setSupportActionBar 方法将 Toolbar 的实例对象传入即可:

Toolbar toolbar = (Toolbar) findViewById(R.id.ac_toolbar);
        setSupportActionBar(toolbar);

我们调用 setSupportActionBar 方法的目的是将 Toolbar 作为 ActionBar 来对待。 一旦你调用 setSupportActionBar 方法设置 Toolbar 为 ActionBar 后,那么之前关于 ActionBar 的大部分操作都将应用在 Toolbar 上

对于以前的 ActionBar 来说,要显示一系列菜单只需要重写 Activity 的 onCreateOptionsMenu 方法并实现相关逻辑即可,而监听菜单项的事件呢也只需重写 Activity 的onOptionsItemSelected 方法即可,这里对于 Toolbar 来说也一样,我们完全可以将它当作 ActionBar。

ToolBar 作为独立控件使用

像使用其它控件一样,但不使用 setSupportActionBar 设置它为 ActionBar。这就跟我们平时项目里直接使用一个普通的控件作为 ActionBar 就没啥区别了,只不过 Toolbar 相对来说提供了更多便捷的方法来控制显示方式。可以通过 inflateMenu 方法来加载菜单文件并通过 setOnMenuItemClickListener 方法为菜单的每一项设置监听

public class ToolbarActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.ac_toolbar);

        Toolbar toolbar = (Toolbar) findViewById(R.id.ac_toolbar);
        toolbar.setTitle("AndroidViewDemo");
                toolbar.inflateMenu(R.menu.ac_toolbar_menu);
         toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
                    @Override
                    public boolean onMenuItemClick(MenuItem item) {
                    }
        });
    }
}

使用过程中的问题

inflateMenu 方法设置后并没有显示 menu?(menu 缺失!)

要理解 ToolBar 的两种使用情况:

  1. 通过 setSupportAction(toolbar) ,将 ToolBar 转为 ActionBar 使用,在这种情况下,ActionBar 的大部分操作都将应用在 Toolbar 上。也就是我们只有通过重写 Activity 的 onCreateOptionsMenu 来创建 menu,通过重写 Activity 的onOptionsItemSelected 方法来监听 menu。
  2. 不使用 setSupportActionBar 设置它为 ActionBar。而是把 ToolBar 当作一般控件使用。在创建 menu 和监听时,我们就可以使用 inflateMenu 方法和setOnMenuItemClickListener 方法来完成。

toolbar 的 title 位置设置到中间?

在 Toolbar 中间添加一个 TextView

其中实现是通过一个 ToolbarHelper 来实现的,其实现如下:

public class ToolbarHelper {

    public static void addMiddleTitle(Context context, CharSequence title, Toolbar toolbar) {

        TextView textView = new TextView(context);
        textView.setText(title);

        Toolbar.LayoutParams params = new Toolbar.LayoutParams(Toolbar.LayoutParams.WRAP_CONTENT, Toolbar.LayoutParams.WRAP_CONTENT);
        params.gravity = Gravity.CENTER_HORIZONTAL;
        toolbar.addView(textView, params);
    }
}

弹出菜单样式修改

修改 ToolBar popup menu 弹出位置

Toolbar 与 ActionBar 一样也支持对弹出菜单样式的修改,只不过在将 Toolbar 单独作为控件使用的情况下不能像 ActionBar 那样便捷地通过 Theme 来修改,Toolbar 提供了一个 setPopupTheme 方法和对应的 popupTheme 属性来设置弹出菜单的样式。

通过 Theme 修改

<style name="ToolBarTheme" parent="@style/ThemeOverlay.AppCompat.Light">
        <item name="android:textColorSecondary">#FFFFFFFF</item>
        <item name="android:colorBackground">#88FFFFFF</item>
        <item name="actionOverflowMenuStyle">@style/OverflowMenuStyle</item>
        <item name="android:actionOverflowButtonStyle">@style/OverflowButtonStyle</item>
    </style>

 <!--设置toolbar弹出菜单的位置-->
    <style name="OverflowMenuStyle" parent="Widget.AppCompat.Light.PopupMenu.Overflow">
        <item name="overlapAnchor">false</item>  <!--设置为false即可使menu位置位于toolbar之下-->
    </style>

然后把这个 ToolBarTheme 风格设置给 ToolBar

android:theme=”@style/ToolBarTheme”

通过 popupTheme 修改

<style name="PopupMenu" parent="ThemeOverlay.AppCompat.Light" >
    <item name="android:colorBackground">@color/app_color_background</item>
    <item name="android:textColor">@color/app_primary_color_dark</item>
</style>

然后我们可以在资源中通过 Toolbar 的 popupTheme 属性指定该样式为弹出菜单样式:

<LinearLayout 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="match_parent"
    android:orientation="vertical">

    <android.support.v7.widget.Toolbar
        android:id="@+id/ac_toolbar_toolbar"
        android:layout_width="match_parent"
        app:popupTheme="@style/PopupMenu"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary" />
</LinearLayout>

或者你也可以通过代码调用 Toolbar 的 setPopupTheme 方法指定。

要注意的是 popupTheme 并非 Android 本身 SDK 中的属性,而是来自于支持包,所以这里的命名空间要写成 app。

文章只是作为个人记录学习使用,如有不妥之处请指正,谢谢。

参考文章

Toolbar:上位的小三

美化你的APP——从Toolbar开始

ToolBar控件的使用<一> 通过菜单项设置ToolBar

猜你喜欢

转载自blog.csdn.net/MoDuRooKie/article/details/80055071