W aplikacjach mobilnych ta sama ikona lub obraz może być wyświetlany na ekranach o różnej gęstości pikseli. Aby grafika wyglądała ostro, przygotowuje się kilka wersji tego samego pliku w różnych rozmiarach.
iOS: sufiksy @2x i @3x
W systemie iOS warianty grafik oznacza się zwykle sufiksami w nazwach plików:
icon.png— wersja podstawowa, 1x,[email protected]— grafika dwukrotnie większa,[email protected]— grafika trzykrotnie większa.
System sam wybiera odpowiedni plik zależnie od ekranu urządzenia. Dzięki temu programista odwołuje się logicznie do jednej grafiki, a iOS dobiera właściwy wariant.
Android: katalogi drawable z kwalifikatorami gęstości
W Androidzie grafiki umieszcza się w katalogach zasobów drawable z odpowiednimi kwalifikatorami, np.:
drawable-mdpi— standardowa gęstość,drawable-hdpi— wysoka gęstość,drawable-xhdpi— bardzo wysoka gęstość,drawable-xxhdpi— jeszcze wyższa gęstość,drawable-xxxhdpi— najwyższa typowa gęstość.
Przykład struktury projektu Android:
res/
drawable-mdpi/icon.png
drawable-hdpi/icon.png
drawable-xhdpi/icon.png
drawable-xxhdpi/icon.png
Nazwa pliku pozostaje taka sama, ale katalog określa wariant grafiki.
Najważniejsze do egzaminu
Dla iOS należy kojarzyć oznaczenia @2x i @3x, a dla Androida katalogi typu drawable-hdpi, drawable-xhdpi, drawable-xxhdpi. Nie stosuje się sufiksów typu #2x ani katalogów 32ppi, 64ppi.