I have a subclassed UIButton inside a subclassed UITableViewCell. The button is loaded from a nib.
I have an image I want to use as the image for the button. I would like to use CALayer for more control over animation. When the user taps the button, animation will occur. But, I can't even get the image to show up.
QuartzCore is imported.
Code of my subclassed UIButton (always loaded from a nib):
-(void)awakeFromNib {
[super awakeFromNib];
self.clipsToBounds = NO;
self.backgroundColor = [UIColor clearColor];
self.opaque = NO;
self.userInteractionEnabled = YES;
}
Code in the table view controller:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
MyCustomCell *cell = (BLCustomCellCenter*)[tableView dequeueReusableCellWithIdentifier:#"customCellID"];
if (cell == nil) {
// ... cell is initialized
}
// configure the image for the button
//
// Note: there is an outlet to the UIButton called 'customButton'
CALayer *imgLayer = [CALayer layer];
imgLayer.bounds = CGRectMake(0, 0, cell.customButton.bounds.size.width, cell.customButton.bounds.size.height);
imgLayer.position = CGPointMake(cell.customButton.bounds.size.width/2, cell.customButton.bounds.size.height/2);
UIImage *img = [UIImage imageNamed:#"someImage"];
imgLayer.contents = (id)[img CGImage];
[cell.customButton.layer addSublayer:imgLayer];
// ... configure subviews of 'customButton'
return cell;
}
Any help very much appreciated, as always.
Figured it out, after hours of debugging. The thing (that perhaps I forgot to mention) was that the custom UITableViewCell was loaded from a nib. The subview I wanted to view was also loaded from a nib. So, it's a nib within a nib.
Per this wonderful article, overriding awakeAfterUsingCoder: inside the subview's class did the trick. When loading the parent nib, the super's initUsingCoder:is called on the subview which loads only a placeholder object.
This 'placeholder' object was causing my problems as I was manipulating the placeholder instead of the actual object I wanted.
Therefore, you have to load and initialize the subview's objects from the nib, and you do this by overriding NSObject's awakeAfterUsingCoder:.
Try adding [imgLayer setNeedsDisplay]; after you set the contents.
Related
I'm creating a Settings View for my app, and in that view is a UITableView. I'm creating custom cells to meet my needs, but I'm having issues - only the last cell is getting [layoutSubviews]. Am I doing something wrong?
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
//int type = (indexPath.row == 0?1:0);
//if(indexPath.row == 6) type = 2;
NSLog(#"row %i created", indexPath.row);
TableCell *cell = [[TableCell alloc] initWithType:indexPath.row];
cell.textLabel.text = #"Test cell";
return cell;
}
And in my custom cell:
#implementation TableCell
UIImageView *shadowView;
int row;
- (id) initWithType:(int)type {
row = type;
self = [super initWithStyle:UITableViewCellStyleDefault reuseIdentifier:nil];
self.backgroundColor = [UIColor clearColor];
self.backgroundView = [[UIView alloc] init];
UIImage *shadowImage = [UIImage imageNamed:#"CellShadow"];
shadowImage = [shadowImage resizableImageWithCapInsets:UIEdgeInsetsMake(14, 14, 14, 14)];
shadowView = [[UIImageView alloc] initWithImage:shadowImage];
[self.contentView addSubview:shadowView];
//[self.contentView sendSubviewToBack:shadowView];
NSLog(#"agreed, row %i created", row);
[self layoutSubviews];
return self;
}
- (void) layoutSubviews {
NSLog(#"row: %i", row);
[super layoutSubviews];
shadowView.frame = CGRectMake(
0, 0,
self.contentView.frame.size.width,
self.contentView.frame.size.height
);
}
#end
Continuously, only the last cell #6, is reported when I rotate, or when layoutSubviews should be called. Any suggestions?
Do not call layoutSubviews directly. Use [self setNeedsLayout] or [self layoutIfNeeded]. But do not call these at all in the cell's init method.
Also, do not call [[TableCell alloc] initWithType:indexPath.row]; directly, either. Instead, use...
- (id)dequeueReusableCellWithIdentifier:(NSString *)identifier forIndexPath:(NSIndexPath *)indexPath
Once you've built that cell, you can tell it it's row, but be aware that the cells get recycled as the table scrolls, so you must update that value on every call to cellForRowAtIndexPath.
The cells ought to get layout again (without you making any calls direct or indirect) when the table view is resized.
See the tableview doc here.
You should never call layoutSubviews directly, it will be called automatically by iOS once the cell is ready to display. You should also deque the cell as #danh is recommending. If you're not very comfortable with all this, then I'd really recommend you have a look at the free Sensible TableView framework, which automates creating these kind of settings views (I create mine in a couple of lines, really).
The issue was of my own poor code. Using cell.backgroundView helped a lot here.
Never Call layoutSubviews by yourself. It will be called when ever frames of subview in cell are changed. Even if just change the text of labels in your custom cell wont call layoutSubviews. Ue the deque of cells for reusing for better performance. As it wont allocate cell every time. And in you code looks like has lot of memory issues since cell allocated wont be released and new cell is created.
I've used UIAppearance to set the background image of my table cells across my app.
[[UITableViewCell appearance] setBackgroundView:[ [UIImageView alloc] initWithImage:[ [UIImage imageNamed:#"list_bg.png"] stretchableImageWithLeftCapWidth:0.0 topCapHeight:5.0] ]];
However, when I view a list the background image is only set for one of the cells on screen. If I scroll the screen the background image is set on the cell that appears into view but it doesnt set this bg image on any other visible cell.
Anyone got any idea whats going on? I thought that by setting the UIAppearance of UITableviewCell that all instances of this type would automatically get the background image.
Thanks
Brian
Here is my cellForRowAtIndexPath method:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"plantCell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
[[NSBundle mainBundle] loadNibNamed:#"PlantListCell" owner:self options:nil];
cell = _plantCell;
self.plantCell = nil;
}
Plant *plant = [self.fetchedResultsController objectAtIndexPath:indexPath];
UIImageView *thumbnail = (UIImageView *)[cell viewWithTag:1];
thumbnail.image = [UIImage imageNamed:[plant.name stringByAppendingString:#"_S"]];
UILabel *label = (UILabel *)[cell viewWithTag:2];
label.text = plant.name;
UIImageView *set = (UIImageView *)[cell viewWithTag:3];
set.image = [UIImage imageNamed:#"set"];
UIImageView *favourite = (UIImageView *)[cell viewWithTag:4];
favourite.image = [UIImage imageNamed:#"fav"];
return cell;
}
Yep. The issue with this is you're telling the UITableViewCell class to set the one UIImageView for each table view cell's background view. Once its set as one, its removed from its previous superview, and added to the new UITableViewCell. You're not getting duplicate UIImageViews set on each tableViewCell; you're getting the one view set on every table view cell.
So then its set and unset from each tableViewCell till the last one it was set on.
Using the appearance proxy for this method sets it on every object of the UITableViewCell.
I wouldn't use the appearance proxy to set the background view method, as whatever view you pass to it will be one view, which can only apply to one cell at a time.
My recommendation is to create a view for each cell independently, or creating a subclass which sets it on initialisation.
Thanks thebarcodeproject. It kind of makes sense alright, but I don't see why Apple bothered to allow us to set the UITableviewCell background image if it doesnt really work.
I went with a simple solution in the end by just setting the image in the cellForRowAtIndexPath method.
cell.backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"list_bg.png"]];
It works fine, but not great if you have lots of tables and want to set it in a generic way.
Cheers
Brian
I solved this by creating a base class called CustomizableUITableCell and setting up a ui appearance value for the background image. Then whenever i create a cell that i need with a custom background i simple subclass CustomizableUITableCell.
//Header
#import <UIKit/UIKit.h>
#interface CustomizableUITableCell : UITableViewCell <UIAppearance>
#property (nonatomic, weak) UIColor *backgroundCellColor UI_APPEARANCE_SELECTOR;
#end
//Implementation
#import "CustomizableUITableCell.h"
#implementation CustomizableUITableCell
#synthesize backgroundCellColor;
#pragma mark - Public Methods.
-(void)setBackgroundCellColor:(UIColor *)backgroundColor
{
[super setBackgroundColor:backgroundColor];
}
#end
You can then set it using the appearance proxy.
[[CustomizableUITableCell appearance] setBackgroundCellColor:[UIColor colorWithPatternImage:backgroundImage]];
cell.backgroundView = [[UIImageView alloc]
initWithImage:[ [UIImage imageNamed:#"1.jpg"]
stretchableImageWithLeftCapWidth:0.0 topCapHeight:5.0] ];
It works for me..
I have a new controller defined as follows:
#interface view1: UITableViewController
I've created (in viewDidLoad) an image view (logo image) and added this image view as subview for view1, but the problem is that table view cells still appear behind this image view, how can completely separate the image view from the table view ?
thanks in advance.
To have a logo type view you either need to set a custom headerview for the tableview via
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section;
and
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section;
the other method would be overriding -loadView and creating your own view that has two subviews, your imageview and a tableview.
In the first method, once your scroll some the logo will eventually disappear. The second method makes the logo static.
Try adding it in:
- (void)viewDidAppear:(BOOL)animated
This method is only called once you have called viewDidLoad so if you want something over everything else you might call this one or add the subview to:
[[[UIApplication sharedApplication] keyWindow] addSubview:yourView];
Hopefully it helps you.
2 options:
1.create a UIViewController to hold your UITableViewController controller view and your imageView, then position their frame so they wont overlap
2.add the imageView as a TableView Section Header
-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
UIImageView* imageView = [[UIImageView alloc] initWithImage:
[UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:#"image" ofType:#"png"]]];
return imageView;
}
and make sure you have at least 1 section of course in:
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
// Return the number of sections.
return 1;
}
What is seems like you want is for your logo to be at the top, above your table view? If so then you can, in -viewDidLoad, set the tableView's tableHeaderView to the view you want, e.g.:
tableView.tableHeaderView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"image"]]; // assuming ARC, else autorelease or put in variable first...
If you want it to float on top when scrolling then DanZimm's use of -tableView:viewForHeaderInSection: is what you want.
Let's say I have a property in my view controller, defined as follows:
#property (nonatomic, retain) UIImageView *checkmarkOffAccessoryView;
I #synthesize this in the implementation, release it in -dealloc and initialize it in -viewDidLoad as follows:
self.checkmarkOffAccessoryView = [[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"checkmarkOff.png"]] autorelease];
So far so good.
When I use it in my table view delegate as an accessory view for multiple cells, two things happen:
Only one cell's accessory view shows the image
The application UI freezes.
The app doesn't crash, as near as I can tell, the UI simply becomes unresponsive. This is both in the simulator and on the device.
Here is how I use the initialized property with my cell:
- (UITableViewCell *) tableView:(UITableView *)tv cellForRowAtIndexPath:(NSIndexPath *)indexPath {
// initialize or dequeue cell...
if (condition)
cell.accessoryView = self.checkmarkOffAccessoryView;
else
cell.accessoryView = nil;
}
With the aforementioned code, only one cell shows the accessory view and the UI freezes.
If I initialize the UIImageView instance directly in the delegate method I get all condition-satisfying cells showing the accessory view and I do not experience the UI freeze:
- (UITableViewCell *) tableView:(UITableView *)tv cellForRowAtIndexPath:(NSIndexPath *)indexPath {
// initialize or dequeue cell...
if (condition)
cell.accessoryView = [[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"checkmarkOff.png"]] autorelease];
else
cell.accessoryView = nil;
}
My goal is to initialize as few objects as possible and reuse one UIImageView. I'm curious why the first chunk of code is problematic and what I could do to fix this.
It seems like the cell's accessoryView property should just increment the retain count of self.checkmarkOffAccessoryView but it appears I am missing some detail.
What have I overlooked? Thanks for your advice.
EDIT
I think that:
self.checkmarkOffAccessoryView = [[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"checkmarkOff.png"]] autorelease];
is the same as:
UIImageView *uncheckedView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"checkmarkOff.png"]];
self.checkmarkOffAccessoryView = uncheckedView;
[uncheckedView release];
Either way, I experience the same freeze symptom.
You cannot add the same view multiple times. The UI handler will go bonkers. To make sure of this, I tried doing what you said above and I got the same issue. The UI freezes up, the image only appears for one of the cells.
The best thing you can do is to store your image as a UIImage allocated, and to have a helper function which returns a new UIImageView per cell.
Using your current method (without a stored UIImage) you might do:
-(UIImageView *) makeCheckmarkOffAccessoryView
{
return [[[UIImageView alloc] initWithImage:
[UIImage imageNamed:#"checkmarkOff.png"]] autorelease];
}
And then do
cell.accessoryView = [self makeCheckmarkOffAccessoryView];
As you may be aware, UIImages on the other hand may be used any number of times. a UIImageView doesn't take up a lot of space, so you can easily have a bunch of those without worrying.
To expand on the one place only deal, imagine that you add a UIView to two places at the same time.
What will [ob removeFromSuperview] do for this object? Will it remove the view from both places? From one of them only? Which value will be returned when you request [ob superview]? Clearly the UI is not made to handle what you're asking for.
Try it without the autorelease in the initializer. I suspect you're over-releasing.
By the way, your console probably is showing a BAD_ACCESS error when it freezes. If you turn on NSZombieEnabled, my guess is you'll see it's making a call to a deallocated UIImage.
maybe this will help
- (UITableViewCell *)tableView:(UITableView *)aTableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"ShoppingListCell";
HSShoppingListCell *cell = (HSShoppingListCell *)[aTableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
[[NSBundle mainBundle] loadNibNamed:#"ShoppingListCell"
owner:self
options:nil];
cell = shoppingListCell;
}
ShoppingListItem *theItem = nil;
theItem = [self.fetchedResultsController objectAtIndexPath:indexPath];
UIImage *selected = [UIImage imageNamed:#"listBullet_checked.png"];
UIImage *notSelected = [UIImage imageNamed:#"listBullet.png"];
cell.imageView.image = ([theItem.checkedOff boolValue] ? selected : notSelected);
cell.shoppingListLabel.text = theItem.productName;
[cell.shoppingListLabel setFont:[UIFont fontWithName:#"Marker Felt" size:26.0]];
return cell;
}
- (void)toggleCellImage:(NSIndexPath *)indexPath
{
ShoppingListItem *item = [self.fetchedResultsController objectAtIndexPath:indexPath];
item.checkedOff = ([item.checkedOff boolValue] ? [NSNumber numberWithBool:NO] : [NSNumber numberWithBool:YES]);
[HSCoreDataUtilities saveContext:item.managedObjectContext];
[self.tableView reloadData];
}
#pragma mark -
#pragma mark Table view delegate
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
[self toggleCellImage:indexPath];
[self.tableView deselectRowAtIndexPath:indexPath animated:YES];
}
Reducing your case to the bare essentials (I was going to suggest to put two 'thin' UIView objects around the UIImageView...), I found that it is most probably impossible.
Create 2 empty UIView objects in IB, hook them up to bareView1 and bareView2. Then
UIImageView *imageView = [[UIImageView alloc]
initWithImage:[UIImage imageNamed:#"test.png"]];
[bareView1 addSubview:imageView]; // it shows either here ...
[bareView2 addSubview:imageView]; // ... or here
You can never get the image on sceen more than once like this. As a rule of thumb, I think the first object in line which does not inherit from UIView can be used multiple times, i.e. the UIImage. Like Kalle stated, a UIView can only have one parent in the view hierarchy.
Postponing the second addSubview only makes the UIImageView jump from bareView1 to bareView2.
The freeze happens maybe because the event handling gets mixed up: the accessory can be interactive, how would you know which one was tapped if they are one and the same object? So the code assumes objects are unique, and you manage to violate that assumption.
I have a UITableView where I am displaying a list of data. I would like to have a logo instead of just text for the header portion of the view. The code below gives me just the text.
Any ideas on how to get the image in there?
- (void)viewDidLoad
{
[super viewDidLoad];
self. = #"Videos";
Something like that:
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
return 69.0;
}
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
UIView* headerView = [[UIView alloc] initWithFrame: CGRectMake(0.0, 0.0, 320.0, 69.0)];
headerView.backgroundColor = [UIColor colorWithPatternImage: [UIImage imageWithContentsOfFile: [[NSBundle mainBundle] pathForResource: #"header1" ofType: #"png"]]];
return headerView;
}
To get an icon in the navigation bar (basically what the Facebook app does) use the navigationItem's titleView property. You can put an arbitrary UIView there, and a UIImageView with the logo on a transparent background would give the same effect that Facebook uses. Do this in viewDidLoad and you're set.
Any view controller can use a UINavigationItem, so if you're not using a navigation controller you should still be able to get one.
Alternately, just add a UIToolbar wherever it makes sense, and give it a UIBarButtonItem with a custom view set to a UIImageView.