Create custom UIView draw

Question

What is the best way to create a custom UIView? So i got 3 images (top, mid, bot) and inside the button i want an image (it need to be resizable (in height only)

How can i create this with UIView so i can put a image inside it and that the views resize? (I want this in a UITablecell)

Answer 1

Try these two links for custom UITableView Drawing:

cocoawithlove.com/2009/04/easy-custom-uitableview-drawing.html

http://adeem.me/blog/2009/05/30/iphone-sdk-tutorial-part-6-creating-custom-uitableviewcell-using-interface-builder-uitableview/

Within there you should be able to set each cell' height separately. If not there, then override the UITableViewDelegate method

tableView:heightForRowAtIndexPath:

http://developer.apple.com/library/ios/#documentation/UIKit/Reference/UITableViewDelegate_Protocol/Reference/Reference.html

Answer 2

If you're using iOS 5 have a look at the resizableImageWithCapInsets: method in UIImage .

This allows you to specify which part of your image should resize and which should scale automatically. This is ideal for reusing background images like in your case.

So you would create your resizable image with the blue background and specify the offset from the edges that should resize with the image. You don't have to slice or chop your image, just provide it as one whole image, the scaling will happen automatically and your rounded corners will stay in tact if you specify the cap insets correctly.

// Change the edge insets to match your image...
UIImage *backgroundImage = [[UIImage imageNamed:@"button_background"]  
   resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 10, 10)];

// Create an image view to hold the new image
UIImageView *myBackgroundImageView = [[UIImageView alloc] initWithImage:backgroundImage];

// [...] here make sure to size your image view to match the size of your parent view

// Add the background image view to the view
[self addSubview:myBackgroundImageView];

Then you're free to use a similar technique for custom tableview cells. But the idea here is to use a resizable image with edge insets to scale your background image dynamically.

Here 'sa good blog post explaining edge insets.

Hope that helps.