Bagikan melalui

Akrilik dalam aplikasi

Anda dapat menerapkan akrilik dalam aplikasi ke permukaan aplikasi Anda menggunakan sumber daya XAML AcrylicBrush atau tema yang telah AcrylicBrush ditentukan sebelumnya.

Buka aplikasi Galeri WinUI dan lihat Akrilik beraksi

WinUI mencakup kumpulan sumber daya tema kuas yang menghormati tema aplikasi dan beralih ke warna solid jika diperlukan. Untuk melukis surface tertentu, terapkan salah satu sumber daya tema ke latar belakang elemen sama seperti Anda akan menerapkan sumber daya kuas lainnya.

<Grid Background="{ThemeResource AcrylicInAppFillColorDefaultBrush}">

Nota

Anda dapat melihat sumber daya ini di file sumber daya tema AcrylicBrush, di repositori GitHub microsoft-ui-xaml.

Kuas akrilik kustom

Anda dapat memilih untuk menambahkan warna ke akrilik aplikasi Anda untuk menampilkan branding atau memberikan keseimbangan visual dengan elemen lain di halaman. Untuk menampilkan warna bukan skala abu-abu, Anda perlu menentukan kuas akrilik Anda sendiri menggunakan properti berikut.

  • TintColor: lapisan warna.
  • TintOpacity: keburaman lapisan warna.
  • TintLuminosityOpacity: mengontrol jumlah saturasi yang diizinkan menembus permukaan akrilik dari latar belakang.
  • FallbackColor: warna solid yang menggantikan akrilik dalam Penghemat Baterai. Untuk latar belakang akrilik, warna pengganti juga menggantikan akrilik saat aplikasi Anda tidak berada di jendela desktop aktif.

Swatch akrilik dengan tema terang

Swatch akrilik tema gelap

Opasitas luminositas dibandingkan dengan opasitas rona

Untuk menambahkan kuas akrilik, tentukan tiga sumber daya untuk tema gelap, terang, dan kontras tinggi. Dalam mode kontras tinggi, kami sarankan Anda menggunakan SolidColorBrush yang memiliki x:Key sama seperti x:Key pada AcrylicBrush gelap/terang.

Nota

Jika Anda tidak menentukan TintLuminosityOpacity nilai, sistem akan secara otomatis menyesuaikan nilainya berdasarkan TintColor dan TintOpacity Anda.

<ResourceDictionary.ThemeDictionaries>
    <ResourceDictionary x:Key="Default">
        <AcrylicBrush x:Key="MyAcrylicBrush"
            TintColor="#FFFF0000"
            TintOpacity="0.8"
            TintLuminosityOpacity="0.5"
            FallbackColor="#FF7F0000"/>
    </ResourceDictionary>

    <ResourceDictionary x:Key="HighContrast">
        <SolidColorBrush x:Key="MyAcrylicBrush"
            Color="{ThemeResource SystemColorWindowColor}"/>
    </ResourceDictionary>

    <ResourceDictionary x:Key="Light">
        <AcrylicBrush x:Key="MyAcrylicBrush"
            TintColor="#FFFF0000"
            TintOpacity="0.8"
            TintLuminosityOpacity="0.5"
            FallbackColor="#FFFF7F7F"/>
    </ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>

Sampel berikut menunjukkan cara mendeklarasikan AcrylicBrush dalam kode.

AcrylicBrush myBrush = new AcrylicBrush();
myBrush.TintColor = Color.FromArgb(255, 202, 24, 37);
myBrush.FallbackColor = Color.FromArgb(255, 202, 24, 37);
myBrush.TintOpacity = 0.6;

grid.Fill = myBrush;
  • Last updated on