第一行代码--Chapter12

2021-10-23

ActionBar为原生的标题栏，Toolbar有着比ActionBar更灵活更丰富的样式，因此更多使用Toolbar来代替ActionBar。

指定不带ActionBar的主题

在res/values/theme.xml中设置主题为Theme.AppCompat.NoActionBar或Theme.AppCompat.Light.NoActionBar

<resources xmlns:tools="http://schemas.android.com/tools">
  <!-- Base application theme. -->
  <style name="Theme.Chapter9NetworkTest" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Primary brand color. -->
    <item name="colorPrimary">@color/purple_500</item>
    <item name="colorPrimaryVariant">@color/purple_700</item>
    <item name="colorOnPrimary">@color/white</item>
    <!-- Secondary brand color. -->
    <item name="colorSecondary">@color/teal_200</item>
    <item name="colorSecondaryVariant">@color/teal_700</item>
    <item name="colorOnSecondary">@color/black</item>
    <!-- Status bar color. -->
    <item name="android:statusBarColor" tools:targetApi="l">@android:color/transparent</item>
    <!-- Customize your theme here. -->
  </style>
</resources>

设置并显示Toolbar

通过findViewById()得到Toolbar实例，之后调用setSupportActionBar()方法传入Toolbar实例。

1 2	Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar);

修改属性android:label，指定在Toolbar中显示的文字

在Toolbar上添加一些按钮

通过创建Menu resource file，命名为toolbar.xml，在该布局文件中添加item，用来表示添加的一些按钮

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

    <item
        android:id="@+id/backup"
        android:icon="@drawable/ic_backup"
        android:title="Backup"
        app:showAsAction="always" />
    <item
        android:id="@+id/delete"
        android:icon="@drawable/ic_delete"
        android:title="Delete"
        app:showAsAction="ifRoom" />
    <item
        android:id="@+id/settings"
        android:icon="@drawable/ic_settings"
        android:title="Settings"
        app:showAsAction="never" />
</menu>

app:showAsAction来指定按钮的显示位置，always表示永远显示在Toolbar中；ifRoom表示屏幕空间足够的情况下显示在Toolbar中；never表示永远显示在菜单中。Toolbar中的action按钮只显示图标，菜单中的action只显示文字。

public boolean onCreateOptionsMenu(Menu menu) {
  getMenuInflater().inflate(R.menu.toolbar, menu);
  return true;
}

@Override
public boolean onOptionsItemSelected(@NonNull MenuItem item) {
  switch (item.getItemId()) {
    case R.id.backup:
      Toast.makeText(this, "clicked Backup", Toast.LENGTH_SHORT).show();
      break;
    case R.id.delete:
      Toast.makeText(this, "clicked Delete", Toast.LENGTH_SHORT).show();
      break;
    case R.id.settings:
      Toast.makeText(this, "clicked Settings", Toast.LENGTH_SHORT).show();
      break;
    default:
  }
  return true;
}

二、DrawerLayout

滑动菜单就是将一些菜单选项隐藏起来，不放在主屏幕上，然后通过滑动的方式将菜单显示出来。

子控件布局

DrawerLayout允许放入两个直接子控件，第一个子控件为主屏幕显示内容，第二个子控件为滑动菜单中显示内容。

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_layout"
    android:layout_height="match_parent"
    android:layout_width="match_parent">

    <androidx.appcompat.widget.Toolbar
    	android:layout_width="match_parent"
      android:layout_height="?attr/actionBarSize"
      android:id="@+id/toolbar"
      android:background="?attr/colorPrimary"
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
      app:layout_scrollFlags="scroll|enterAlways|snap" />

    <com.google.android.material.navigation.NavigationView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/nav_view"
        android:layout_gravity="start"
        app:menu="@menu/nav_menu"
        app:headerLayout="@layout/nav_header" />

</androidx.drawerlayout.widget.DrawerLayout>

第二个子控件中的layout_gravity属性必须指定，left表示滑动菜单在左边，right表示滑动菜单在右边，start会根据系统语言进行判断左或是右。

点击打开隐藏菜单

首先得到DrawerLayout实例，然后调用getSupportActionBar方法得到ActionBar实例，接着调用ActionBar的setDisplayHomeAsUpEnabled让导航按钮显示出来。Toolbar最左侧的这个按钮叫做HomeAsUp按钮，其id永远都是android.R.id.home，在点击事件中调用DrawerLayout的openDrawer方法展示出滑动菜单。

mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
ActionBar actionBar = getSupportActionBar();
if (actionBar != null) {
  actionBar.setDisplayHomeAsUpEnabled(true);
  actionBar.setHomeAsUpIndicator(R.drawable.ic_menu);
}


public boolean onOptionsItemSelected(@NonNull MenuItem item) {
  switch (item.getItemId()) {	
      ...
    case android.R.id.home:
      mDrawerLayout.openDrawer(GravityCompat.START);
      break;
    default:
  }
  return true;
}

三、NavigationView

用NavigaitonView对滑动菜单页面进行布局设计。设置滑动菜单隐藏界面的头部布局文件nav_header.xml以及内置菜单布局文件nav_menu.xml，并通过app:menu和app:headerLayout将这两个布局文件加载到主布局文件中。

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/drawer_layout"
    android:layout_height="match_parent"
    android:layout_width="match_parent">

    <androidx.appcompat.widget.Toolbar
    	android:layout_width="match_parent"
      android:layout_height="?attr/actionBarSize"
      android:id="@+id/toolbar"
      android:background="?attr/colorPrimary"
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
      app:layout_scrollFlags="scroll|enterAlways|snap" />

    <com.google.android.material.navigation.NavigationView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/nav_view"
        android:layout_gravity="start"
        app:menu="@menu/nav_menu"
        app:headerLayout="@layout/nav_header" />

</androidx.drawerlayout.widget.DrawerLayout>

菜单项点击响应事件

NavigationView navView = (NavigationView) findViewById(R.id.nav_view); navView.setCheckedItem(R.id.nav_call);
navView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
  @Override
  public boolean onNavigationItemSelected(@NonNull MenuItem item) {
    mDrawerLayout.closeDrawers();
    return true;
  }
});

四、FloatingActionButton与Snackbar

FloatingActionButton为悬浮按钮，点击事件与普通按钮并无差别。Snackbar与Toast的相似之处在于都可以作为提示的工具，Toast的作用是告诉用户现在发生了什么，用户只能被动接收这个事情，不能让用户进行选择；Snackbar允许在提示中加入一个可交互按钮，进而可以执行一些额外操作。

FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
  @Override
  public void onClick(View view) {
    Snackbar.make(view, "Data deleted", Snackbar.LENGTH_SHORT).setAction("Undo", new View.OnClickListener() {
      @Override
      public void onClick(View view) {
        Toast.makeText(MainActivity.this, "Data restored", Toast.LENGTH_SHORT).show();
      }
    }).show();
  }
});

五、CoordinateLayout

当点击悬浮按钮弹出SnackBar，此时的提示消息会挡住悬浮按钮，CoordinateLayout可以解决这个问题，CoordinateLayout可以监听其所有子控件的各种事件，自动做出最合理的响应。

六、CardView

在app/build.gradle中添加依赖implementation “androidx.cardview:cardview:1.0.0”

<androidx.cardview.widget.CardView  android:layout_width="match_parent"  android:layout_height="wrap_content"  android:layout_marginBottom="15dp"  android:layout_marginLeft="15dp"  android:layout_marginRight="15dp"  android:layout_marginTop="35dp"  app:cardCornerRadius="4dp">  <TextView    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:layout_margin="10dp"    android:id="@+id/fruit_content_text"/></androidx.cardview.widget.CardView>

通过app:cardCornerRadius指定卡片圆角弧度；通过app:elevation指定卡片高度

七、AppBarLayout

内部有很多滚动事件的封装

八、SwipeRefreshLayout

用来设置下拉刷新，对于需要下拉刷新的控件，需要将其布局在SwipeRefreshLayout内，

<androidx.swiperefreshlayout.widget.SwipeRefreshLayout  android:layout_width="match_parent"  android:layout_height="match_parent"  android:id="@+id/swipe_refresh"  app:layout_behavior="@string/appbar_scrolling_view_behavior"><androidx.recyclerview.widget.RecyclerView  android:layout_width="match_parent"  android:layout_height="match_parent"  android:id="@+id/recycler_view" /></androidx.swiperefreshlayout.widget.SwipeRefreshLayout>

一、Toolbar