I've created a custom UITableViewCell class where I've created a label and imageview, and connected them via storyboard. What's the best place to apply corner radius, border width, etc. to the imageView?
I tried the following in the custom class' init method but it didn't quite work:
- (id)initWithFrame:(CGRect)frame {
self = [super initWithFrame:frame];
if (self) {
productImageView.layer.borderColor = (__bridge CGColorRef)([UIColor whiteColor]);
productImageView.layer.borderWidth = 3.0f;
productImageView.layer.cornerRadius = 36.0f;
}
return self;
}
What's wrong here?
Are you doing in this in the UITableViewCell subclass? If so you need add this in awakeFromNib or prepareForReuse. When init is called the image view doesn't exist yet. Also do self.productImageView.clipsToBounds = YES;
Related
I subclassed UITableViewCell (subtitle style) and I have to set the imageView property runtime. The size of the image can be different for each cell, but I want the imageView to be squared (fixed size). For this reason I set at first a squared image as a placeholder. This is the code of the init method:
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
// Other settings...
[self.imageView.layer setCornerRadius:2.0f];
self.imageView.contentMode = UIViewContentModeScaleAspectFill;
[self.imageView setClipsToBounds:YES];
self.imageView.image = [UIImage imageNamed:#"placeholder"];
return self;
}
In the layoutSubviews method I just call the super method, while I set the image in the UITableViewController once I get it from its URL. This is working fine as you can see here:
But when I enter in edit mode something happens and I get this:
I tried to set imageView frame in layoutSubviews method but the image is not aligned and textDetail label keep starting in the same position of the above screenshot... where am I wrong?
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
[self setBackgroundColor:[UIColor clearColor]];
//[self createViews];
}
return self;
}
- (void)drawRect:(CGRect)rect
{
NSLog(#"draw rect");
[self createViews];
}
I'm creating a custom UITableViewCell. I require creating a UILabel that depends on the height of the UITableViewCell, and the height is not yet set in initWithStyle (it returns the default 44 when in reality the height of my cell varies greatly). For this reason, I call my createViews function in drawRect. This was working well, however I'm noticing that the function can be called again when I insert and delete rows.
My Question:
Does it make sense to call my createViews function inside drawRect?
You have few options here.
1. Use layoutSubviews/awakeFromNib, check whether the subviews were created, if no, create them with correct frames.
2. Use init to create views with:
Constraints
Without constraints and in layoutSubviews/awakeFromNib try to change the frame
Here's the situation: I have a VC that has a Custom UIView inside it. This Custom UIView has an .xib file, which contains 2 UIImageViews. I'm trying to get those 2 UIImageViews to scale to same size across different screen size by using AutoLayout. However, when I launch my app the images in my Custom UIView go out of bounds of the Custom UIView's super View (which is the VC) container size. Please, help. Here are some pictures to explain the issue in better detail.
My code in Custom UIView:
#implementation CustomTwoImagesSelectedUIView
-(id)initWithCoder:(NSCoder *)aDecoder {
self = [super initWithCoder:aDecoder];
if (self) {
[self load];
}
return self;
}
- (id)initWithFrame:(CGRect)frame {
self = [super initWithFrame:frame];
if (self) {
[self load];
}
return self;
}
- (void)load {
[[NSBundle mainBundle] loadNibNamed:#"CustomTwoImagesSelectedUIView" owner:self options:nil];
self.lastImageView.layer.cornerRadius = 5.0f;
self.lastImageView.clipsToBounds = YES;
self.secondToLastImageView.layer.cornerRadius = 5.0f;
self.secondToLastImageView.clipsToBounds = YES;
[self addSubview:self.twoImagesSelectedView];
}
You have set the cliptobounds property of the imageviews but the bound of imageviews itself is not set properly I guess. You need to carefully set layout constraints in the .xib file for imageviews. Also. When you add the customImageViews to some view controller, or superview. You also need to set the layout constraints for customImageViews with respect to its superview.
I have try AutoLayout in the custom UIView, but it can not work too. I think it is a bug from Xcode, and I finally found this article：Create an IBDesignable UIView subclass with code from an XIB file in Xcode 6
In the article, I found it use autoresizingMask instead of AutoLayout. It is a good way to fix the UI display problem. I hope it can helps you.
- (void)load {
[[NSBundle mainBundle] loadNibNamed:#"CustomTwoImagesSelectedUIView" owner:self options:nil];
self.lastImageView.layer.cornerRadius = 5.0f;
self.lastImageView.clipsToBounds = YES;
self.secondToLastImageView.layer.cornerRadius = 5.0f;
self.secondToLastImageView.clipsToBounds = YES;
[self addSubview:self.twoImagesSelectedView];
self.twoImagesSelectedView.frame = self.bounds;
self.twoImagesSelectedView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
}
I want to add two adjacent custom buttons in the UITableView's accessory view.
I tried doing cell.accessoryView = customButton; and then
cell.accessoryView = customButton2 .It is obvious that this replaces the previous button.
Thanks for any help!
You can add a UIView containing the two buttons as a custom accessoryView.
UIView *buttonsView = [...];
// add buttons to buttonsView
cell.accessoryView = buttonsView;
Or you can subclass UITableViewCell and add two buttons there.
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
UIButton *buttonA = ....
UIButton *buttonB = ....
[self.contentView addSubview:buttonA];
[self.contentView addSubview:buttonB];
}
return self;
}
If you haven't done a custom UITableViewCell before this article might help.
http://code.tutsplus.com/tutorials/ios-sdk-crafting-custom-uitableview-cells--mobile-15702
You can make a custom UIView class with your buttons placed inside of it (as subviews: [self addSubview:button]). Then you can assign your custom UIView object as accessoryView of a cell.
cell.accessoryView = yourCustomView;
I quite like the way that padding has been added to the UITableViewCells in this app. I doubt it's possible in Storyboard, but what's the best way to achieve this?
You could easily do this in storyboard I think.
Just add a custom cell, grey background.
On that add a UIView as a subview, with a white background, and arrange the size so that it becomes a smaller rectangle inside your cell, so it gets this margin effect.
Then add your labels/imageviews on that white subview and you're good.
Anything wrong with that approach?
Feels a bit like cheating, but why not?
Using Storyboard this can be a daunting layout to achieve with UITableView on iOS 7. Programmatically it can be done fairly easily, with a bit of patience.
Anyway, given the quantity of information in the cell, I'd be tempted to use a UICollectionView with a UICollectionViewFlowLayout instead of a table. This might make things easier for you as you can set the cells size, sections margin, minimum distance between items, etc. all within Storyboard.
All you need is to make custom table cell and add specific background
#implementation CustomTableViewCell
-(id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
<init your custom cell here>
UIView *bgView = [[UIView alloc] initWithFrame:self.bounds];
CGRect whiteRect = CGRectInset(bgView.bounds, 10, 5);
UIView *innerView = [[UIView alloc] initWithFrame:whiteRect];
innerView.autoresizingMask = UIViewAutoresizingFlexibleHeight;
innerView.backgroundColor = [UIColor whiteColor];
[bgView addSubview:innerView];
bgView.backgroundColor = [UIColor colorWithRed:225.0/255 green:224.0/255 blue:230.0/255 alpha:1.0];
self.backgroundView = bgView;
}
return self;
}
Also here you can add self.selectedBackgroundView = selectedView in the same way to assign the specific view to your cell while it is highlighted/selected.