ตั้งค่าแถบแอป

ลองใช้วิธีแบบ Compose

Jetpack Compose เป็นชุดเครื่องมือ UI ที่แนะนำสำหรับ Android ดูวิธีเพิ่มคอมโพเนนต์ใน Compose

แถบแอป →

ในรูปแบบพื้นฐานที่สุด แถบการดำเนินการจะแสดงชื่อของกิจกรรมที่ด้านหนึ่ง และเมนูแบบล้นที่อีกด้านหนึ่ง แม้จะเป็นรูปแบบพื้นฐานนี้ แต่ App Bar ก็ยังให้ข้อมูลที่เป็นประโยชน์แก่ผู้ใช้และทำให้แอป Android มีรูปลักษณ์ที่สอดคล้องกัน

รูปที่ 1 แถบแอปที่มีไอคอนการดำเนินการในแอป "Now in Android"

กิจกรรมทั้งหมดที่ใช้ธีมเริ่มต้นจะมี ActionBar เป็นแถบแอป เราได้เพิ่มฟีเจอร์แถบแอปใน ActionBar ดั้งเดิมในการเปิดตัว Android เวอร์ชันต่างๆ ด้วยเหตุนี้ ActionBar ดั้งเดิมจึงทำงานแตกต่างกัน ขึ้นอยู่กับเวอร์ชันของ Android ที่อุปกรณ์ใช้

ในทางกลับกัน ฟีเจอร์จะได้รับการเพิ่มลงในเวอร์ชันของ Toolbar ในไลบรารี AndroidX AppCompat ซึ่งหมายความว่าฟีเจอร์เหล่านั้นจะพร้อมใช้งานในอุปกรณ์ที่ใช้ไลบรารี AndroidX

ใช้คลาส Toolbar ของไลบรารี AndroidX เพื่อติดตั้งใช้งานแถบแอปของกิจกรรมด้วยเหตุผลนี้ การใช้แถบเครื่องมือของไลบรารี AndroidX จะช่วยให้ลักษณะการทำงานของแอป สอดคล้องกันในอุปกรณ์ที่หลากหลายที่สุด

เพิ่มแถบเครื่องมือไปยังกิจกรรม

ขั้นตอนต่อไปนี้จะอธิบายวิธีตั้งค่า Toolbar เป็นแถบแอปของกิจกรรม

1. เพิ่มไลบรารี AndroidX ลงในโปรเจ็กต์ตามที่อธิบายไว้ในภาพรวมของ AndroidX
2. ตรวจสอบว่ากิจกรรมขยาย AppCompatActivity:

   Kotlin

   class MyActivity : AppCompatActivity() {
     // ...
   }

   Java

   public class MyActivity extends AppCompatActivity {
     // ...
   }

   หมายเหตุ: ทำการเปลี่ยนแปลงนี้สำหรับทุกกิจกรรมในแอปที่ใช้ Toolbar เป็นแถบแอป
3. ในไฟล์ Manifest ของแอป ให้ตั้งค่าองค์ประกอบ <application> ให้ใช้ธีม NoActionBar ธีมใดธีมหนึ่งของ AppCompat ดังที่แสดงในตัวอย่างต่อไปนี้ การใช้ธีมใดธีมหนึ่งเหล่านี้จะป้องกันไม่ให้แอปใช้คลาส ActionBar ดั้งเดิมเพื่อแสดงแถบแอป

   <application
       android:theme="@style/Theme.AppCompat.Light.NoActionBar"
       />

4. เพิ่ม Toolbar ลงในเลย์เอาต์ของกิจกรรม ตัวอย่างเช่น โค้ดเลย์เอาต์ต่อไปนี้ จะเพิ่ม Toolbar และทำให้ดูเหมือนลอยอยู่ เหนือกิจกรรม

   <androidx.appcompat.widget.Toolbar
      android:id="@+id/my_toolbar"
      android:layout_width="match_parent"
      android:layout_height="?attr/actionBarSize"
      android:background="?attr/colorPrimary"
      android:elevation="4dp"
      android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

   ดูคำแนะนำเกี่ยวกับการยกระดับแถบแอปได้ที่ ข้อกำหนดของ Material Design

   วางแถบเครื่องมือที่ด้านบนของเลย์เอาต์ของกิจกรรม เนื่องจากคุณใช้แถบเครื่องมือเป็นแถบแอป

5. ในเมธอด onCreate() ของกิจกรรม ให้เรียกใช้เมธอด setSupportActionBar() ของกิจกรรมและส่งแถบเครื่องมือของกิจกรรม ดังที่แสดงในตัวอย่างต่อไปนี้ เมธอดนี้ จะตั้งค่าแถบเครื่องมือเป็นแถบแอปสำหรับกิจกรรม

   Kotlin

   override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)
       setContentView(R.layout.activity_my)
       // The Toolbar defined in the layout has the id "my_toolbar".
       setSupportActionBar(findViewById(R.id.my_toolbar))
   }

   Java

   @Override
   protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_my);
       Toolbar myToolbar = (Toolbar) findViewById(R.id.my_toolbar);
       setSupportActionBar(myToolbar);
   }

ตอนนี้แอปของคุณมีแถบการดำเนินการพื้นฐานแล้ว โดยค่าเริ่มต้น แถบการดำเนินการจะมีชื่อของแอปและเมนูรายการเพิ่มเติม ซึ่งจะมีรายการการตั้งค่าในตอนแรก คุณสามารถเพิ่มการดำเนินการเพิ่มเติมลงในแถบการดำเนินการและเมนูรายการเพิ่มเติมได้ตามที่อธิบายไว้ใน เพิ่มและจัดการการดำเนินการ

ใช้วิธีการยูทิลิตีของแถบแอป

เมื่อตั้งค่าแถบเครื่องมือเป็นแถบแอปของกิจกรรมแล้ว คุณจะมีสิทธิ์เข้าถึงเมธอดยูทิลิตี ที่จัดทำโดยคลาส ActionBar ของไลบรารี AndroidX แนวทางนี้ช่วยให้คุณทำสิ่งต่างๆ ที่เป็นประโยชน์ได้ เช่น ซ่อนและแสดงแถบแอป

หากต้องการใช้วิธีการยูทิลิตี ActionBar ให้เรียกใช้เมธอด getSupportActionBar() ของกิจกรรม เมธอดนี้จะแสดงผลการอ้างอิงไปยังออบเจ็กต์ ActionBar ของ AppCompat เมื่อมีข้อมูลอ้างอิงดังกล่าวแล้ว คุณจะเรียกใช้เมธอด ActionBar เพื่อปรับแถบแอปได้ เช่น หากต้องการซ่อนแถบแอป ให้เรียกใช้ ActionBar.hide()