iDev iDev - 1 year ago 122
Objective-C Question

UIImageView stretch/repeat image on borders and maintain its quality

I have a squared


enter image description here

I'm trying to create a
using this
for any given rect which I'll be using as a border to another view on top of it.

I don't want to set the border of the
manually but I would like to use this image.

Example of desired output:

enter image description here

I tried using

UIImageView *imageView1 = [[UIImageView alloc] initWithFrame:CGRectMake(5, 5, 300, 150)];
[imageView setImage:[UIImage imageNamed:@"background"]];
[imageView setContentMode:UIViewContentModeScaleToFill];

But the image is stretching and not returning the desired output

Example output:

enter image description here

Answer Source

Programmatically you can create border with shadow effect:

[view.layer setCornerRadius:5];
[view.layer setShadowColor:[UIColor lightGrayColor].CGColor];
[view.layer setShadowOpacity:0.4];
[view.layer setShadowRadius:1.0];
[view.layer setShadowOffset:CGSizeMake(1.0, 1.0)];

Although if you want to do it using Xcode interface, you can do it as

  1. Drag & drop your square image into Assets
  2. Select image & click on "Show the Attribute Inspector"
  3. In Slicing section select "Horizontal and Vertical" for Slices

Now Use it as you want you will have stretch image without any distortion

enter image description here

You can view image slice view on clicking "Show Slicing" at the bottom

enter image description here

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download