Jak przesyłać obrazy do Xcode

Aby używać obrazów w Xcode, musisz je przesłać do Assets.xcassetsznajdującego się w Supporting Filesfolderze. Dostępne są dwie opcje: mapy bitowe (aka. pngPliki) lub wektory (aka .pdfpliki). Pierwszym krokiem jest podjęcie decyzji, jakiego typu pliku chcesz użyć.

Różnica między bitmapami a zasobami wektorowymi

Większość samouczków online korzysta z zasobów bitmapowych, które są .pngplikami. Wymaga to przeciągnięcia 3 kopii obrazu do Xcode.

Istnieje jednak szkoła myślenia, która uważa, że ​​aktywa wektorowe są lepsze. Ten artykuł zawiera świetne wyjaśnienie, dlaczego tak jest. Zasoby wektorowe to .svgpliki (lub .pdfdla Xcode). Jeśli zdecydujesz się użyć zasobów wektorowych, wystarczy przesłać tylko jedną wersję obrazu do Xcode.

Oto, co usłyszałem od tych znacznie mądrzejszych niż telefony z systemem Android, używając algorytmów z zasobu wektorowego do generowania obrazu w dowolnym wymaganym rozmiarze. Ma to sens, biorąc pod uwagę szeroką gamę urządzeń i rozmiary ekranu w systemie Android.

Jednak zasoby wektorowe w iPhone'ach w rzeczywistości nie skalują się za pomocą algorytmów (najwyraźniej). Dlatego nie można uzyskać obrazów o wyższej jakości, używając wektorów zamiast map bitowych. Zamiast tego otrzymujesz taką samą jakość jak bitmapa. IPhone po prostu pobiera zasób „wektorowy” i konwertuje go na te same trzy rozmiary bitmap.

Oprócz powyższej logiki algorytmu jest ich kilkabardziej obiektywne korzyści wynikające z używania zasobów wektorowych dla iPhone'ów.

  1. Zmniejsza prawdopodobieństwo błędu ludzkiego. W tej chwili dostępne są trzy rozmiary bitmap (1x, 2x, 3x). Oznacza to, że musisz przesłać trzy obrazy do swoich zasobów. To trzy możliwości przypadkowego przeciągnięcia i upuszczenia niewłaściwego obrazu. Kiedy używasz zasobów wektorowych (które są tak uniwersalne w Xcode), musisz przesłać tylko jeden obraz zamiast trzech. Istnieje mniejsze prawdopodobieństwo przesłania nieprawidłowego rozmiaru lub obrazu.
  2. Prędkość. Z tego samego powodu co # 1. Jeśli korzystasz z wielu obrazów w swojej aplikacji, użycie zasobów wektorowych zmniejsza liczbę obrazów, które musisz przesłać o jedną trzecią.
  3. Gotowość na przyszłość. IPhone używa obecnie tylko trzech rozmiarów obrazu (1x, 2x, 3x). Ma to związek ze zwiększoną jakością siatkówki ekranów. Kiedy kilka lat temu Apple wprowadziło ekrany o wysokiej siatkówce, liczba pikseli na punkt wzrosła, co zapewnia ostrzejszy obraz.

    Wydaje się niezwykle prawdopodobne, że podobny wzrost technologiczny będzie nadal występował. W przyszłości może być konieczne przesłanie zdjęć 4x, 5x i 6x. Jeśli użyjemy zasobu wektorowego, aplikacja przeskaluje obraz za nas. Dzięki temu nie musimy rezygnować z nowych rozmiarów zasobu mapy bitowej.

    Chociaż muszę przyznać, że jestem trochę zdezorientowany, biorąc pod uwagę, że zasoby wektorowe iPhone'a nie wydają się faktycznie działać na algorytmach. Więc nie jestem pewien, jak automatycznie skalują się do większych rozmiarów. Ale mój mądry mentor wyjaśnił to i ufam mu!

Jedną wielką wadą używania zasobów wektorowych w Xcode jest to, że większość miejsc nie udostępnia .pdfpliku. Musisz go przekonwertować z .svgsiebie.

Aktualizacja 18 czerwca 2017 : Apple ogłosił w WWDC, że iOS obsługuje teraz prawdziwe obrazy skalarne! A przynajmniej tak myślę, że ogłosili. Teraz jest jeszcze więcej powodów, aby używać pojedynczej wagi.

Jak przesłać zasób wektorowy

Przejdź do menu atrybutów. Zmień skalę na „pojedynczą skalę” i zaznacz pole zmiany rozmiaru, aby „zachować dane wektorowe”. Spowoduje to zmianę opcji przesyłania na „wszystkie” zamiast 1x, 2x, 3x.

Następnie przeciągnij i upuść .pdfplik do jednego gniazda. Nie jestem jeszcze pewien, jak przekonwertować .svgna .pdf, ale zakładam, że jest to dość łatwe z podglądem.

Jak przesyłać pliki .png

Jeśli zdecydujesz się kontynuować .png, musisz przesłać trzy wersje swojego pliku. Ma to na celu pokrycie różnych rozdzielczości ekranu różnych iPhone'ów.

Najpierw upewnij się, że opcja „skale” w menu atrybutów jest ustawiona na „indywidualne skale”. Jest to opcja domyślna i pokaże Ci trzy miejsca, które powinieneś wypełnić:

Po drugie, znajdź obraz, którego chcesz użyć w swojej aplikacji. Załóżmy, że to ta ikona:

Wow, to duże. To dlatego, że pobrałem ze strony wersję 512 pikseli. Jednak chcę, aby w mojej aplikacji obraz miał tylko 20 x 20 pikseli. Aby przekonwertować obraz na 20 pikseli, zmienię jego rozmiar w Podglądzie.

Wykonaj trzy kopie oryginalnego obrazu. Nazwy obrazu powinna wyglądać mniej więcej tak: zen.png, [email protected], [email protected]. Ważne jest to, że wszystkie pliki mają tę samą nazwę (tutaj używam zen), a dwa z nich kończą się na @2xi @3x. W przypadku korzystania z tej konwencji nazewnictwa Xcode będzie w stanie automatycznie znaleźć prawidłowy rozmiar na podstawie typu urządzenia.

Następnie otwórz obraz w podglądzie i wybierz Narzędzia> Dopasuj rozmiar, aby wyświetlić poniższe menu. Określ 20 x 20 pikseli. Naciśnij ok i zapisz zmianę. To jest twój obraz podstawowy zen.png.

Zrób to samo dla [email protected]. Tylko to powinno mieć 40 x 40 pikseli. Jeszcze raz za [email protected]. Będzie to 60 x 60 pikseli.

Teraz możesz przeciągać i upuszczać obrazy do odpowiednich pól w Xcode. Gotowe!