SergiusGee SergiusGee - 6 months ago 20
iOS Question

Create a border around UIImageView using 8 images

I have 8 images I made, 4 images for each of the corners, and 4 images for each of the sides of

. Now, how on Earth do I make them 'come around' the
so they form a nice-looking, stretchable border, something like this (the white line is the border I try to implement):
enter image description here

Any ideas on how do you implement a border of a
based on 8 preset images?

EDIT: I don't want to draw the border, I want to use my 8 images!


It is not really what you are asking for but this is the solution closest to what you are trying to do.

You should take your 8 images and combine them into one single image and then make a resizable image out of that using resizableImageWithCapInsets:resizingMode:.

The first arguments lets you specify the top, left, bottom and right inset (i.e. the sizes of your images).

enter image description here

The second argument determines if the areas are stretched or tiled.

Stretched border

Tiled border

So to use it you would do something similar to

UIImage *myFullImage = [UIImage imageNamed:@"nameOfTheCombinedImage"];
UIImage *resizableImage = 
[myFullImage resizableImageWithCapInsets:UIEdgeInsetsMake(top, left, bottom, right)resizingMode:UIImageResizingModeTile];

(stretched vs tiles images "borrowed" from here)