Repeat image horizontally and vertically

问题

I want to repeat the following image:

to achieve the following background:

I tried a few codes as follow:

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

and:

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

I also tried to draw image with CGContextDrawTiledImage with no success.

How that can be done?!

EDIT: result of implementing luk2302. please give him recognition by upvoting

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

result:

回答1:

As my comment already said: use

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

You dont want to stretch your image. Let UIKit take care of the repetition.

Assuming that your bluePatternView is the actual large view for which you want to set a pattern as background. Maybe you are setting the background property of the wrong view if that code is still not working.

Note: duplicating the SAME image with @2x and @3x extension will lead to behaive properly for better resolution devices.

回答2:

I found solution in images.xcassets,

Step 1:- Put your image to images.xcassets

Step 2:- Click on image, then click on bottom right corner written “Show Slicing”

Step 3:- Click on Start Slicing

Step 4:- Click on "Slice Horizontally and Vertically" button

Step 5:- Here you will see 3-Horizontal and 3-Vertical slice lines.

Put the most left vertical line to left side of image and both right most lines to right side of image.
Put the most top line to top of image and both bottom most lines to bottom of image.
So the final result will be looking like this.

Step 6:- Use this image.

And now image will be repeated.

Note:- If you give slicing to 2x image it will repeat just 2x image, for 3x images you need to do the same slicing.

Example by Apple

回答3:

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

回答4:

You need to save image in Assets then put those lines in viewdidload

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

This is for Swift 4.1.

回答5:

this with Bellow Method using stretchableImageWithLeftCapWidth like this way:-

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

as par your need example:-

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

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

来源：https://stackoverflow.com/questions/30001569/repeat-image-horizontally-and-vertically

标签

ios

imageview