3

尽管互联网上或多或少有一些Toolbar关于扩展如何工作以及如何向其添加不同Views 的信息，但我想为我和其他想要实现扩展的人提供分步指南扩展 Toolbar到他们的应用程序（具体来说，如何向 s 添加视图，Toolbar我应该使用什么度量来测量不同ViewsToolbar和

如果可能的话，我还想实现浮动操作按钮和一些材料设计动画，因为我在 Android 中看不到任何类或内置方法。

4

2 回答 2

4

更新：

在 Google I/O 2015 之后，您可以使用Design Support Library来实现 Floating Action Button (FAB) 等 Material Design 视图。Toolbar仍将使用 v7 支持库创建，如下所示。

设计Toolbar：

查看来自 Google 的这些规范和指南，我设法Toolbar使用正确的规范和测量设置了我想要的扩展方式。

在我的例子中，我使用Fragments 来更改主要内容（其中Views扩展的内部Toolbar也会不同），所以我有一个用于活动的布局文件，以及用于其他片段的不同布局文件。我的主要活动的布局是：

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <include android:id="@+id/main_toolbar" layout="@layout/toolbar" />

    <FrameLayout
        android:id="@+id/main_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/main_toolbar" />
</RelativeLayout>

@layout/toolbar简称为以下布局（我用于标准工具栏的布局（即正常高度，就像一个ActionBar））：

<?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:background="?attr/colorPrimary"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

并且FrameLayout（在主要活动的布局中）中的内容将在 Java 中更改。我的一个片段需要两个Spinners，我想将它们嵌入到扩展的Toolbar. Toolbar可以方便地用作，因此我为我的片段之一ViewGroup创建并使用了以下布局：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <android.support.v7.widget.Toolbar
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/extended_toolbar"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:minHeight="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:contentInsetStart="72dp"
        app:contentInsetEnd="16dp"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" >

        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="bottom|center_horizontal"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" >

            <include layout="@layout/toolbar_space_margin" />

            <Spinner
                android:id="@+id/spinner_one"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>

            <Spinner
                android:id="@+id/spinner_two
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="8dp"/>

            <include layout="@layout/toolbar_space_margin" />
        </LinearLayout>
    </android.support.v7.widget.Toolbar>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/extended_toolbar" >

        <!-- The main content of that activity layout -->

    </ScrollView>
</RelativeLayout>

指的是我在 中定义?attr/colorPrimary的原色 ( ) 。我认为这两个属性就像. 这意味着将来自 的左边缘，也将来自它的右边缘。另外，我引用了两次，这基本上是我用于顶部和底部边距的空视图：colorPrimarystyles.xmlcontentInsetStartcontentInsetEndToolbarLinearLayout72dpToolbar16dp@layout/toolbar_space_margin

<?xml version="1.0" encoding="utf-8"?>
<Space
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="16dp" />

使用浮动操作按钮：

至于使用浮动操作按钮，我找到了各种教程和关于此的Stack Overflow 帖子，所以我使用了这些。我应该更好地研究问题的那部分......

我希望其他遇到这个设计问题的人会发现这个答案很有用。

于 2015-05-17T15:13:17.393 回答
1

Heree是关于如何使用全新工具栏的一个很好的教程。

将工具栏集成到您的 Activity 后，您可以像往常一样添加菜单项。（通过 onCreateOptionMenu() 和 xxx_menu.xml）

和...这是关于 FAB aka Floating-Action-Button 的教程。

于 2015-05-10T16:44:04.910 回答