다음을 통해 공유


Mica 재질

Mica는 테마와 데스크톱 배경 화면을 통합하여 앱 및 설정과 같은 수명이 긴 창의 배경을 그리는 불투명한 동적 재질입니다. Mica를 애플리케이션 배경에 적용하면 사용자를 만족시키고 시각적인 개체 계층 구조를 만들 수 있으며 포커스되는 창에 대한 명확성을 증가시켜 생산성을 향상시킬 수 있습니다. Mica는 앱 성능을 위해 특별히 설계되었으며 데스크톱 배경 화면을 한 번만 샘플링하여 시각화를 생성합니다. Windows 11 버전 22000 이상에서 실행되는 동안 Mica는 WinUI 2를 사용하는 UWP 앱과 Windows 앱 SDK 1.1 이상을 사용하는 앱에 사용할 수 있습니다.

영웅 이미지

밝은 테마의 Mica
밝은 테마의 Mica

어두운 테마의 Mica
어두운 테마의 Mica

Mica Alt 는 사용자의 바탕 화면 백그라운드 색을 더 강하게 틴팅하는 Mica의 변형입니다. 특히 탭 제목 표시줄이 있는 앱을 만들 때 Mica Alt를 앱 배경에 적용하여 Mica보다 더 심층적인 시각적 개체 계층 구조를 제공할 수 있습니다. Alt는 Windows 11 버전 22000 이상에서 실행되는 동안 Mica Windows 앱 SDK 1.1 이상을 사용하는 앱에서 사용할 수 있습니다.

이러한 이미지는 탭이 있는 제목 표시줄에서 Mica와 Mica Alt의 차이를 보여 줍니다. 첫 번째 이미지는 Mica를 사용하고 두 번째 이미지는 Mica Alt를 사용합니다.

탭이 있는 제목 표시줄의 Mica 스크린샷

탭이 있는 제목 표시줄의 Mica Alt 스크린샷

Mica 또는 Mica Alt를 사용하는 경우

Mica 및 Mica Alt는 다른 모든 콘텐츠 뒤에 응용 프로그램의 배경에 표시되는 재질입니다. 각 재질은 사용자의 테마와 데스크톱 배경 화면을 통합하여 고도로 개인 설정된 모양을 만드는 불투명 재질입니다. Mica 재질은 사용자가 화면에서 창을 이동할 때 애플리케이션 아래의 배경 화면을 사용하여 풍부한 시각화를 만들도록 동적 조정됩니다. 또한 Mica는 앱이 비활성 상태일 때 중간색으로 대체하여 사용자가 현재 작업에 집중하도록 도와줍니다.

Mica 또는 Mica Alt를 앱의 기본 레이어로 적용하고 제목 표시줄 영역에서 표시 유형을 우선시하는 것이 좋습니다. 보다 구체적인 계층화 지침은 이 문서의 Mica 섹션을 사용하여 계층화 및 상승앱 계층을 참조하세요.

유용성 및 적응성

Mica 재질은 다양한 디바이스 및 컨텍스트에 맞춰 자동으로 모양을 바꿉니다. 시각화를 만들기 위해 백그라운드 배경 화면을 한 번만 캡처하므로 성능을 위해 설계되었습니다.

고대비 모드에서는 사용자가 Mica 또는 Mica Alt 대신 선택한 익숙한 배경색을 계속 볼 수 있습니다. 또한 Mica 재질은 다음과 같은 경우 단색 대체 색(SolidBackgroundFillColorBase Mica, SolidBackgroundFillColorBaseAlt Mica Alt의 경우)으로 표시됩니다.

  • 사용자가 설정 >> 개인 설정 >> 색에서 투명도를 해제하는 경우
  • 배터리 절약 모드가 활성화된 경우
  • 앱이 저사양 하드웨어에서 실행되는 경우
  • 바탕 화면에서 앱 창이 비활성화되는 경우
  • Windows 앱이 Xbox 또는 HoloLens에서 실행 중입니다.
  • Windows 버전이 22000 미만입니다.

Mica를 사용하여 앱 레이어링

표준 패턴 콘텐츠 레이어
표준 콘텐츠 계층

카드 패턴 콘텐츠 레이어
카드 패턴 콘텐츠 레이어

Mica는 비활성 및 활성 상태와 미세한 개인 설정으로 인해 앱 계층 구조의 기반 레이어로 적합합니다. 2 레이어의 레이어링 및 상승 시스템을 따르려면 Mica를 앱의 기본 계층으로 적용하고 기본 레이어의 맨 위에 있는 추가 콘텐츠 레이어를 추가하는 것이 좋습니다. 콘텐츠 계층은 불투명도가 낮은 단색을 배경으로 사용하여 LayerFillColorDefaultBrush그 뒤에 있는 소재인 Mica를 선택해야 합니다. 권장되는 콘텐츠 레이어 패턴은 다음과 같습니다.

  • 표준 패턴: 기본 계층과 고유한 계층적 구분이 필요한 넓은 영역에 대한 연속된 배경입니다. LayerFillColorDefaultBrush은(는) WinUI 앱 표면의 컨테이너 백그라운드(예: Grids, StackPanels, Frames 등)에 적용되어야 합니다.
  • 카드 패턴: 여러 섹션 및 불연속 UI 구성 요소로 디자인된 앱의 분할된 카드입니다. 카드 UI를 사용하는 LayerFillColorDefaultBrush정의는 계층화 및 상승 지침을 참조하세요.

앱의 창이 끊김 없이 보이게 하려면 앱에 재질을 적용하도록 선택하는 경우 제목 표시줄에 Mica를 표시해야 합니다. 앱을 비클라이언트 영역으로 확장하고 투명한 사용자 지정 제목 표시줄을 만들어 제목 표시줄에 Mica를 표시할 수 있습니다. 자세한 내용은 제목 표시줄을 참조하세요.

다음 예제에서는 제목 표시줄 영역에 Mica가 표시되는 NavigationView를 사용하여 레이어링 전략의 일반적인 구현을 보여 줍니다.

  • 왼쪽 NavigationView의 표준 패턴입니다.
  • 위쪽 NavigationView의 표준 패턴입니다.
  • 왼쪽 NavigationView의 카드 패턴입니다.

왼쪽 NavigationView의 표준 패턴

기본적으로 왼쪽 모드의 NavigationView는 콘텐츠 영역에 콘텐츠 레이어가 포함됩니다. 이 예제에서는 Mica를 제목 표시줄 영역으로 확장하고 사용자 지정 제목 표시줄을 만듭니다.

왼쪽 모드에서 사용자 지정 제목 표시줄이 있는 표준 패턴의 탐색 보기

위쪽 NavigationView의 표준 패턴

기본적으로 위쪽 모드의 NavigationView는 콘텐츠 영역에 콘텐츠 레이어가 포함됩니다. 이 예제에서는 Mica를 제목 표시줄 영역으로 확장하고 사용자 지정 제목 표시줄을 만듭니다.

맨 위 모드에서 사용자 지정 제목 표시줄이 있는 표준 패턴의 NavigationView

왼쪽 NavigationView의 카드 패턴

NavigationView를 사용하여 이 카드 패턴을 따르려면 배경 및 테두리 테마 리소스를 재정의하여 기본 콘텐츠 레이어를 제거해야 합니다. 그런 다음, 컨트롤의 콘텐츠 영역에서 카드를 만들 수 있습니다. 이 예제에서는 여러 개의 카드를 만들고, Mica를 제목 표시줄 영역으로 확장하고, 사용자 지정 제목 표시줄을 만듭니다. 카드 UI에 대한 자세한 내용은 레이어링 및 상승 지침을 참조하세요.

왼쪽 모드에서 사용자 지정 제목 표시줄이 있는 표준 패턴의 NavigationView

Mica Alt를 사용하여 앱 레이어링

Mica Alt는 Mica의 대안으로, 비활성 및 활성 상태와 미묘한 개인 설정과 같은 동일한 기능을 갖춘 앱 계층 구조의 기본 레이어입니다. 제목 표시줄 요소와 앱의 명령 영역(예: 탐색, 메뉴) 간에 대비가 필요한 경우 Mica Alt를 앱의 기본 계층으로 적용하는 것이 좋습니다.

Mica Alt를 사용하는 일반적인 시나리오는 탭 제목 표시줄이 있는 애플리케이션을 만드는 경우가 됩니다. 레이어링 및 상승지침을 따르려면 Mica Alt를 앱의 기본 레이어로 적용하고, 기본 레이어 위에 있는 명령 레이어를 추가하고, 마지막으로 명령 레이어 위에 있는 추가 콘텐츠 레이어를 추가하는 것이 좋습니다. 명령 레이어는 불투명도가 낮은 단색을 배경으로 사용하여 LayerOnMicaBaseAltFillColorDefaultBrush 뒤에 있는 재료인 Mica Alt를 선택해야 합니다. 콘텐츠 레이어는 불투명도가 낮은 다른 단색을 LayerFillColorDefaultBrush 사용하여 그 아래에 있는 레이어를 선택해야 합니다. 레이어 시스템은 다음과 같습니다.

  • Mica Alt: 기본 계층입니다.
  • 명령 계층: 기본 계층과 고유한 계층적 구분이 필요합니다. WinUI LayerOnMicaBaseAltFillColorDefaultBrush 앱 화면의 명령 영역(예: MenuBar, 탐색 구조 등)에 적용해야 합니다.
  • 콘텐츠 계층: 명령 계층과 고유한 계층적 구분이 필요한 넓은 영역에 대한 연속된 배경입니다. LayerFillColorDefaultBrush은(는) WinUI 앱 표면의 컨테이너 백그라운드(예: Grids, StackPanels, Frames 등)에 적용되어야 합니다.

앱의 창이 끊김 없이 보이게 하려면 앱에 재질을 적용하도록 선택하는 경우 제목 표시줄에 Mica Alt를 표시해야 합니다. 앱을 비클라이언트 영역으로 확장하고 투명한 사용자 지정 제목 표시줄을 만들어 제목 표시줄에 Mica Alt를 표시할 수 있습니다.

권장 사항

  • Mica가 표시되도록 Mica를 보려는 모든 레이어에 대해 배경을 투명하게 설정하세요.
  • Don't 응용 프로그램에서 배경 자료를 두 번 이상 적용하지 마십시오.
  • Don't 배경 재질을 UI 요소에 적용하지 마세요. 배경 재질은 요소 자체에 표시되지 않습니다. UI 요소와 창 간의 모든 계층이 투명으로 설정된 경우에만 표시됩니다.

예제

WinUI 3 갤러리 앱에는 대부분의 WinUI 3 컨트롤, 특징, 기능의 대화형 예제가 포함되어 있습니다. 해당 Microsoft Store에서 앱을 다운로드하거나 GitHub에서 소스 코드를 가져오세요.

Mica를 사용하는 방법

WinUI 2를 사용하는 UWP 앱 또는 Windows 앱 SDK 1.1 이상을 사용하는 앱에서 Mica를 사용할 수 있습니다. Windows 앱 SDK 1.1 이상을 사용하는 앱에서 Mica Alt를 사용할 수 있습니다.

Windows 앱 SDK에서 Mica 사용

WinUI 3 XAML 앱에서 Mica를 사용하려면 Windows 11용 데스크톱 앱에서 Mica 또는 아크릴 자료 적용을 참조하세요.

Win32 앱에서 Mica를 사용하려면 Windows 11용 Win32 데스크톱 앱에서 Mica 적용을 참조하세요.

UWP용 WinUI 2와 함께 Mica 사용

WinUI 2가 있는 UWP 앱에서 Mica를 사용하려면 UWP용 WinUI 2로 Mica 적용을 참조하세요.