iOS - Различные изображения на основе устройства или масштабирование одного и того же изображения?

Question

Кажется, что разработчики всегда создают разные объекты изображения для разных устройств и загружают их на основе устройства. Но есть ли какие-либо недостатки в создании изображений для самого большого устройства разрешения (iPad), а затем масштабирование этого изображения для iPhone 6, 5 и т. Д.?

Я использую SpriteKit, поэтому я бы просто создал SKSpriteNodes разных размеров и применил к ним ту же текстуру и масштабировал ее, чтобы она соответствовала узлу.

Я знаю, что производительность может быть рассмотрена (загрузка больших изображений для более старых устройств). Но что в стороне, есть ли что-нибудь еще? Являются ли эти изображения более пиксельными/размытыми?

Answer 1

Идеальный/пуристский ответ заключается в использовании отдельных изображений и кода для каждого разрешения устройства.

Однако с вашего собственного времени и здравого смысла имеет смысл использовать ограниченный набор, учитывая, что количество разрешений и размеров экрана в ближайшее время не будет меньше. Поэтому почему часовые часы готовят несколько изображений, если это не может быть сделано проще, например, xcode.

Для изображений, которые являются квадратными или фиксированными пропорциями, мне кажется, что вам нужно только одно изображение. Существует проблема с изображениями, такими как фоны, где независимо от разрешения вам нужно будет обслуживать, по крайней мере, для разных аспектных пайков: поэтому отдельные изображения с соотношением сторон являются существенными (например, 3: 2 и 16: 9), если вы не против раздавливания, растяжения или обрезать изображения.

Если вы обнаружите, что производительность страдает при тестировании, вы всегда можете добавить изображения с более низким разрешением позже.

С точки зрения пикселизации это то, чего вы не можете избежать. Если вы думаете о том, что происходит, когда вы переходите от x3 к разрешению x1, вам приходится смешивать 3x3 пикселя в 1x1. При высоком разрешении больше всего пострадает все, что является шириной одного пикселя (например, линии) или имеет быстрое изменение цвета на несколько пикселей. Об этом можно узнать много статей в Интернете.

Единственный способ избежать пикселизации - использовать векторные изображения, но для этого потребуется специальное программное обеспечение для загрузки векторных изображений и рендеринга их в UIImages.

Каждое изображение будет по-разному ухудшаться при уменьшении масштаба. Можно подумать, что для x2-изображений вы уменьшаете масштаб 1 для iPhone 3 и от 1 до x3 для iPhone 6+. Это будет охватывать большинство современных устройств при собственном разрешении и, возможно, менее заметную пикселизацию.

Answer 2

У меня под впечатлением какое-то время, что одно изображение, которое вы позже масштабируете, тоже прекрасное.

Для множества способов сделать так, наряду с некоторыми критериями, проверить NSHispter: Image Resizing Techniques

И для дальнейшего чтения, ознакомьтесь с Core Image Apple, документ, в котором статья NSHipster упоминает также.

Answer 3

Никто не ответил, будет ли качество изображения уменьшено. Я просто попытался реализовать это, и изображения DO кажутся немного более пиксельными, чем если бы они были сохранены в их собственном размере.

Answer 4

Это зависит. Конечно, более экономично использовать одно изображение - или одно изображение на соотношение сторон, если усечение изображения вызовет проблему.

Для изображений, подобных фотографиям, это может быть совершенно приемлемым, поскольку такие изображения не включают в себя пиксельные функции.

Если мы имеем дело с графическим оформлением, тем не менее - тонкие линии, острые контуры, идеальные пиксельные функции - масштабирование может серьезно ухудшить качество.

Рассмотрим следующий пример: Представьте, что вы хотите создать настраиваемое текстовое поле с фиксированным размером. Текстовая область должна быть заключена черным контуром с шириной линии 1px. Вы используете разрешение сетчатки для своих работ, и отправной точкой является размер экрана 4 дюйма. Как будет отображаться окно на других размерах экрана, если текстовое поле масштабируется вместе с экраном? И как оно будет выглядеть на фоне -ретина-дисплей?

Non-Retina: разрешение должно быть уменьшено в два раза. Представьте себе блок из 2x2 пикселей в вашем обложке - его нужно будет вычислить в один пиксель. Наша схема имеет ширину всего 1 пиксель, поэтому 2x2 пиксельный блок с проходящей через него линией содержит два черных и два белых пикселя. Результирующий пиксель без сетчатки будет серым. На самом деле масштабирование немного сложнее, но результат будет размытым, менее черным и чуть более толстым

Масштабируемая сетчатка: разрешение должно быть увеличено. Представьте себе устройство с разрешением олицетворения 1,5x 4-дюймового экрана. Строка 1px должна быть шириной 1,5 пикселя, что, очевидно, не будет работать. Вместо этого исходная линия 1px будет растянута до серой шкалы на два (или более) пикселя, приближаясь к «количеству черноты», которое имеет линия 1,5px.

В любом случае (вверх или вниз) масштабирование сделает контур размытым, толстым и менее черным.

Пример не идеальный, поскольку iOS позволяет определять изображения с растяжимыми частями, которые отлично масштабируются. Для нашей прямоугольной коробки это было бы возможно. Тем не менее, это не работает для более сложных работ.

Если пиксель совершенство является обязательным, нет никакого пути вокруг изображений для каждой графики разрешения или векторной (Quartz/SVGKit/...)

Edit: я воспроизвел мой пример в Photoshop, используя масштабирование билинейного , Он может выглядеть несколько иначе на устройстве, потому что он может использовать другой алгоритм масштабирования. Но я думаю, вы получите точку ...

Answer 5

Я могу ответить из моего опыта с точки зрения использования памяти. Достаточно людей ответили на качество изображения, так что единственная проблема связана с использованием памяти. Я использовал технику, описанную в моей игре Piston Flip, и она отлично работала, потому что я не использовал много текстур или узлов. Однако в другой игре, над которой я работаю, которая использует плитки, я не могу позволить себе использовать большие изображения и масштабировать их, потому что каждое устройство может в значительной степени обрабатывать только те плитки, которые указаны для его размера экрана.

Так что это действительно зависит.