Condividi tramite

Acrilico in-app

Puoi applicare l'acrilico in-app alle superfici dell'app usando un AcrylicBrush XAML o risorse del tema predefinito AcrylicBrush.

Aprire l'app Raccolta WinUI e vedere Acrilico in azione

WinUI include una raccolta di risorse tema pennello che rispettano il tema dell'app e ripiegano su colori a tinta unita quando necessario. Per verniciare una superficie specifica, applicare una delle risorse del tema agli sfondi degli elementi esattamente come si applica qualsiasi altra risorsa di pennello.

<Grid Background="{ThemeResource AcrylicInAppFillColorDefaultBrush}">

Annotazioni

È possibile visualizzare queste risorse nel file delle risorse del tema AcrylicBrush nel repository GitHub microsoft-ui-xaml.

Personalizzazione del pennello acrilico

Puoi scegliere di aggiungere una tinta di colore all'acrilico dell'app per mostrare la personalizzazione o fornire un equilibrio visivo con altri elementi nella pagina. Per mostrare il colore anziché la scala di grigi, è necessario definire pennelli acrilici personalizzati usando le proprietà seguenti.

  • TintColor: il livello di sovrapposizione colore/tinta.
  • TintOpacity: opacità dello strato di tinta.
  • TintLuminosityOpacity: controlla la quantità di saturazione consentita dalla superficie acrilica rispetto allo sfondo.
  • FallbackColor: colore a tinta unita che sostituisce l'acrilico in modalità di risparmio batteria. Per l'acrilico di sfondo, il colore di fallback sostituisce anche l'acrilico quando l'app non si trova nella finestra desktop attiva.

Campioni di acrilico a tema chiaro

Campioni di acrilico a tema scuro

Opacità della luminosità rispetto all'opacità della tinta

Per aggiungere un pennello acrilico, definire le tre risorse per i temi scuro, chiaro e a contrasto elevato. In contrasto elevato, è consigliabile usare un SolidColorBrush con lo stesso x:Key AcrylicBrush scuro/chiaro.

Annotazioni

Se non specifichi un TintLuminosityOpacity valore, il sistema regola automaticamente il suo valore in base a TintColor e TintOpacity.

<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>

L'esempio seguente illustra come dichiarare un oggetto AcrylicBrush nel codice.

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