stretchableImageWithLeftCapWidth makes image Blurry

Hello i have an image such as this

And i would think that it could stretch just fine. Its 17px wide and 30 px tall.

I just want to be able to stret开发者_开发技巧ch it horizontally. But this is what i end up with when i stretch it.

With out stretching it...

Maybe I'm being picky about these corners but it just seems like it should work a little better than it is.

Any help would be awesome!

int textWidth = [text length] * 10;

    CGRect rect = CGRectMake(32.50f, 14.5f, 40.0f, 30.0f);

    UIImage* img = [[UIImage imageNamed:@"screen_displayer_rounded.png"] stretchableImageWithLeftCapWidth:8 topCapHeight:0];
    UIImageView* imgView = [[UIImageView alloc] initWithFrame:rect];

    [imgView setImage:img];    

    //[imgView addSubview:label];
    NSLog(@"imge %@", imgView.subviews);

    [self addSubview:imgView];

You should preserve at least 5 pixels horizontally and 6 vertically. Therefore use 5x6 as your caps instead 4x0 (btw, 0 means stretch the whole image). This way, iOS will stretch your image using the pixels sixth and seventh (marked in red below).

looking at your image in Photoshop, it looks like your horizontal and vertical rounded corners are 5px and 6px respectively. So, the following line should be as follows;

UIImage* img = [[UIImage imageNamed:@"screen_displayer_rounded.png"] stretchableImageWithLeftCapWidth:5 topCapHeight:6];