Як завантажити зображення в Xcode

Щоб використовувати зображення в Xcode, вам потрібно завантажити їх Assets.xcassetsу Supporting Filesпапку. Є два варіанти: растрові карти (вони ж pngфайли) або вектори (вони ж .pdfфайли). Першим кроком є ​​вибір типу файлу, який ви хочете використовувати.

Різниця між растровими зображеннями та векторними активами

Більшість навчальних посібників в Інтернеті використовують растрові об’єкти, які є .pngфайлами. Для цього потрібно перетягнути більше 3 копій зображення в Xcode.

Однак існує школа думок, яка вважає, що векторні активи вищі. У цій статті є чудове пояснення, чому це так. Векторні ресурси - це .svgфайли (або .pdfдля Xcode). Якщо ви вирішите використовувати активи векторів, вам потрібно завантажити лише одну версію зображення в Xcode.

Ось те, що я чув від тих набагато мудріших, ніж тоді я - телефони Android використовують алгоритми векторного об’єкта для створення зображення будь-якого розміру. Це має сенс, враховуючи широку кількість пристроїв та розміри екранів для Android.

Однак векторні активи в iPhone насправді не масштабуються за допомогою алгоритмів (очевидно). Таким чином, ви не отримуєте якісніші зображення, використовуючи вектори над растровими зображеннями. Натомість ви отримуєте таку ж якість, як і растрове зображення. IPhone просто бере актив "вектор" і перетворює його на однакові три розміри растрових зображень.

Окрім логіки алгоритму вище, є кількабільш об'єктивні переваги використання векторних ресурсів для iPhone.

  1. Знижує ймовірність людських помилок. Зараз є три розміри растрових зображень (1x, 2x, 3x). Це означає, що вам потрібно завантажити три зображення до своїх об’єктів. Це три можливості випадково перетягнути неправильне зображення. Коли ви використовуєте векторні ресурси (які в Xcode видаються універсальними), вам потрібно завантажити лише одне зображення замість трьох. Менше шансів завантажити неправильний розмір або зображення.
  2. Швидкість. Те саме, що і No1. Якщо ви використовуєте багато зображень у своєму додатку, то використання векторних ресурсів зменшує кількість зображень, які потрібно завантажити, на третину.
  3. Майбутня перевірка. Наразі iPhone використовує лише три розміри зображення (1x, 2x, 3x). Це пов’язано з підвищеною якістю сітківки екранів. Коли кілька років тому Apple представила екрани з високою сітківкою, кількість пікселів на точку збільшилася для отримання більш чіткого зображення.

    Дуже ймовірно, що подібні технологічні збільшення будуть продовжувати відбуватися. Надалі нам може знадобитися завантажувати зображення 4x, 5x та 6x. Якщо ми використовуємо векторний об’єкт, програма масштабує зображення для нас. Це рятує нас від зменшення нових розмірів растрового об’єкта.

    Хоча я повинен визнати, що я трохи розгублений з цього приводу, враховуючи те, що векторні активи iPhone, схоже, насправді не працюють над алгоритмами. Тому я не впевнений, як вони автоматично масштабуватимуться до більших розмірів. Але мій мудрий наставник пояснив це, і я йому довіряю!

Основним недоліком використання векторних ресурсів у Xcode є те, що більшість місць не надають .pdfфайл. Вам потрібно перетворити його з .svgсебе.

Оновлення від 18 червня 2017 року : Apple оголосила у WWDC, що iOS тепер підтримує справжні скалярні зображення! Або принаймні, саме про це, на мою думку, вони оголосили. Зараз є ще більше підстав для використання однієї шкали.

Як завантажити векторний об’єкт

Перейдіть до меню атрибутів. Змініть масштаб на “єдиний масштаб” і встановіть прапорець проти розміру, щоб “зберегти векторні дані”. Це змінить параметр завантаження на "всі" замість 1x, 2x, 3x.

Потім перетягніть .pdfфайл у одне гніздо. Я не дуже впевнений , як конвертувати .svgв .pdf, але я припускаю , що це досить легко з попереднім переглядом.

Як завантажити .png файли

Якщо ви вирішите продовжити .png, вам потрібно буде завантажити три версії вашого файлу. Це охоплює різну роздільну здатність екрана різних iPhone.

По-перше, переконайтеся, що параметр “масштаби” в меню атрибутів встановлений на “окремі масштаби”. Це варіант за замовчуванням, і він покаже вам три слоти, які слід заповнити:

По-друге, знайдіть зображення, яке ви хочете використовувати у своєму додатку. Припустимо, що це така піктограма:

Ого, це велике. Це тому, що я завантажив 512-піксельну версію з сайту. Однак я хочу лише, щоб у моїй програмі зображення було розміром 20 х 20 пікселів. Щоб перетворити зображення на 20 пікселів, я зміню його розмір у Попередньому перегляді.

Зробіть три копії оригінального зображення. Назви вашого зображення повинні виглядати наступним чином : zen.png, [email protected], [email protected]. Важливою частиною є те , що файли все мають таке ж ім'я (тут я використовую zen), і два з них закінчуються @2xі @3x. Коли ви використовуєте цю умову іменування, Xcode зможе автоматично знаходити правильний розмір залежно від типу пристрою.

Далі відкрийте зображення в Попередньому перегляді та перейдіть до Інструменти> Налаштувати розмір, щоб відкрити меню нижче. Вкажіть 20 x 20 пікселів. Натисніть OK і збережіть зміни. Це ваше базове зображення, zen.png.

Зробіть те саме для [email protected]. Тільки це має бути 40 х 40 пікселів. Ще раз на [email protected]. Це буде 60 х 60 пікселів.

Тепер ви можете перетягувати зображення у потрібні поля в Xcode. Готово!