Плиточный фоновое изображение: Могу ли я сделать это легко с UIImageView?

Question

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

Является ли UIImageView моим другом для этого?

Answer 1

Если я правильно понимаю ваш вопрос, вы можете использовать colorWithPatternImage: на UIColor, а затем установить цвет фона на UIView.

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

Answer 2

Чтобы заставить альфа работать с образцом, убедитесь, что у вас есть следующий набор:

view.backgroundColor = [UIColor colorWithPatternImage:aImage];
view.layer.opaque = NO;

Answer 3

В течение многих лет я использовал подход Билла Дадни, но iOS 6 имеет гораздо лучшее решение. И ... сегодня я нашел способ заставить это работать и на старых версиях iOS.

1. создайте новый класс "UIImage + Tileable" (источник копирования / вставки ниже)
2. импортируйте это в любой класс, где вы хотите UIImageView с мозаичным изображением. Это категория, поэтому она «обновляет» все ваши UIImage до мозаичных, используя стандартные вызовы Apple
3. когда вы хотите использовать «мозаичную» версию изображения, вызовите: «image = [image imageResizingModeTile]»

UIImage + Tileable.h

#import <UIKit/UIKit.h>

@interface UIImage (Tileable)

-(UIImage*) imageResizingModeTile;

@end

UIImage + Tileable.m

#import "UIImage+Tileable.h"

@implementation UIImage (Tileable)

-(UIImage*) imageResizingModeTile
{
    float iOSVersion = [[[UIDevice currentDevice] systemVersion] floatValue];

    if( iOSVersion >= 6.0f )
    {
        return [self resizableImageWithCapInsets:UIEdgeInsetsZero resizingMode:UIImageResizingModeTile];
    }
    else
    {
        return [self resizableImageWithCapInsets:UIEdgeInsetsZero];
    }
}
@end

Answer 4

Я использую вариант решения @ Rivera:

Добавьте в расширение UIView следующее:

- (void)setColorPattern:(NSString *)imageName
{
    [self setBackgroundColor:[UIColor colorWithPatternImage:[UIImage imageNamed:imageName]]];
}

Затем вы можете установить фоновый узор в файле раскадровки / xib:

Answer 5

Поскольку мне действительно нравится Interface Builder, я создал этот подкласс UIImageView для применения плиточных фонов:

@interface PETiledImageView : UIImageView

@end

@implementation PETiledImageView

- (void)awakeFromNib
{
    [super awakeFromNib];

    UIImage * imageToTile = self.image;
    self.image = nil;
    UIColor * tiledColor = [UIColor colorWithPatternImage:imageToTile];
    self.backgroundColor = tiledColor;
}

@end

Я попытался переопределить setImage:, но, похоже, IB не вызывает его при декодировании файла Nib.

Answer 6

В Видеосеанс WWDC 2018 219 - Рекомендации по изображениям и графике , инженер Apple явно рекомендует не использовать цвет рисунка для мозаичных фонов:

Я рекомендую не использовать узорные цвета со свойством цвета фона в UIView. Вместо этого создайте UIImageView. Присвойте свое изображение этому виду изображения. И используйте функции в UIImageView для правильной установки параметров листов.

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

imageView.image = image.resizableImage(withCapInsets: .zero, resizingMode: .tile)

Или даже проще, если вы используете каталог активов - выберите актив изображения шаблона и в инспекторе Атрибуты включите Срез (Горизонтальный / Вертикальный или оба), установите вкладки на ноль и ширину Высота по размерам вашего изображения:

затем просто назначьте это изображение вашему виду изображения (также работает Interface Builder), просто не забудьте установить для * UImageView contentMode значение .scaleToFill.

Answer 7

Быстрая версия решения Daniel T. Вам все еще нужно установить значение keyPath в IB. Конечно, вы можете быть осторожнее, распаковывая дополнительный UIImage.

extension UIView {
    var colorPattern:String {
        get {
            return ""  // Not useful here.
        }
        set {
            self.backgroundColor = UIColor(patternImage: UIImage(named:newValue)!)
        }
    }
}