Android P开发人员预览版现已公开发布。
在本教程中，我们将研究两个有趣的组件：支持库v28附带的BottomAppBar和MaterialButton，它们是更新的Material Design的一部分。

如果您尚未将Android Studio和AVD模拟器更新为Android P，请按照以下步骤进行操作。

将Android Studio更新到SDK 28

转到工具| SDK Manager，然后下载Android P Developer预览版(或者稳定的版本，以最新可用的版本为准！)。

从SDK Manager中的" SDK构建工具"选项卡安装最新的构建工具(28.0.0或者更高版本)。
现在在模拟器上运行Android P目标代码。
AVD Manager并安装最新的Android P系统镜像以创建模拟器。

现在创建一个新的Android Studio项目，并将目标SDK版本设置为Android：28(android-p)。

在您应用的build.gradle中添加以下库。

implementation 'com.android.support:appcompat-v7:28.0.0-alpha1'
implementation 'com.android.support:design:28.0.0-alpha1'
implementation 'com.android.support:support-v4:28.0.0-alpha1'

您的build.gradle应该如下所示：

现在，我们准备实现Android支持v28附带的BottomAppBar和MaterialButton。
在开始之前，让我们看看它们是如何定义的。

Android BottomAppBar

BottomAppBar扩展了工具列，并在屏幕底部定义。
它带有一个半圆形的切口，用于连接附加的FloatingActionButton。

像这样：

我们可以在BottomAppBar中设置FloatingActionButton的直径和位置。

通过以下方式在XML中定义BottomAppbar：

<android.support.design.bottomappbar.BottomAppBar
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_gravity="bottom"
  app:fabAttached="true"
  app:backgroundTint="@color/colorPrimary"
  app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
  app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

• app：fabAttached =" true"用于附加FloatingActionButton。
  在FloatingActionButton中，您必须将app：layout_anchor设置为BottomAppBar ID。
  此外，您可以设置以下属性：

• app：fabAlignmentMode：设置FloatingActionButton在BottomAppBar中的位置。
  默认情况下，它居中。

• app：fabCradleDiameter：设置切口弧的直径。

• app：fabCradleVerticalOffset：设置FloatingActionButton与圆弧切除的垂直距离。

• app：menu用于设置菜单资源文件。
  您也可以通过编程方式进行。

您必须使用bottomAppbar.replaceMenu()在BottomAppBar上设置菜单。
否则，将不会显示BottomAppbar。

将FAB放置在BottomAppBar的中间而不显示弧线。

<android.support.design.bottomappbar.BottomAppBar
      android:id="@+id/bottom_appbar"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_gravity="bottom"
      app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
      app:fabAttached="true"
      app:backgroundTint="@color/colorPrimary"
      app:fabCradleDiameter="8dp"
      app:fabCradleVerticalOffset="4dp"

Android MaterialButton

MaterialButton是Button上的新Material Design主题。
它扩展了AppCompatButton。
它直接提供了材质主题，而无需添加样式/主题。

要定义MaterialButton，我们要做：

<android.support.design.button.MaterialButton
          android:id="@+id/materialButton"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:padding="18dp"
          android:layout_gravity="center"
          android:textColor="#fff"
          android:text="Material Button"
          app:backgroundTint="@color/colorPrimary"

默认情况下，背景颜色与" colorAccent"相同。

app：backgroundTint用于设置新颜色。

app：icon除了按钮文本外，还用于设置可绘制的图标。

• app：iconTint用于设置图标的颜色。

• app：iconPadding设置填充。

app：rippleColor`：用于在单击按钮时设置波纹颜色。

• app：strokeColor`：用于设置按钮的边框颜色。

• app：strokeWidth：用于设置边框的宽度。

• app：cornerRadius用于设置拐角处的半径。

现在，我们来构建我们的应用程序，在这里我们将同时使用BottomAppBar和MaterialButton。

Android BottomAppBar MaterialButton代码

下面给出了activity_main.xml布局文件的代码：

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
  xmlns:android="https://schemas.android.com/apk/res/android"
  xmlns:app="https://schemas.android.com/apk/res-auto"
  xmlns:tools="https://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  tools:context=".MainActivity">

  <android.support.design.bottomappbar.BottomAppBar
      android:id="@+id/bottom_appbar"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_gravity="bottom"
      app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
      app:fabAttached="true"
      app:backgroundTint="@color/colorPrimary"
      app:fabCradleVerticalOffset="12dp"

  <android.support.design.widget.FloatingActionButton
      android:id="@+id/fab"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_gravity="bottom|center_horizontal"
      android:src="@android:drawable/ic_dialog_email"
      app:layout_anchor="@+id/bottom_appbar"

  <FrameLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent">

      <android.support.design.button.MaterialButton
          android:id="@+id/materialButton"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:padding="18dp"
          android:gravity="center_vertical"
          android:layout_gravity="center"
          app:icon="@android:drawable/ic_input_get"
          app:iconTint="@android:color/holo_red_dark"
          app:rippleColor="@color/colorAccent"
          app:strokeColor="@android:color/holo_green_dark"
          app:strokeWidth="3dp"
          android:textColor="#fff"
          android:text="Toggle FAB Position"
          app:backgroundTint="@color/colorPrimary"

  </FrameLayout>

</android.support.design.widget.CoordinatorLayout>

如果尚未创建菜单资源目录，请立即创建。
右键单击res |新目录。
将其命名为"菜单"。
在目录中创建新的菜单文件。

下面给出了" my_menu.xml"文件的代码：

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="https://schemas.android.com/apk/res/android"
  xmlns:app="https://schemas.android.com/apk/res-auto">

  <item
      android:id="@+id/next_btn"
      android:checked="true"
      android:icon="@android:drawable/ic_input_add"
      android:title="Item"
      app:showAsAction="ifRoom" 

  <item
      android:id="@+id/action_settings"
      android:title="Settings" 

</menu>

MainActivity.java类的代码如下：

package com.theitroad.android28;

import android.os.Bundle;
import android.support.design.bottomappbar.BottomAppBar;
import android.support.design.button.MaterialButton;
import android.support.v7.app.AppCompatActivity;
import android.view.View;

public class MainActivity extends AppCompatActivity {

  BottomAppBar bottomAppBar;
  MaterialButton materialButton;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      bottomAppBar = findViewById(R.id.bottom_appbar);
      materialButton = findViewById(R.id.materialButton);

      bottomAppBar.replaceMenu(R.menu.my_menu);
      materialButton.setOnClickListener(new View.OnClickListener() {
          @Override
          public void onClick(View view) {
              if (bottomAppBar.getFabAlignmentMode() == BottomAppBar.FAB_ALIGNMENT_MODE_CENTER)
                  bottomAppBar.setFabAlignmentMode(BottomAppBar.FAB_ALIGNMENT_MODE_END);
              else {
                  bottomAppBar.setFabAlignmentMode(BottomAppBar.FAB_ALIGNMENT_MODE_CENTER);
              }
          }
      });
  }

}

bottomAppBar.replaceMenu()用于设置BottomAppBar中的菜单项。
单击MaterialButton时，我们相对于BottomAppBar切换FAB位置。