专栏首页潇涧技术专栏Head First Android Toolbar

Head First Android Toolbar

本文介绍Android Toolbar的使用

上一节我们介绍了ActionBar的使用,这一节我们介绍ActionBar 的替代者——Toolbar,看看它有多大的能耐!

1.Toolbar的来源

参考AppCompat v21 — Material Design for Pre-Lollipop Devices! 参考Android Support Library 22.1

首先要介绍下AppCompat,这个库起初是是为了让以前低版本的Android系统能够用上ActionBar而开发的兼容支持库[right?],现在这个库能够为低版本系统提供很多方面的兼容。自从Android 5.0引入了Material Design之后,这个兼容支持库增加了一个任务,那就是为低版本的系统提供与Material Design兼容的组件。

AppCompat (aka ActionBarCompat) started out as a backport of the Android 4.0 ActionBar API for devices running on Gingerbread, providing a common API layer on top of the backported implementation and the framework implementation. AppCompat v21 delivers an API and feature-set that is up-to-date with Android 5.0

参考网址Android Support Library 22.1中有一段Google工作人员录制的视频,介绍AppCompat。我的理解是大致如下图所示,如果没有AppCompat,我们开发的应用在不同版本的Android系统上显示起来会像上面一行的三个图片那样,没有统一的界面风格;而如果使用了AppCompat的话,就会像下面一行的三个图片那样,界面风格统一,操作方式一致,同时将Material Design的设计风格带到了以前低版本Android系统。

再来看下Toolbar,这是从AppCompat 21版本开始引入的,它的使用就像一个普通的View组件一样,同时它还可以充当ActionBar,这样我们设置的菜单项就会显示在它上面了。

In this release, Android introduces a new Toolbar widget. This is a generalization of the Action Bar pattern that gives you much more control and flexibility. Toolbar is a view in your hierarchy just like any other, making it easier to interleave with the rest of your views, animate it, and react to scroll events. You can also set it as your Activity’s action bar, meaning that your standard options menu actions will be display within it.

下面是我写的一个演示程序,得到的效果如下图所示,从左到右的Android系统版本分别是5.1.04.4.42.3.7,可以看出界面风格大致是一致的。

2.Toolbar API简介

参考Toolbar Class

下面的内容摘自上面的Toolbar Class 中的介绍,大致内容就是说Toolbar可以像一个普通的View组件一样使用,同时它还可以充当ActionBar的功能,默认提供了很多种元素可以放置在Toolbar上,其中包括导航按钮、logo图标、标题和子标题、一个或多个自定义的View以及菜单项。大家可以看下下图大致感受下(图片来自Using Toolbars in your apps)

A Toolbar is a generalization of action bars for use within application layouts. While an action bar is traditionally part of an Activity’s opaque window decor controlled by the framework, a Toolbar may be placed at any arbitrary level of nesting within a view hierarchy. An application may choose to designate a Toolbar as the action bar for an Activity using the setSupportActionBar() method.

Toolbar supports a more focused feature set than ActionBar. From start to end, a toolbar may contain a combination of the following optional elements:

A navigation button. This may be an Up arrow, navigation menu toggle, close, collapse, done or another glyph of the app’s choosing. This button should always be used to access other navigational destinations within the container of the Toolbar and its signified content or otherwise leave the current context signified by the Toolbar.

A branded logo image. This may extend to the height of the bar and can be arbitrarily wide.

A title and subtitle. The title should be a signpost for the Toolbar’s current position in the navigation hierarchy and the content contained there. The subtitle, if present should indicate any extended information about the current content. If an app uses a logo image it should strongly consider omitting a title and subtitle.

One or more custom views. The application may add arbitrary child views to the Toolbar. They will appear at this position within the layout. If a child view’s Toolbar.LayoutParams indicates a Gravity value of CENTER_HORIZONTAL the view will attempt to center within the available space remaining in the Toolbar after all other elements have been measured.

An action menu. The menu of actions will pin to the end of the Toolbar offering a few frequent, important or typical actions along with an optional overflow menu for additional actions.

In modern Android UIs developers should lean more on a visually distinct color scheme for toolbars than on their application icon. The use of application icon plus title as a standard layout is discouraged on API 21 devices and newer.

3.让Toolbar充当ActionBar

如何让Toolbar充当ActionBar? 参考Android Tips: Hello Toolbar, Goodbye Action BarAndroid Lollipop Toolbar Example

(3.1)设置Theme

可以直接设置为Theme.AppCompat.NoActionBar 主题或者给原有Theme添加两个属性表示我们不使用ActionBar。

注意,这里有个bug,很容易出现 AppCompat does not support the current theme features 的错误。 例如下面的设置:

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat">
    <item name="android:windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
</style>

正确的设置是要么直接设置为Theme.AppCompat.NoActionBar 主题;要么提供一个原有Theme的.NoActionBar扩展版本,如下所示:

参考StackOverflow: AppCompat does not support the current theme features

//**option 1**
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
    <!-- Customize your theme here. -->

</style>

//**option 2**
<style name="AppTheme" parent="Theme.AppCompat">
    <!-- Customize your theme here. -->

</style>

<style name="AppTheme.NoActionBar">
    <!-- Both of these are needed -->
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
</style>
//不需要ActionBar的Activity的Theme设置为AppTheme.NoActionBar就好了

(3.2)添加Toolbar

在Layout文件中添加Toolbar组件,就把它当做一个普通的View组件来使用即可

<Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?android:attr/actionBarSize"
    android:background="?android:attr/colorPrimary" />

(3.3)设置Toolbar为ActionBar

在Activity的onCreate 方法中调用setSupportActionBar(Toolbar) 方法。

import android.os.Bundle;
import android.support.v7.app.ActionBarActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.Toast;


public class MainActivity extends AppCompatActivity {//ActionBarActivity  AppCompatActivity 都可以

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //Caused by: java.lang.IllegalArgumentException: AppCompat does not support the current theme features

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

}

显示结果如下:

4.设置Toolbar的风格

可以直接给Toolbar添加app:theme 或者app:popupTheme 等属性设置其风格,属性值最好是继承自AppCompat的样式。此外,虽然可以这么设置,但是目前AppCompat对于以前低版本Android系统提供的Material Design支持还是很有限的,参见Styling Material Toolbar in Android

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#2196F3"
    android:minHeight="?attr/actionBarSize"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>

关于几个颜色值

OK,Toolbar介绍的差不多啦,估计大家应该能够随意地使用Toolbar啦。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Head First Systrace

    深入浅出systrace(1)systrace的简单介绍和systrace工具源码分析。

    宅男潇涧
  • Head First Stanford NLP (1)

    (深入浅出Stanford NLP 基础篇) 本文主要介绍Stanford NLP工具的基本使用方法。

    宅男潇涧
  • Head First Android ActionBar

    最近在Android Studio中新建项目时发现Activity还是和以前一样,默认继承自ActionBarActivity,但是ActionBarActiv...

    宅男潇涧
  • [ecshop模板]ecshop会员中心点击查询包裹报错修改方法

    会员中心中点击跟踪包裹,显示链接错误。您是否遇到过这个问题呢,修改方法其实很简单,操作如下: ? 修改themes/68ecshop_XXX/user_tran...

    96php.cn
  • Python数据可视化--生成随机漫步数据

    初次接触Python3的数据图表操作,其实和MATLAB语法很相似,所以有一丝似曾相识的感觉。本篇主要是使用Python的matplotlib库来绘制随机漫步图...

    小火柴棒
  • Hacking with iOS: SwiftUI Edition - 愿望清单项目(二)

    用户现在可以在我们的MapView上放置标注,但他们无法执行任何操作——他们无法附加自己的标题和副标题。解决此问题需要一些思考,因为MKPointAnnotat...

    韦弦zhy
  • Android Studio 生成自定义jar包的步骤详解

    想要将一个项目导出为jar包,供其它项目使用,在eclipse中可以直接导出该项目为jar包,而 在AS中可以通过修改gradle才处理。

    砸漏
  • Hbase(1)——基础语句(1)

    Hbase将大量数据列式存储,并且适合存储非关系型数据库,存储的数据类型都是二进制类型,这和传统的关系型数据库就有很大的区别,Hbase是基于zookeeper...

    gzq大数据
  • 2020-08-31:描述HTTP的版本之间的区别,主要是1.0/1.1/2.0三个版本的区别。

    HTTP1.0:允许即使有Body也不用Content-Length,可以用断开连接的方式表示Body结束。

    福大大架构师每日一题
  • 工作组模式下专用队列(Private Queue)如何引用远程队列路径

    查了N久资料,包括MSDN的官方文档,对于同一工作组下,不同机器之间如何利用Private Queue(专用队列)来发送/接收消息,关于Path的引用一说,无非...

    菩提树下的杨过

扫码关注云+社区

领取腾讯云代金券