Подтвердить что ты не робот

IOS: подготовка фоновых изображений для приложений

В основном каждое приложение iOS имеет представление с изображением в качестве фона. Есть ли какое-нибудь руководство по определению размера изображения? Например, вот экран iOS, разработанный в Sketch:

введите описание изображения здесь

Как вы можете видеть, есть фоновое изображение. Теперь есть много устройств Apple, каждое приложение должно поддерживать. Новый iOS 10 поддерживает все устройства от iPhone 5 до iPhone 6s Plus. У них разные размеры и разрешения экрана. При создании активов Xcode я даю 3 фоновых изображения разного размера - @1x, @2x, @3x. Какими размерами они должны быть?

4b9b3361

Ответ 1

Как я вижу, у вас есть 2 варианта:

  • В здесь вы найдете разрешения iPhone:

разрешения экрана iphone

  • Вам не нужно @1 изображение, поскольку вы не поддерживаете iPhone 4 и 4s (iOS 10).
  • @2 для iPhone 5,5c, 5S, 6 и 6s, поэтому в основном вы можете создать изображение с разрешением 2 пикселя с высоким разрешением, которое является iPhone 6, и этот образ будет хорошо работать для семейства iPhone 5.
  • Или вы можете создать изображение с разрешением для каждого iPhone и с помощью жестко закодированной логики установить образ для каждого телефона. i.e: if iphone5c { setImage("iphone5cImage") } и т.д. и т.д.

  1. Самое простое решение - создать 1 изображение с самым высоким разрешением. @3 является самым высоким для iPhone 6S +, и он будет выглядеть потрясающе для остальных. Не забудьте установить вид изображения как заполнение аспект.

Кроме того, не забудьте проверить этот поток: как обрабатывать масштаб изображения на всех доступных разрешениях iPhone?. Это даст вам понять, с чем именно вы имеете дело. TL; DR, Это варианты, которые я написал.

Ответ 2

Фоновыми изображениями, которые вам нужно предоставить, являются @2x и @3x, потому что устройства с @1x уже давно исчезли на пыльных страницах истории.

Говоря о @2x и @3x, разрешения изображений, которые вы предоставляете разработчику, должны совпадать с iPhone с самым высоким разрешением, который использует этот заданный размер.

Для @2x, это iPhone 6, который является 750x1334, а для @3x - iPhone 6+, который является 1242x2208.

Даун-масштабирование не должно быть проблемой, поскольку пропорции всех iPhone, поддерживающих iOS 10, одинаковы (16: 9).

Примечание для разработчиков (разработчиков):

The UIImageView will then down-scale the images appropriately,
provided: 

1. you created an image set with the provided @2x and @3x images, 
2. correctly constrainted the UIImageView to the edges of the superview, and
3. selected the Content Mode of the UIImageView as Scale to Fill or Aspect Fill.

Ответ 3

Посмотрите страницу на документацию, есть статические изображения экрана запуска, и вы можете уловить размеры оттуда.

Вы можете получить размер экрана устройства, используя

CGSize screenSize = [UIScreen mainScreen].bounds.size // (Objective-C)


let screenSize: CGSize = UIScreen.mainScreen().bounds.size // (Swift)

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

Различные "размеры" @2x, @3x scale. И здесь хорошее объяснение.

Ответ 4

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

Всякий раз, когда вы принимаете решение с размером дизайна актива, вам нужно создать варианты @3x, @2x.

Еще одна вещь, о которой я должен указать, касается дизайна вектора. Если ваш дизайн сделан только с помощью векторов, вы можете выбрать экспорт векторных векторов в формате pdf. Настольная доска может принимать векторные активы, и они делают очень хорошо при масштабировании в полном объеме.

Ответ 5

Я использую фоновые изображения в своих приложениях. Чтобы решить эту проблему, я использую одно изображение с разрешением для всех iPhone и всех iPads, кроме большого. Размер изображения 2048x2048 points или 1024x1024 pixels at @2x для покрытия 9,7-дюймового iPad.

Изображение сжато JPG, чтобы уменьшить размер. Обратите внимание, что я разрешаю его масштабировать для iPhone 6 Pluse (@3x) и 12,7-дюймового iPad Pro (@2x), поскольку качество, похоже, не влияет. Я могу оправдать масштабирование для более крупных устройств, потому что, если бы я предоставил изображение для 12,7-дюймового iPad Pro, это будет 5464x4096 points (@2x) и 2732x2048 pixels, а затем сжатие JPG должно быть настолько высоким (если я хотел сохранить размер вниз), что качество изображения было низким в любом случае по сравнению с масштабированием.

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

Ответ 6

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

UIImage *bgImage = [UIImage imageNamed:@"[email protected]"];
CGSize screenSize = [UIScreen mainScreen].bounds.size;
UIGraphicsBeginImageContextWithOptions(screenSize, NO, 0.f);
[bgImage drawInRect:CGRectMake(0.f, 0.f, screenSize.width, screenSize.height)];
UIImage * resultImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
UIColor *backgroundColor = [UIColor colorWithPatternImage:resultImage];
self.view.backgroundColor = backgroundColor;

Ответ 7

введите описание изображения здесь

Есть 3 вида Apple Devices (iPhone и iPad), которые

Обычное устройство, условия которого равны 1 пикселю = 1 точка @1x (более старые устройства iPhone и iPad)

Устройство Retina, которое выражает до 4 пикселей (2 x 2) = 1 балл @2x (iPhone 5 +)

Retina iPhone6 ​​и iPad, которые соответствуют 9 пикселям (3 x 3) = 1 точка @3x (iPhone6 ​​+)

введите описание изображения здесь

Для iOs 10, которые не поддерживают iPhone 4, так что вам нужны только изображения @2x и @3x.

Как вы можете видеть выше, прикрепленное изображение iPhone 6 также поддерживает масштаб @2x, поэтому используйте размер изображения для @2x составляет 750 * 1334, а для @3x - 1242 * 2208 с режимом изображения.