---
lang: ja-jp
breaks: true
---
# UWP 半透明画面の作成　Acrylic material／アクリル素材　2021-04-13

> アクリル素材
> https://docs.microsoft.com/ja-jp/windows/uwp/design/style/acrylic

> XAML コントロール ギャラリー
> Styles→Acrylic

> UWP アプリに Fluent Design System を実装する方法
> アクリル素材（Acrylic material）
>
> リソースキーに AcrylicWindow が含まれているリソースがウィンドウの背景を表示するアクリル素材（Background acrylic）で、AcrylicElement が含まれているリソースがアプリ内のアクリル素材（In-app acrylic）です。
また、Accent が含まれているリソースは、Windows の個人用設定でユーザ指定されたアクセントカラーが反映されるアクリル素材です。
> https://qiita.com/4423/items/753b738a5a663be99ef9

## Pageに指定する場合

<Page
    x:Class="App4.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App4"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource SystemControlAcrylicWindowBrush}"
    >

</Page>

## Gridに指定する場合

<Page
    x:Class="App4.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App4"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    >
    <Grid
        Background="{ThemeResource SystemControlAcrylicWindowBrush}">
    </Grid>
</Page>

## Rectangleに指定する場合

<Page
    x:Class="App4.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App4"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    >
    <Grid>
        <Rectangle
            Fill="{ThemeResource SystemControlAcrylicWindowBrush}" />
    </Grid>
</Page>

## SystemControlAcrylicWindowBrush

## SystemControlChromeLowAcrylicWindowBrush

## SystemControlBaseHighAcrylicWindowBrush

## SystemControlBaseLowAcrylicWindowBrush

## SystemControlAltHighAcrylicWindowBrush

## SystemControlAltLowAcrylicWindowBrush

## SystemControlAcrylicWindowMediumHighBrush

## SystemControlBaseHighAcrylicWindowMediumHighBrush

## SystemControlChromeHighAcrylicWindowMediumBrush

## SystemControlChromeMediumAcrylicWindowMediumBrush

## SystemControlChromeMediumLowAcrylicWindowMediumBrush

## SystemControlBaseHighAcrylicWindowMediumBrush

## SystemControlBaseMediumLowAcrylicWindowMediumBrush

## SystemControlAltMediumLowAcrylicWindowMediumBrush

## SystemControlAccentAcrylicWindowAccentMediumHighBrush

## SystemControlAccentDark1AcrylicWindowAccentDark1Brush

## SystemControlAccentDark2AcrylicWindowAccentDark2MediumHighBrush

###### tags: `UWP` `Acrylic material` `アクリル素材`