Rozmiary ikon iOS: od PNG do AppIcon.appiconset

Folder z plikami PNG to tylko część ikony aplikacji iOS. Xcode musi również wiedzieć, do jakiej roli i skali pasuje dany obraz. Eksport iOS z Generatora Ikon od Fox'a dostarcza katalog assetów z tym przypisaniem w Contents.json.

Wybierz sposób pracy w Xcode

Apple opisuje zarówno katalogi assetów, jak i Icon Composer. Icon Composer tworzy warstwowe ikony z wyglądem renderowanym przez system. Eksport z Generatora Ikon od Fox'a to klasyczny AppIcon.appiconset oparty na PNG; nie tworzy warstwowego pliku .icon ani materiałów Liquid Glass. Jeśli projekt wymaga tego rozwiązania, użyj narzędzia Apple.

Zacznij od kwadratowego źródła. Dla klasycznego eksportu wybierz nieprzezroczyste tło i pozostaw nakładanie zewnętrznej maski systemowi. Przykład do pobrania to autorski SVG 1024 × 1024 z pełnym tłem, gotowy do zaimportowania jako obraz testowy. Nie jest szablonem Apple.

Co zawiera ZIP dla iOS

Tabela opisuje sloty generowane przez Generator Ikon od Fox'a. Wymiary w punktach i skale są zapisane osobno w katalogu; rozmiar w pikselach jest iloczynem punktów i skali.

Na przykład 60 pt przy 3× daje 180 px, a 83.5 pt przy 2× — 167 px. Powtarzające się wymiary mogą korzystać z jednego PNG, zachowując osobne wpisy w Contents.json. To eksport generatora nastawiony na zgodność, a nie stwierdzenie, że każdy współczesny projekt Xcode wymaga wszystkich slotów.

Zaimportuj katalog

1. W Generatorze Ikon od Fox'a dodaj iOS, wybierz podgląd i sprawdź tło oraz marginesy.
2. Pobierz i rozpakuj ZIP. Eksport zbiorczy umieszcza te pliki w ios/.
3. Otwórz Assets.xcassets w Xcode i dodaj cały folder AppIcon.appiconset. Sprawdź istniejący zestaw przed jego zastąpieniem.
4. Wybierz ten zestaw jako ikonę targetu i zbuduj aplikację.

Po zmianie nazwy pliku folder katalogu używa wybranej nazwy. Kopiuj cały folder wraz z Contents.json, zamiast przeciągać pojedyncze PNG do osobnych zestawów obrazów.

Rozwiąż typowe problemy

Brak ikony może oznaczać, że target nadal wskazuje inny zestaw assetów. Zduplikowany zestaw również utrudnia ustalenie, która wersja jest używana. Sprawdź ustawienia targetu przed zmianą wymiarów obrazów.

Jeśli podgląd jest rozmyty, zacznij od wektora albo odpowiednio dużego obrazu rastrowego. Eksport małej bitmapy do 1024 px nie odtworzy utraconych detali. Obejrzyj również mniejsze warianty: cienkie obrysy mogą zniknąć, nawet jeśli największy obraz wygląda ostro.

Apple Design Resources udostępnia oficjalne szablony ikon do obsługiwanych narzędzi projektowych. Pobieraj je od Apple na warunkach dołączonych do plików. Dla Androida użyj osobnego procesu ikon adaptacyjnych.

Koło bezpiecznego obszaru w podglądzie

W panelu Kompozycja włącz Koło bezpiecznego obszaru. Suwakiem Średnica koła ustaw wartość od 20% do 100% krótszego boku ikony; domyślnie jest to 80%. Dopasuj skalę i położenie grafiki, obserwując jej odstęp od koła.

Nakładka służy wyłącznie do podglądu — nie trafia do PNG ani ZIP-a. Jej ustawienia są zapamiętywane w tej przeglądarce, ale nie są częścią udostępnianego projektu. Użyj koła do oceny odstępów wokół logo. Nie jest ono maską iOS ani szablonem Apple i nie zaokrągla plików w katalogu AppIcon.appiconset.