Compartilhar via

Acrílico no aplicativo

Você pode aplicar o acrílico nas superfícies do aplicativo usando um AcrylicBrush XAML ou recursos de tema predefinidos AcrylicBrush.

Abra o aplicativo da Galeria do WinUI e veja o Acrílico em ação

O WinUI inclui uma coleção de recursos de tema de pincel que respeitam o tema do aplicativo e retornam às cores sólidas conforme necessário. Para pintar uma superfície específica, aplique um dos recursos de tema como plano de fundo do elemento, assim como faria com qualquer outro recurso de pincel.

<Grid Background="{ThemeResource AcrylicInAppFillColorDefaultBrush}">

Observação

Você pode exibir esses recursos no arquivo de recursos de tema AcrylicBrush, no repositório microsoft-ui-xaml GitHub.

Pincel acrílico personalizado

Você pode optar por adicionar uma tonalidade de cor ao acrílico do seu aplicativo para mostrar a identidade visual ou fornecer equilíbrio visual com outros elementos na página. Para mostrar cor em vez de escala de cinza, você precisa definir seus próprios pincéis acrílicos usando as propriedades a seguir.

  • TintColor: camada sobreposta de cor/tonalidade.
  • TintOpacity: a opacidade da camada de tonalidade.
  • TintLuminosityOpacity: controla a quantidade de saturação que é permitida passar através da superfície acrílica a partir do fundo.
  • FallbackColor: a cor sólida que substitui o acrílico no modo de Economia de bateria. Para acrílico de fundo, a cor de reserva também substitui o acrílico quando seu aplicativo não está na janela ativa da área de trabalho.

Amostras de acrílico de tema claro

Amostras de acrílico de tema escuro

Opacidade da luminosidade em comparação com a opacidade da tonalidade

Para adicionar um pincel de acrílico, defina os três recursos para temas escuros, claros e de alto contraste. Em alto contraste, recomendamos que você use um SolidColorBrush com o mesmo x:Key que o AcrylicBrush escuro/claro.

Observação

Se você não especificar um valor para TintLuminosityOpacity, o sistema ajustará automaticamente esse valor com base no 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>

O exemplo a seguir mostra como declarar um AcrylicBrush no código.

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