以下內容為參考官網以及實際實作的心得。
App Bar 是什麼?
App Bar (也稱為Action Bar) 是Activity重要的設計元素之一，因為它提供了使用者熟悉的視覺結構和交互元素。使用App Bar可讓App的行為和外觀保持一致，讓使用者能夠快速了解如何操作並獲得良好的體驗。
App Bar的主要功能為
a.為App提供名稱並顯示目前在App中的位置。
b.提供重要操作，例如搜尋。。
c.支持導航和視圖切換。
從Android 3.0(API Level 11)開始，使用預設主題的所有activity都將使用Action Bar作為App Bar。但Action Bar的功能是在各個Android版本中逐漸加入，因此Action Bar的行為可能會有所不同，實際上取決於設備使用的Android版本。
相比之下，在android support library的Tool Bar已加入了最新功能，並且可以在任何可以使用支持函式庫的設備上使用。
因此，應該使用android support library的Tool Bar來實現App Bar，這種方式有助於App在大多數的設備上具有一致的行為。
加入 Tool Bar 到 Activity
1.加入 androidx appcompat library，因為Tool Bar位於該函式庫內
Note:從Android 9開始，Google推薦使用androidx library，因此這裡使用的是androidx，而不是v7 appcompat support library。
詳細內容參考https://developer.android.com/topic/libraries/support-library/setup
Project 的build.gradle加入
buildscript {
repositories {
google()
jcenter()
...
}
}
allprojects {
repositories {
google()
jcenter()
...
}
}
Module的build.gradle加入
dependencies {
...
implementation 'androidx.appcompat:appcompat:1.0.2'
...
}
2.讓Activity繼承 AppCompatActivity
import androidx.appcompat.app.AppCompatActivity;
public class BasicToolBarActivity extends AppCompatActivity {
...
}
3. 設定AndroidManifest.xml的 <application> 元素使用appcompat的 NoActionBar 主題
Note:改用NoActionBar的目的就是不使用預設的Action Bar
<application
android:theme="@style/Theme.AppCompat.Light.NoActionBar"
/>
...
4.加入 Tool Bar 到 Activity 的佈局檔中。
有兩種做法，第一種是直接在Activity的佈局檔中加入(寫死的做法)，這種做法的缺點是當要修改Tool Bar時，所有的Activity寫死的部分都要修改。如下
<?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=".basictoolbar.BasicToolBarActivity">
<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>
</androidx.constraintlayout.widget.ConstraintLayout>
第二種做法是另外建立一個Tool Bar的佈局檔，然後在Activity的佈局檔中使用<include>加入Tool Bar的佈局檔。比較建議這種做法。
如下新增app/src/res/main/layout/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>
接著在Activity的佈局檔中使用<include>引入Tool Bar的佈局檔
/app/src/main/res/layout/activity_basic_tool_bar.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>
5.在Activity的 onCreate() 中呼叫 setSupportActionBar() 方法並傳入在佈局檔中的Tool Bar物件
package com.codefoxx.toolbarexample.basictoolbar;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import androidx.appcompat.widget.Toolbar;
import com.codefoxx.toolbarexample.R;
public class BasicToolBarActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_basic_tool_bar);
Toolbar toolBar = findViewById(R.id.app_toolbar);
setSupportActionBar(toolBar);
}
}
完成，現在就是使用 Tool Bar 作為 App Bar。在預設的情況下會有App的名稱以及overflow menu。
另外使用Tool Bar作為App Bar時就可以呼叫androidx appcompat library的Action Bar類別所提供的方法。
具體的做法是呼叫 getSupportActionBar 方法，該方法返回Action Bar參考，取得Action Bar參考之後便可操縱Tool Bar。如下在程式碼中重新設定App Bar的 title
public class BasicToolBarActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_basic_tool_bar);
Toolbar toolBar = findViewById(R.id.app_toolbar);
setSupportActionBar(toolBar);
ActionBar supportActionBar = getSupportActionBar();
supportActionBar.setTitle("set customize title bar");
}
}
以上便是加入基本的Tool Bar到Activity的方式。
以下是關於App Bar其他操作。
http://34.80.81.192/?p=6165
http://34.80.81.192/?p=6176
http://34.80.81.192/?p=6192
Article Comments