AppBar

Bilah aplikasi terdiri dari bilah alat dan kemungkinan tampilan lainnya. Mengekspos satu atau lebih tindakan.

Manfaat utama menggunakan appbar adalah dapat menyesuaikan semuanya. Opsi penyesuaian seperti:

• Tinggi bilah aplikasi khusus.
• Sertakan konten apa pun tanpa batasan atau batasan (margin, ukuran, dll.).
• Bilah aplikasi transparan.
• Dll.

CATATAN: AppBar adalah tampilan lintas platform yang mengambil alih ketika navbar asli mencapai batasnya, seperti menambahkan konten khusus, pemosisian dengan tata letak, dll.

Di Xamarin.Forms, bilah aplikasi biasanya digunakan di properti Shell.AppBar , yang menempatkan bilah aplikasi sebagai widget dengan ketinggian tetap di bagian atas layar.

API

Selanjutnya, daftar dengan properti dan acara AppBar.

Properti

| Properti | Ketik | Deskripsi |
|----------|:-------------:|:-------------:|
| Penempatan | AppBarPlacement | Penempatan AppBar (atas atau bawah). |
| BarHeight | ganda | Tentukan tinggi bilah aplikasi. |
| BarLatar Belakang | Kuas | Kuas yang menyediakan latar belakang. |
| BarBackgroundImage | Sumber Gambar | ImageSource yang menyediakan latar belakang. |
| BarTeksWarna | Warna | Warna yang digunakan dalam teks (judul, dll.). |
| Ikon Navigasi | Sumber Gambar | ImageSource yang menyediakan ikon navigasi (tombol kembali, dll). |
| Judul Tombol Kembali | string | Tentukan judul tombol kembali bilah aplikasi. |
| Warna Perbatasan | Warna | Warna batas bilah aplikasi. |
| Ketebalan Perbatasan | Ketebalan | Lebar batas appbar di setiap sisi. |
| FontFamily | string | Keluarga font yang digunakan dalam teks bilah aplikasi. |
| FontAttributes | FontAttributes | Atribut font yang digunakan dalam teks bilah aplikasi. |
| Ukuran Font | ganda | Ukuran font yang digunakan dalam teks bilah aplikasi. |
| Tampilan Judul | Lihat | Tampilkan Tampilan Xamarin.Forms apa pun di bilah aplikasi. |
| Perintah Kembali | ICommand | Perintah dijalankan dengan menavigasi kembali. |
| KembaliCommandParameter | objek | Parameter perintah yang digunakan untuk menavigasi kembali. |

Acara

| Acara | Deskripsi |
|----------|:-------------:|
| KembaliKetuk | Peristiwa yang dimunculkan saat pengguna menavigasi kembali. |

Skenario

Mari kita lihat beberapa contoh yang mencakup skenario umum.

Bilah aplikasi sederhana

Mari kita lihat contoh dasarnya:

<Shell>
     <Shell.AppBar>
         <AppBar />
     </Shell.AppBar>
    ...
</Shell>

Bilah aplikasi khusus

Menyesuaikan tampilan menggunakan bilah transparan dengan tinggi khusus dan konten khusus (TitleView).

<Shell>
     <Shell.AppBar>
        <AppBar  
            BarHeight="120"
            BarBackgroundColor="Transparent">
            <AppBar.TitleView>
            ...
            </AppBar.TitleView>
        </AppBar>
     </Shell.AppBar>
    ...
</Shell>

Penempatan

Bilah aplikasi teratas (penempatan default) menampilkan navigasi dan tindakan di bagian atas layar seluler.

<Shell>
     <Shell.AppBar
          Placement="Top">
         <AppBar />
     </Shell.AppBar>
    ...
</Shell>

Bilah aplikasi bawah menampilkan navigasi dan tindakan di bagian bawah layar seluler.

<Shell>
     <Shell.AppBar
          Placement="Bottom">
         <AppBar />
     </Shell.AppBar>
    ...
</Shell>

Menggunakan Gaya

Dapat menyesuaikan tampilan konten tab, strip tab, item tab, dll menggunakan gaya XAML atau CSS .

Menggunakan XAML:

<Style
    x:Key="AppBarStyle"
    TargetType="AppBar">
    <Setter
        Property="BarHeight"
        Value="120" />
    <Setter
        Property="BarBackgroundColor"
        Value="Transparent" />
</Style>

Menggunakan CSS:

.appBarStyle {
  background: transparent;
  height: 120px;
}

Kesulitan: Sedang

Informasi lebih lanjut

Berdasarkan https://github.com/xamarin/Xamarin.Forms/issues/10774