Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
Template Tab berfungsi sebagai penampung untuk template lain yang tercantum di bawah, menyediakan
tab di bagian atas (seperti yang ditunjukkan dalam
Anatomi template Tab).
Dengan tab, Anda dapat beralih di antara tampilan. Kemampuan ini sangat berguna untuk
mengatur konten atau tampilan yang akan dijelajahi atau ditelusuri pengguna.
Mencakup:
Menu tab dengan ikon aplikasi dan maksimal 4 tab (tanpa tombol kembali)
Template tersemat, yang dapat berupa salah satu jenis berikut:
Setiap tampilan tab berhubungan dengan satu template tersemat, dan hanya satu tampilan tab
yang dapat aktif pada satu waktu.
Anatomi template Tab
Template Tab terdiri dari elemen-elemen berikut:
Panel tab, yang dapat menampilkan hingga 4 tab
Template tersemat, menggunakan salah satu template
berikut: Daftar, Petak, Penelusuran, Panel, Pesan, atau Navigasi
Contoh template tab
Tampilan tab "Semua perangkat" dibuat menggunakan template Tab yang
berisi template Daftar (contoh Android Auto)Tampilan tab "Perangkat rumah" dibuat menggunakan template Tab yang
berisi template Petak (contoh Android Auto)
Persyaratan UX template tab
Developer aplikasi:
HARUS
Sediakan ikon vektor monokromatik untuk setiap tab.
HARUS
Sertakan minimal 2 dan maksimal 4 tab di header aplikasi.
TIDAK BOLEH
Izinkan lebih dari 1 tab untuk aktif sekaligus.
TIDAK BOLEH
Buat navigasi sekunder dengan menambahkan tab tingkat kedua.
SEBAIKNYA
Gunakan label tab yang pendek untuk menghindari pemotongan.
TIDAK BOLEH
Mengandalkan header atau strip tindakan dalam template tersemat.
[null,null,["Terakhir diperbarui pada 2025-07-25 UTC."],[[["\u003cp\u003eThe Tab template serves as a container for other templates, organizing content into a tabbed interface.\u003c/p\u003e\n"],["\u003cp\u003eIt supports embedding List, Grid, Search, Pane, Message, or Navigation templates within each tab.\u003c/p\u003e\n"],["\u003cp\u003eApps should utilize 2-4 tabs with monochromatic icons and concise labels for optimal usability.\u003c/p\u003e\n"],["\u003cp\u003eOnly one tab can be active at a time, and embedded templates should avoid using their own headers.\u003c/p\u003e\n"],["\u003cp\u003eTab templates are ideal for creating switchable views for content browsing or searching within an app.\u003c/p\u003e\n"]]],[],null,["# Tab template\n\n\u003cbr /\u003e\n\nThe Tab template acts as a container for other templates listed below, providing\ntabs across the top (as shown in\n[Anatomy of the Tab template](#anatomy)).\n\nThe tabs allow switching among views. This capability is particularly useful for\norganizing content or views that users will want to browse or search. \n**Includes:**\n\n- Tab bar with app icon and up to 4 tabs (no back button)\n- Embedded template, which can be any of the following types:\n - [List](/cars/design/create-apps/apps-for-drivers/templates/list-template)\n - [Grid](/cars/design/create-apps/apps-for-drivers/templates/grid-template)\n - [Search](/cars/design/create-apps/apps-for-drivers/templates/search-template)\n - [Pane](/cars/design/create-apps/apps-for-drivers/templates/pane-template)\n - [Message](/cars/design/create-apps/apps-for-drivers/templates/message-template)\n - [Navigation](/cars/design/create-apps/apps-for-drivers/templates/navigation-template)\n\nEach tab view corresponds to one embedded template, and only one tab view\ncan be active at any given time.\n\n\u003cbr /\u003e\n\n| **Note:** Headers from embedded templates are ignored because the space that would normally be used for the header is used for the tab bar.\n\nAnatomy of the Tab template\n---------------------------\n\nThe Tab template consists of the following elements:\n\n1. **Tab bar**, which can show up to 4 tabs\n2. **Embedded template**, using one of the following templates: List, Grid, Search, Pane, Message, or Navigation\n\nTab template examples\n---------------------\n\nThe \"All devices\" tab view is created using a Tab template that contains a List template (Android Auto example) The \"Home devices\" tab view is created using a Tab template that contains a Grid template (Android Auto example)\n\n\u003cbr /\u003e\n\nTab template UX requirements\n----------------------------\n\n**App developers**:\n\n|----------------|-----------------------------------------------------------------|\n| **MUST** | Provide monochromatic vector icons for each tab. |\n| **MUST** | Include at least 2 and no more than 4 tabs in the app header. |\n| **MUST NOT** | Allow more than 1 tab to be active at a time. |\n| **MUST NOT** | Create a secondary navigation by adding a second level of tabs. |\n| **SHOULD** | Use short tab labels to avoid truncation. |\n| **SHOULD NOT** | Rely on a header or action strip in embedded templates. |"]]
