Udostępnij przez


Materiał mica

Mica jest nieprzezroczystym, dynamicznym materiałem, który zawiera motyw i tapetę pulpitu, służący do tworzenia tła dla okien o długim czasie działania, np. aplikacji i ustawień. Możesz zastosować Mica do tła aplikacji, aby zachwycać użytkowników i tworzyć hierarchię wizualną, wspomagając produktywność poprzez zwiększenie przejrzystości, które okno jest w centrum uwagi. Mica jest specjalnie zaprojektowany pod kątem wydajności aplikacji, ponieważ próbkuje tapetę pulpitu tylko raz, aby utworzyć wizualizację. Oprogramowanie Mica jest dostępne dla aplikacji platformy UWP korzystających z interfejsu WinUI 2 i aplikacji korzystających z zestawu Windows App SDK 1.1 lub nowszego podczas pracy w systemie Windows 11 w wersji 22000 lub nowszej.

obraz bohatera

Mica w jasnym motywie
Mica w jasnym motywie

Mica w ciemnym motywie
Mica w ciemnym motywie

Mica Alt jest wariantem Mica, z silniejszym odcieniem koloru tła pulpitu użytkownika. Możesz zastosować Mica Alt do zaplecza aplikacji, aby zapewnić głębszą hierarchię wizualną niż Mica, zwłaszcza podczas tworzenia aplikacji z kartami w pasku tytułowym. Rozwiązanie Mica Alt jest dostępne dla aplikacji korzystających z zestawu Windows App SDK 1.1 lub nowszego, w systemie Windows 11 w wersji 22000 lub nowszej.

Te obrazy pokazują różnicę między Mica a Mica Alt na pasku tytułu z kartami. Pierwszy obraz używa Mica, a drugi obraz używa Mica Alt.

Zrzut ekranu przedstawiający Mica na pasku tytułowym z kartami.

Zrzut ekranu pokazujący Mica Alt na pasku tytułowym z kartami.

Kiedy należy używać Mica lub Mica Alt

Mica i Mica Alt to materiały, które pojawiają się na tle aplikacji — za całą inną zawartością. Każdy materiał jest nieprzezroczystym i zawiera motyw użytkownika i tapetę pulpitu, aby utworzyć jego wysoce spersonalizowany wygląd. Gdy użytkownik przenosi okno po ekranie, materiał Mica dynamicznie dostosowuje się, tworząc bogatą wizualizację, korzystając z tapety znajdującej się pod aplikacją. Ponadto materiał pomaga użytkownikom skupić się na bieżącym zadaniu, wracając do neutralnego koloru, gdy aplikacja jest nieaktywna.

Zalecamy zastosowanie mica lub Mica Alt jako podstawowej warstwy aplikacji i nadaj priorytet widoczności w obszarze paska tytułu. Aby uzyskać bardziej szczegółowe wskazówki dotyczące warstw, zobacz Warstwowanie i Elewacja oraz Warstwy aplikacji z Mica w tym artykule.

Użyteczność i możliwość adaptacji

Materiały Mica automatycznie dostosowują swój wygląd do szerokiej gamy urządzeń i kontekstów. Są zaprojektowane z myślą o wydajności, ponieważ zapisują obraz tapety tła tylko raz, aby utworzyć ich wizualizacje.

W trybie dużego kontrastu użytkownicy nadal widzą znajomy kolor tła wybranego zamiast Mica lub Mica Alt. Ponadto materiały Mica będą wyświetlane jako solidny kolor rezerwowy (SolidBackgroundFillColorBase dla Mica, SolidBackgroundFillColorBaseAlt dla Mica Alt), gdy:

  • Użytkownik wyłącza przezroczystość w Ustawieniach > Personalizacja > Kolor.
  • Tryb oszczędzania baterii jest aktywowany.
  • Aplikacja działa na sprzęcie niskiego poziomu.
  • Okno aplikacji na pulpicie się dezaktywuje.
  • Aplikacja systemu Windows jest uruchomiona na konsoli Xbox lub HoloLens.
  • Wersja systemu Windows jest niższa niż 22000.

Warstwowanie aplikacji przy użyciu języka Mica

Standardowa warstwa zawartości wzorca
Standardowa warstwa zawartości

Warstwa zawartości wzorca karty
Warstwa zawartości wzorca karty

Mica jest idealna jako warstwa podstawowa w hierarchii aplikacji ze względu na nieaktywne i aktywne stany oraz subtelną personalizację. Aby postępować zgodnie z dwuwarstwowym systemem warstw i uniesienia, zachęcamy do zastosowania Miki jako podstawowej warstwy aplikacji oraz dodania dodatkowej warstwy zawartości, która znajduje się nad warstwą podstawową. Warstwa zawartości powinna przechwytywać materiał Mica znajdujący się za nią, używając LayerFillColorDefaultBrush, jako tła z kolorem o niskiej nieprzezroczystości. Zalecane wzorce warstw zawartości to:

  • Wzorzec standardowy: ciągłe tło dla dużych obszarów, które wymagają odrębnego hierarchicznego odróżnienia od warstwy podstawowej. Element LayerFillColorDefaultBrush należy zastosować do tła kontenera powierzchni aplikacji WinUI (np. siatki, StackPanels, ramki itp.).
  • Wzorzec karty: karty segmentowane dla aplikacji zaprojektowanych z wieloma sekcjami i nieciągłymi składnikami interfejsu użytkownika. Aby zapoznać się z definicją interfejsu użytkownika karty przy użyciu LayerFillColorDefaultBrush, zobacz Wskazówki dotyczące warstw i podwyższenia.

Aby zapewnić bezproblemowy wygląd okna aplikacji, Mica powinna być widoczna na pasku tytułowym, jeśli zdecydujesz się zastosować ten materiał do swojej aplikacji. Możesz pokazać Mica na pasku tytułu, rozszerzając aplikację na obszar niekliencki i tworząc przezroczysty niestandardowy pasek tytułu. Aby uzyskać więcej informacji, zobacz Pasek tytułu.

W poniższych przykładach przedstawiono przykładowe implementacje strategii warstwowania za pomocą kontrolki NavigationView, gdzie Mica jest widoczna w obszarze paska tytułu.

  • Wzorzec standardowy w widoku nawigacji po lewej stronie.
  • Wzorzec standardowy w górnym widoku nawigacji.
  • Wzorzec karty w lewym panelu nawigacyjnym.

Wzorzec standardowy w widoku nawigacji po lewej stronie

Domyślnie element NavigationView w trybie lewostronnym zawiera warstwę zawartości w swoim obszarze. W tym przykładzie Mica rozszerza się na obszar paska tytułu, tworząc niestandardowy pasek tytułu.

Widok nawigacji w standardowym wzorcu z niestandardowym paskiem tytułu w trybie po lewej

Wzorzec standardowy w górnym widoku nawigacji

Domyślnie element NavigationView w trybie górnym zawiera warstwę zawartości w obszarze zawartości. W tym przykładzie Mica rozszerza się na obszar paska tytułu, tworząc niestandardowy pasek tytułu.

NavigationView w standardowym wzorcu z niestandardowym paskiem tytułowym w trybie 'Góra'

Wzorzec karty w lewym widoku nawigacji

Aby stosować się do wzorca kart przy użyciu NavigationView, musisz usunąć domyślną warstwę treści, przesłaniając zasoby motywu dla tła i obramowania. Następnie możesz utworzyć karty w obszarze zawartości kontrolki. W tym przykładzie tworzy się kilka kart, rozszerza Mica na obszar paska tytułu oraz tworzy niestandardowy pasek tytułu. Aby uzyskać więcej informacji na temat interfejsu użytkownika karty, zapoznaj się z wytycznymi dotyczącymi warstw i podniesienia.

NavigationView w standardowym układzie z niestandardowym paskiem tytułu w lewym trybie

Warstwowanie aplikacji za pomocą Mica Alt

Mica Alt to alternatywa dla Mica jako warstwa podstawowa w hierarchii aplikacji z takimi samymi funkcjami jak nieaktywne i aktywne stany oraz subtelna personalizacja. Zachęcamy do zastosowania narzędzia Mica Alt jako podstawowej warstwy aplikacji, gdy potrzebujesz kontrastu między elementami paska tytułu a obszarami poleceń aplikacji (np. nawigacją, menu).

Typowym scenariuszem używania Mica Alt jest utworzenie aplikacji z paskiem tytułu z kartą. Aby postępować zgodnie z wytycznymi dotyczącymi warstwowania i podniesienia, zachęcamy do zastosowania Mica Alt jako warstwy bazowej dla Twojej aplikacji. Następnie dodaj warstwę poleceń, która znajduje się nad warstwą bazową, a na koniec dodaj dodatkową warstwę zawartości, która znajduje się nad warstwą poleceń. Warstwa kierująca powinna wydobyć materiał za sobą, Mica Alt, używając LayerOnMicaBaseAltFillColorDefaultBrush, jako jego tło, stały kolor o niskiej nieprzezroczystości. Warstwa zawartości powinna pobierać warstwy poniżej, używając LayerFillColorDefaultBrush, innego koloru stałego o niskiej przezroczystości. System warstwowy jest następujący:

  • Mica Alt: warstwa podstawowa.
  • Warstwa poleceń: wymaga odrębnego hierarchicznego odróżnienia od warstwy podstawowej. Element LayerOnMicaBaseAltFillColorDefaultBrush należy zastosować do powierzchni poleceń aplikacji WinUI (np. paska menu, struktury nawigacji itp.)
  • Warstwa zawartości: jednolite tło dla dużych obszarów, które wymagają odrębnego hierarchicznego odróżnienia od warstwy nadrzędnej. Element LayerFillColorDefaultBrush należy zastosować do tła kontenera powierzchni aplikacji WinUI (np. siatki, StackPanels, ramki itp.).

Aby zapewnić bezproblemowy wygląd okna aplikacji, Mica Alt powinna być widoczna na pasku tytułu, jeśli zdecydujesz się zastosować ten materiał w swojej aplikacji. Możesz wyświetlić Mica Alt na pasku tytułu, rozszerzając aplikację do obszaru innego niż klient i tworząc przezroczysty niestandardowy pasek tytułu.

Rekomendacje

  • Ustaw tło na przezroczyste dla wszystkich warstw, na których chcesz zobaczyć Mica, aby mógł być widoczny.
  • Nie stosuj materiału tła więcej niż raz w aplikacji lub programie.
  • Nie stosuj materiału do tła do elementu interfejsu użytkownika. Materiał tła nie pojawi się na samym elemecie. Pojawi się tylko wtedy, gdy wszystkie warstwy między elementem interfejsu użytkownika a oknem są ustawione na przezroczyste.

Przykłady

Aplikacja z galerii WinUI 3 zawiera interaktywne przykłady większości kontrolek, funkcji i funkcji interfejsu WinUI 3. Pobierz aplikację ze Sklepu Microsoft lub pobierz kod źródłowy w witrynie GitHub

Jak używać miki

W aplikacjach platformy UWP korzystających z interfejsu WinUI 2 lub w aplikacjach korzystających z zestawu Sdk aplikacji systemu Windows w wersji 1.1 lub nowszej można użyć narzędzia Mica. Możesz użyć narzędzia Mica Alt w aplikacjach korzystających z zestawu Windows App SDK 1.1 lub nowszego.

Korzystanie z narzędzia Mica z zestawem SDK aplikacji systemu Windows

Aby użyć Mica w aplikacji XAML WinUI 3, zobacz Stosowanie materiałów Mica lub akrylowych w aplikacjach komputerowych dla systemu Windows 11.

Aby użyć Mica w aplikacji Win32, zobacz Stosowanie Mica w aplikacjach klasycznych Win32 na Windows 11.

Używanie interfejsu Mica z interfejsem WinUI 2 dla platformy UWP

Aby użyć Mica w aplikacji UWP z WinUI 2, zobacz Stosowanie Mica z WinUI 2 w UWP.