Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
484 views
in Technique[技术] by (71.8m points)

ios - Repeat image horizontally and vertically

I want to repeat the following image:

enter image description here

to achieve the following background:

enter image description here

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:

enter image description here

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

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” Put image

Step 3:- Click on Start Slicing
start slicing

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

Step 5:- Here you will see 3-Horizontal and 3-Vertical slice lines.
enter image description here

  • 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.

enter image description here

Step 6:- Use this image.

And now image will be repeated.

enter image description here

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


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...