ios: colorWithPatternImage , stretch image full screen

Question

I have one view , and want set backGroudColor for this view by UIImage. The code as :

self.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"backImage.png"]];

the problem is: the backImage'frame is small than the view. how to stretch UIImage to full my view. I konw use UIImageView can reach.

someone have good idea?

update:

I can't upload one image.

Like this:backImge's size is 30*30, and my view's size is 1024*700, when i use myview.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"backImage.png"]];

The result is myview's backGroup has many 'backImage.png'. my goal is have one 'backImage.png' streth full myview.

Solution 1

Have a try.

self.layer.contents = (id)[UIImage imageNamed:@"freshBackground.png"].CGImage;

Swift:

self.view.layer.contents = UIImage(named: "freshBackground")!.cgImage

Solution 2

As far as I know, you cannot resize the background's pattern image directly. The easiest way is just to change your image to fit your parent view's frame size. Or you can redraw your image to fit the size of your parent view.

UIView * yourView = [[UIView alloc] initWithFrame:CGRectMake(10.f, 100.f, 300.f, 100.f)];
UIImage * targetImage = [UIImage imageNamed:@"backImage.png"];

// redraw the image to fit |yourView|'s size
UIGraphicsBeginImageContextWithOptions(yourView.frame.size, NO, 0.f);
[targetImage drawInRect:CGRectMake(0.f, 0.f, yourView.frame.size.width, yourView.frame.size.height)];
UIImage * resultImage = UIGraphicsGetImageFromCurrentImageContext();    
UIGraphicsEndImageContext();

[yourView setBackgroundColor:[UIColor colorWithPatternImage:resultImage]];

Solution 3

world000's answer translated to Swift:

self.layer.contents = UIImage(named: "freshBackground.png")?.CGImage

Solution 4

And based on Kjuly's answer, if you want the image to be inset properly at the center rather than being stretched, use this method to get the new image:

#pragma mark - Image
+(UIImage*)imageFitInCenterForSize:(CGSize)inSize forSourceImage:(UIImage*)inImage
{
    // redraw the image to fit |yourView|'s size
    CGSize imageOriginalSize = inImage.size;
    UIImage *resultImage = nil;
    if (imageOriginalSize.width<=inSize.width && imageOriginalSize.height<=inSize.height)
    {
        UIGraphicsBeginImageContextWithOptions(inSize, NO, 0.f);
        [inImage drawInRect:CGRectMake((inSize.width-imageOriginalSize.width)/2.0, (inSize.height-imageOriginalSize.height)/2.0, imageOriginalSize.width, imageOriginalSize.height)];
        resultImage = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
    }
    return resultImage;
}

The same with overloaded variant:

+(UIImage*)imageFitInCenterForSize:(CGSize)inSize forSourceImage:(UIImage*)inImage xOffset:(CGFloat)inXOffset yOffset:(CGFloat)inYOffset
{
    // http://stackoverflow.com/questions/10629403/ios-colorwithpatternimage-stretch-image-full-screen
    // redraw the image to fit |yourView|'s size
    CGSize imageOriginalSize = inImage.size;
    UIImage *resultImage = nil;
    if (imageOriginalSize.width<=inSize.width && imageOriginalSize.height<=inSize.height)
    {
        UIGraphicsBeginImageContextWithOptions(inSize, NO, 0.f);
        [inImage drawInRect:CGRectMake((inSize.width-imageOriginalSize.width)/2.0+inXOffset, (inSize.height-imageOriginalSize.height)/2.0+inYOffset, imageOriginalSize.width, imageOriginalSize.height)];
        resultImage = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
    }
    return resultImage;
}

Solution 5

I use the following method to:

1. draw the image within the specific bounds (which makes it scale)
2. use the resulting image as a pattern.

Code:

UIGraphicsBeginImageContext(self.window.frame.size);
[[UIImage imageNamed:@"background"] drawInRect:self.window.bounds];
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
self.window.backgroundColor = [UIColor colorWithPatternImage:image];

View more solutions

Comments

[rishi]

can you show some image, to get us some more idea about the issue?

[rishi]

Might be this is your issue - stackoverflow.com/questions/8651276/…

[dengApro]

Objective-C , Xcode 10.14, self.layer.contents = (__bridge id _Nullable)([UIImage imageNamed: @"freshBackground"].CGImage);

[CRDave]

This help mw very well

[SirNod]

Here is a tutorial the explains it: raywenderlich.com/2502/…

[Dilshan]

Perfect solution. Works well.

[Şafak Gezer]

2015, and still the best solution.

[Valentin Mercier]

Awesome answer, although it wouldn't be appropriate if one needs to use a UIColor for example for altering the alpha component (semi transparent image)

[arshu]

Awesome Dude. For Swift : self.view.layer.contents = UIImage.init(named:"freshBackground")!.CGImage

[ja928]

I had trouble implementing this method until I realized that my UIView's size in the xib was set to Freeform. Changing the UIView's size to "Inferred" sorted me out.