Notatka
Dostęp do tej strony wymaga autoryzacji. Może spróbować zalogować się lub zmienić katalogi.
Dostęp do tej strony wymaga autoryzacji. Możesz spróbować zmienić katalogi.
Po zaprojektowaniu ikony aplikacji musisz utworzyć same pliki ikon. Ponieważ Windows obsługuje wiele motywów, rozdzielczości wyświetlania i czynników skalowania, należy podać wiele wersji ikony, aby upewnić się, że wygląda świetnie na każdym urządzeniu, w dowolnym rozmiarze.
Rozmiary ikon (WPF, UWP, WinUI)
Windows będzie wyświetlać ikonę aplikacji w różnych rozmiarach w zależności od tego, gdzie jest wyświetlana ikona, a ustawienia skalowania wyświetlania użytkownika. W poniższej tabeli wymieniono wszystkie możliwe rozmiary, których Windows można użyć do wyświetlenia ikony.
Rozmiary ikon (Win32)
Pliki ICO systemu Windows istnieją już od dłuższego czasu. Istnieją standardowe rozmiary używane jako podzbiór pełnego zestawu wymienionego powyżej.
Skalowanie ikon
Gdy Windows wyświetli ikonę aplikacji, będzie ona najpierw szukać dokładnego dopasowania rozmiaru. Jeśli nie ma dokładnego dopasowania, będzie szukać następnego większego rozmiaru i zmniejszać go. Uwzględnienie większej liczby rozmiarów ikon w aplikacji oznacza, że Windows częściej będzie miał idealne dopasowanie do pikseli i zmniejszy poziom skalowania zastosowanego do ikon skalowanych.
| współczynnik skalowania Windows 11 | 100% | 125% | 150% | 200% | 250% | 300% | 400% |
|---|---|---|---|---|---|---|---|
| Menu kontekstowe, pasek tytułu, pasek systemu | 16 pikseli | 20 pikseli | 24px | 32px | 40 pikseli | 48 pikseli | 64px |
| Pasek zadań, wyniki wyszukiwania, Uruchamianie listy wszystkich aplikacji | 24px | 30 pikseli | 36 pikseli | 48 pikseli | 60 pikseli | 72px | 96 pikseli |
| Rozpoczynanie przypinania | 32px | 40 pikseli | 48 pikseli | 64px | 80 pikseli | 96 pikseli | 256 pikseli |
Uwaga / Notatka
Aplikacje powinny mieć co najmniej: 16x16, 24x24, 32x32, 48x48 i 256x256. Obejmuje to najbardziej typowe rozmiary ikon, a zapewniając ikonę o rozdzielczości 256px, gwarantuje, że Windows będzie zawsze skalować ikonę tylko w dół, nigdy w górę.
Jak rozmiary ikon odnoszą się do manifestu MSIX
Jeśli przeglądałeś manifest MSIX (lub AppX) swojej aplikacji, być może zauważyłeś wpisy takie jak Square44x44Logo i Square150x150Logo. Są to rozmiary podstawowe, a nie tylko rozmiary wymagane przez aplikację. Windows używa współczynników skalowania wyświetlania w celu określenia rzeczywistych wymiarów pikseli, które żąda w czasie wykonywania. Manifest odwołuje się do nazwy pliku obrazu bazowego (na przykład Square44x44Logo.png), a wstępnie przeskalowane warianty są dostarczane przy użyciu kwalifikatorów (na przykład Square44x44Logo.scale-200.png). Windows następnie wybiera najlepsze dopasowanie ustawień wyświetlania użytkownika.
Poniższa tabela pokazuje, jak każda pozycja manifestu odpowiada rzeczywistym rozmiarom w pikselach dla każdego współczynnika skali:
| Wpis manifestu | Rozmiar podstawowy | 100% | 125% | 150% | 200% | 250% | 300% | 400% |
|---|---|---|---|---|---|---|---|---|
| Square44x44Logo | 44 pikseli | 44 pikseli | 55 pikseli | 66 pikseli | 88 pikseli | 110 pikseli | 132 pikseli | 176 pikseli |
| Kwadrat150x150Logo | 150 pikseli | 150 pikseli | 188 pikseli | 225 pikseli | 300 pikseli | 375 pikseli | 450 pikseli | 600 pikseli |
| Wide310x150Logo | 310×150 pikseli | 310×150 pikseli | 388×188 pikseli | 465×225 pikseli | 620×300 pikseli | 775×375 pikseli | 930×450 pikseli | 1240×600 pikseli |
| Square310x310Logo | 310 pikseli | 310 pikseli | 388 pikseli | 465 pikseli | 620 pikseli | 775 pikseli | 930 pikseli | 1240 pikseli |
| Square71x71Logo | 71 pikseli | 71 pikseli | 89 pikseli | 107 pikseli | 142 pikseli | 178 pikseli | 213 pikseli | 284 pikseli |
| Logo sklepu | 50 pikseli | 50 pikseli | 63 pikseli | 75 pikseli | 100 pikseli | 125 pikseli | 150 pikseli | 200 pikseli |
Ikona listy aplikacji obsługuje również warianty rozmiaru docelowego (wymienione w poniższej sekcji Ikona aplikacji), które Windows używane dla ikon paska zadań, menu kontekstowych i innych elementów interfejsu użytkownika, w których ikona jest wyświetlana bez dopełnienia kafelka. Zasoby o rozmiarze docelowym są określane w dokładnych wymiarach pikseli (16, 24, 32, 48, 256 i innych) zamiast czynników skalowania.
Wskazówka
Nie musisz tworzyć każdego możliwego rozmiaru. Co najmniej przygotuj zasoby w skali 100%, 200% i 400% dla wpisów Square44x44Logo i Square150x150Logo, a także warianty o rozmiarze docelowym wymienione w sekcji Ikona aplikacji. Windows wybiera najbliższy dostępny zasób dla czynników skali pośredniej (125%, 150%, 250%i 300%).
Aby uzyskać pełny schemat manifestu, zobacz VisualElements.
Przezroczyste tła
Ikony wyglądają najlepiej z przezroczystym tłem. Jeśli branding aplikacji wymaga, aby ikona była umieszczona na tle, to również jest w porządku. Należy jednak ponownie zaimplementować niektóre funkcje motywowe, które można bezpłatnie uzyskać za pomocą przezroczystych ikon. Na przykład możesz podać wersję ikony aplikacji na dwóch różnych tłach, która lepiej nadaje się do motywu jasnego i drugiego do motywu ciemnego.
Pełna lista ikon i odmian
Windows korzysta z różnych zasobów ikon w różnych kontekstach interfejsu użytkownika. Użycie zmieniło się nieco między Windows 10 a & Windows 11.
Poniższe listy definiują określone nazwy plików, których Windows oczekuje, że będą zawierać każdą odpowiednią ikonę.
Ikona aplikacji
W Windows 10 i 11 ikona AppList jest podstawową ikoną aplikacji. Będzie on używany w kilku miejscach, w tym pasek zadań, pinezki Start, lista wszystkich aplikacji i lista wyników wyszukiwania. Windows 11 wybiera odpowiednią ikonę dla listy wszystkich aplikacji na podstawie bieżącego współczynnika skalowania, ale Windows 10 używa określonych, jawnie zdefiniowanych ikon, jeśli je podasz.
Wymagane są oddzielne pliki dla wszystkich trzech odmian motywu (domyślny, motyw jasny, motyw ciemny), nawet jeśli ikona jest taka sama. Jeśli te pliki nie zostaną podane, ikona pojawi się na tablicy ikony systemu, aby zapewnić minimalny współczynnik kontrastu.
Rozmiar docelowy listy aplikacji (wymagany)
- AppList.targetsize-16.png
- AppList.targetsize-20.png
- AppList.targetsize-24.png
- AppList.targetsize-30.png
- AppList.targetsize-32.png
- AppList.targetsize-36.png
- AppList.targetsize-40.png
- AppList.targetsize-48.png
- AppList.targetsize-60.png
- AppList.targetsize-64.png
- AppList.targetsize-72.png
- AppList.targetsize-80.png
- AppList.targetsize-96.png
- AppList.targetsize-256.png
Motyw ciemny (wymagany)
- AppList.targetsize-16_altform-unplated.png
- AppList.targetsize-20_altform-unplated.png
- AppList.targetsize-24_altform-unplated.png
- AppList.targetsize-30_altform-unplated.png
- AppList.targetsize-32_altform-unplated.png
- AppList.targetsize-36_altform-unplated.png
- AppList.targetsize-40_altform-unplated.png
- AppList.targetsize-48_altform-unplated.png
- AppList.targetsize-60_altform-unplated.png
- AppList.targetsize-64_altform-unplated.png
- AppList.targetsize-72_altform-unplated.png
- AppList.targetsize-80_altform-unplated.png
- AppList.targetsize-96_altform-unplated.png
- AppList.targetsize-256_altform-unplated.png
Motyw jasny (wymagany)
- AppList.targetsize-16_altform-lightunplated.png
- AppList.targetsize-20_altform-lightunplated.png
- AppList.targetsize-24_altform-lightunplated.png
- AppList.targetsize-30_altform-lightunplated.png
- AppList.targetsize-32_altform-lightunplated.png
- AppList.targetsize-36_altform-lightunplated.png
- AppList.targetsize-40_altform-lightunplated.png
- AppList.targetsize-48_altform-lightunplated.png
- AppList.targetsize-60_altform-lightunplated.png
- AppList.targetsize-64_altform-lightunplated.png
- AppList.targetsize-72_altform-lightunplated.png
- AppList.targetsize-80_altform-lightunplated.png
- AppList.targetsize-96_altform-lightunplated.png
- AppList.targetsize-256_altform-lightunplated.png
App List Scale (Windows 10) (opcjonalnie)
- AppList.scale-100.png
- AppList.scale-125.png
- AppList.scale-150.png
- AppList.scale-200.png
- AppList.scale-400.png
motyw Light (Windows 10) (opcjonalnie)
- AppList.scale-100_altform-colorful_theme-light.png
- AppList.scale-125_altform-colorful_theme-light.png
- AppList.scale-150_altform-colorful_theme-light.png
- AppList.scale-200_altform-colorful_theme-light.png
- AppList.scale-400_altform-colorful_theme-light.png
Uwaga / Notatka
Jeśli nie dołączysz elementów targetsize-*-altform-unplated związanych z ikoną, ikona zostanie przeskalowana do mniejszego rozmiaru i otrzyma niepożądane tło za ikoną na pasku zadań i w menu Start.
Płytki
Windows 10 obsługuje cztery rozmiary kafelków: mały, średni, szeroki i duży.
Motyw domyślny/ciemny (częściowo wymagany)
- SmallTile.scale-100.png
- SmallTile.scale-125.png
- SmallTile.scale-150.png
- SmallTile.scale-200.png
- SmallTile.scale-400.png
- MedTile.scale-100.png
- MedTile.scale-125.png
- MedTile.scale-150.png
- MedTile.scale-200.png
- MedTile.scale-400.png
- WideTile.scale-100.png
- WideTile.scale-125.png
- WideTile.scale-150.png
- WideTile.scale-200.png
- WideTile.scale-400.png
- LargeTile.scale-100.png
- LargeTile.scale-125.png
- LargeTile.scale-150.png
- LargeTile.scale-200.png
- LargeTile.scale-400.png
Motyw jasny (opcjonalnie)
- SmallTile.scale-100_altform-colorful_theme-light.png
- SmallTile.scale-125_altform-colorful_theme-light.png
- SmallTile.scale-150_altform-colorful_theme-light.png
- SmallTile.scale-200_altform-colorful_theme-light.png
- SmallTile.scale-400_altform-colorful_theme-light.png
- MedTile.scale-100_altform-colorful_theme-light.png
- MedTile.scale-125_altform-colorful_theme-light.png
- MedTile.scale-150_altform-colorful_theme-light.png
- MedTile.scale-200_altform-colorful_theme-light.png
- MedTile.scale-400_altform-colorful_theme-light.png
- WideTile.scale-100_altform-colorful_theme-light.png
- WideTile.scale-125_altform-colorful_theme-light.png
- WideTile.scale-150_altform-colorful_theme-light.png
- WideTile.scale-200_altform-colorful_theme-light.png
- WideTile.scale-400_altform-colorful_theme-light.png
- LargeTile.scale-100_altform-colorful_theme-light.png
- LargeTile.scale-125_altform-colorful_theme-light.png
- LargeTile.scale-150_altform-colorful_theme-light.png
- LargeTile.scale-200_altform-colorful_theme-light.png
- LargeTile.scale-400_altform-colorful_theme-light.png
Uwaga / Notatka
Windows 11 nie używa zasobów kafelków, ale obecnie średnie zasoby kafelków w 100% są wymagane do opublikowania w Microsoft Store. Jeśli aplikacja jest zgodna z Windows 10 i Windows 11, zaleca się uwzględnienie jak największej liczby elementów kafelków.
Ekran powitalny
Ekrany powitalne mogą być dostosowane do jasnego i ciemnego motywu podobnie jak zasoby ikon aplikacji.
Wartość domyślna
- SplashScreen.scale-100.png
- SplashScreen.scale-125.png
- SplashScreen.scale-150.png
- SplashScreen.scale-200.png
- SplashScreen.scale-400.png
Motyw ciemny (opcjonalnie)
- SplashScreen.scale-100_altform-colorful_theme-dark.png
- SplashScreen.scale-125_altform-colorful_theme-dark.png
- SplashScreen.scale-150_altform-colorful_theme-dark.png
- SplashScreen.scale-200_altform-colorful_theme-dark.png
- SplashScreen.scale-400_altform-colorful_theme-dark.png
Motyw jasny (opcjonalnie)
- SplashScreen.scale-100_altform-colorful_theme-light.png
- SplashScreen.scale-125_altform-colorful_theme-light.png
- SplashScreen.scale-150_altform-colorful_theme-light.png
- SplashScreen.scale-200_altform-colorful_theme-light.png
- SplashScreen.scale-400_altform-colorful_theme-light.png
Logo emblematu
Ikony odznaki są używane na ekranie blokady Windows 10 i w większości aplikacji nie są wymagane.
Windows 10 (opcjonalnie)
- BadgeLogo.scale-100.png
- BadgeLogo.scale-125.png
- BadgeLogo.scale-150.png
- BadgeLogo.scale-200.png
- BadgeLogo.scale-400.png
Logo pakietu (logo sklepu Microsoft Store)
Te zasoby są wymagane do opublikowania w sklepie Microsoft Store.
Motyw domyślny/ciemny (wymagany)
- StoreLogo.scale-100.png
- StoreLogo.scale-125.png
- StoreLogo.scale-150.png
- StoreLogo.scale-200.png
- StoreLogo.scale-400.png
Motyw jasny (opcjonalnie)
- StoreLogo.scale-100_altform-colorful_theme-light.png
- StoreLogo.scale-125_altform-colorful_theme-light.png
- StoreLogo.scale-150_altform-colorful_theme-light.png
- StoreLogo.scale-200_altform-colorful_theme-light.png
- StoreLogo.scale-400_altform-colorful_theme-light.png
Współpracuj z nami w serwisie GitHub
Źródło tej zawartości można znaleźć w witrynie GitHub, gdzie można również tworzyć i przeglądać problemy i żądania ściągnięcia. Więcej informacji znajdziesz w naszym przewodniku dla współtwórców.
