Повторить изображение по горизонтали и вертикали

Я хочу повторить следующим образом:

enter image description here

для достижения следующего фона:

enter image description here

я попробовал несколько кодов следующим образом:

bluePatternView.backgroundColor = [UIColor colorWithPatternImage:
    [[UIImage imageNamed:@"blue_pattern.png"] stretchableImageWithLeftCapWidth:0 topCapHeight:0]];

и:

bluePatternView.backgroundColor = 
    [[UIColor alloc] initWithPatternImage:[UIImage imageNamed:@"blue_pattern.png"]];

Я также попытался нарисовать изображение с помощью CGContextDrawTiledImage без успеха.

как это можно сделать?!

EDIT: результат реализации luk2302. пожалуйста, дайте ему признание поддерживают голосование

bluePatternView.backgroundColor = 
  [UIColor colorWithPatternImage:[UIImage imageNamed:@"blue_pattern.png"]];

результат:

enter image description here

5 ответов


как мой комментарий уже сказал: используйте

bluePatternView.backgroundColor = 
  [UIColor colorWithPatternImage:[UIImage imageNamed:@"blue_pattern.png"]];

вы не хотите растягивать изображение. Давайте программирования с использованием UIKit позаботиться о повторении.

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

Примечание: дублировать то же самое изображение с расширением @2x и @3x приведет к вести себя правильно для лучшего устройств разрешением.

enter image description here


Я нашел решение в картинки.xcassets,

Шаг 1:- поместите изображение в изображения.xcassets

Шаг 2:- нажмите на изображение, затем нажмите на нижний правый угол написано " показать нарезку" Put image

Шаг 3: Нажмите кнопку Начать нарезку
start slicing

Шаг 4:- нажмите на кнопку "нарезать по горизонтали и вертикали"
Slice horizontally and vertically

шаг 5:- вы увидите 3-горизонтальные и 3 вертикальные линии среза.
enter image description here

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

enter image description here

Шаг 6:- использовать этот изображение.

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

enter image description here

Примечание: - Если вы даете нарезку на 2x изображение он будет повторять только 2x изображение, для 3x изображений вам нужно сделать то же нарезку.

пример от Apple


bluePatternView.backgroundColor = UIColor(patternImage: UIImage(named: "blue_pattern")!)

вам нужно сохранить изображение в активах, а затем поместить эти строки в viewdidload

bluePatternView.backgroundColor = UIColor.init(patternImage: #imageLiteral(resourceName: "f8"))

Это для Swift 4.1.


это способ ниже, используя stretchableImageWithLeftCapWidth такой способ:-

UIImage *backgroundImage = [[UIImage imageNamed:@"SheetBackground.png"] stretchableImageWithLeftCapWidth:0.5 topCapHeight:0];

как par ваш пример потребности: -

UIImage *backgroundImage = [[UIImage imageNamed:@"q4Ses.png"] stretchableImageWithLeftCapWidth:0.5 topCapHeight:0];

  [_scro setBackgroundColor:[UIColor colorWithPatternImage:backgroundImage]];