什麼是 Action?

Action主要提供在該Activity中最重要的操作, Action會加入到 App Bar 中。如下圖的加號。

例如,照片瀏覽App可能會提供Action作為共享按鈕和創建按鈕,而當查看單張照片時可能會提供Action作為裁剪和過濾按鈕。
但App Bar的空間有限,如果Action數量多於App Bar中可以容納的數量,則App Bar會將多餘的Action放在overflow menu。也可以指定Action應該顯示在overflow menu中而不是顯示在App Bar。
 

建立 Action

所有的Action和其他元件都是定義在menu資源中。
首先在app/src/main/res/menu目錄中建立menu resource file。
並在menu resource file內加入一個<item>元素,該元素定義要顯示的Action如下
/app/src/main/res/menu/main_actions.xml

<?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/action_add"
    android:title="Add"
    android:icon="@drawable/add"
    android:orderInCategory="1"
    app:showAsAction="ifRoom"
    />
</menu>

android:id=“@+id/action_add”是為了在程式碼中引用Action。android:icon=“@drawable/add”是該Action顯示在App Bar上的圖示android:orderInCategory=“1” 是該Action顯示在App Bar上的順序,越小越靠近左側
app:showAsAction=“ifRoom” 是該Action的圖示如何顯示的設定,可用的選項如下
ifRoom ->app bar有空間再加入,若空間不夠則放入overflow menu
withText -> 加入標題文字
never -> 總是在overflow menu,不在app bar的空間
always -> 總是放在app bar
以上的屬性的說明可以參考這裡
https://developer.android.com/guide/topics/resources/menu-resource
在編輯menu resource file時可以開啟preview視窗,方便查看目前的頁面。

 

加入 Action 到 App Bar

覆寫Activity的onCreatOptionsMenu方法,並在該方法中指定要使用的menu resource file。

package com.codefoxx.toolbarexample.basicaction;
import android.view.Menu;
import android.view.View;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import androidx.appcompat.widget.Toolbar;
import com.codefoxx.toolbarexample.R;
public class BasicActionActivity extends AppCompatActivity {
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_basic_action);
    Toolbar toolBar = findViewById(R.id.app_toolbar);
    setSupportActionBar(toolBar);
  }
  @Override
  public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.main_actions, menu);
    return super.onCreateOptionsMenu(menu);
  }
}

這裡要注意的是若該Activity使用的是Tool Bar,則必須要先設定Tool Bar,也就是上面的

Toolbar toolBar = findViewById(R.id.app_toolbar);
setSupportActionBar(toolBar);

否則下方的onCreateOptionsMenu會失效。
啟動App,便可以看到Action顯示在App Bar中。

實作 Action 行為

接著實作按下該Action時的行為。
覆寫Activity的onOptionsItemSelected方法,該方法就是使用者點擊App Bar上的 Action會觸發的方法。
在該方法中根據在menu resource file的<item> android:id設定的值來判斷按下了哪個Action。
以下範例很簡單的顯示Toast

package com.codefoxx.toolbarexample.basicaction;
import android.content.Intent;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;
import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import androidx.appcompat.widget.Toolbar;
import com.codefoxx.toolbarexample.R;
public class BasicActionActivity extends AppCompatActivity {
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_basic_action);
    Toolbar toolBar = findViewById(R.id.app_toolbar);
    setSupportActionBar(toolBar);
  }
  @Override
  public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.main_actions, menu);
    return super.onCreateOptionsMenu(menu);
  }
  @Override
  public boolean onOptionsItemSelected(@NonNull MenuItem item) {
    int itemId = item.getItemId();
    switch (itemId) {
      case R.id.action_add:
        Toast.makeText(this, "click add action button", Toast.LENGTH_SHORT).show();
        break;
    }
    return super.onOptionsItemSelected(item);
  }
}

完成,以上便是加入Action到App Bar的範例。
完整程式碼如下
/app/src/main/res/layout/activity_basic_action.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  tools:context=".basicaction.BasicActionActivity">
  <include
    android:id="@+id/app_toolbar"
    layout="@layout/toolbar_main"
    />
</androidx.constraintlayout.widget.ConstraintLayout>

/app/src/main/res/menu/toolbar_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.Toolbar
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="?attr/actionBarSize"
  android:background="?attr/colorPrimary"
  android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
</androidx.appcompat.widget.Toolbar>

 
以下是App Bar的相關內容。
http://34.80.81.192/?p=6149
http://34.80.81.192/?p=6176
http://34.80.81.192/?p=6192