UITableViewCell with semi transparent selected background - iphone

I need to hide the normal (unselected - cell.backgroundView) image of a cell when the cell is selected and show it when it is not selected.
The way the tableview works is that the normal view (cell.backgroundView) is always there and when the cell is selected it animates the selected image (cell.selectedBackgroundView) into view and places on top of the normal view.
The problem is when the selected cell is semitransparent and the normal cell is always visible underneath it.
I created, in 2 views for my (custom) UITableViewCell which I load in my view controller:
-(void)tableView:(UITableView *)tableView
willDisplayCell:(UITableViewCell *)cell
forRowAtIndexPath:(NSIndexPath *)indexPath
{
cell.backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"XYCell"]];
cell.selectedBackgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"XYCellSelected"]];
}
I cleared colors from in the required places but I cannot get it to work as I want.
Since my selected images (cell.selectedBackgroundView ) is semitransparent, the cell.backgroundView can still be seen underneath it.
How can I make it go away?

In general, if you want a custom cell you should implement your own uitableviewcell.
In your case take a look at
- (void)setSelected:(BOOL)selected animated:(BOOL)animated;
Code example to help you :
- (void)setSelected:(BOOL)selected animated:(BOOL)animated
{
[super setSelected:selected animated:animated];
//your own backgroundview when selected
self.selectedBackgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"selectedBck.png"]];
if (selected){
// edit the cell's view when it's selected
self.backgroundView = nil;
}
else {
// edit the cell's view when it isn't selected
}
}

- (void)tableView:(UITableView *)tableView didHighlightRowAtIndexPath:(NSIndexPath *)indexPath
{
self.highlightIndexPath = indexPath; // for iOS6
UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
cell.backgroundView.hidden = YES;
}
- (void)tableView:(UITableView *)tableView didUnhighlightRowAtIndexPath:(NSIndexPath *)indexPath
{
UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
if (indexPath.row == NSNotFound) {
// for iOS6
cell = [tableView cellForRowAtIndexPath:self.highlightIndexPath];
}
cell.backgroundView.hidden = NO;
}

Related

Change Color On Selection - TableView/SplitView

I have a UITableView for my MasterView of SplitView app.
On selecting any row, the color of that row becomes blue. I want to change it to black or dark grey color. How can I do that?
Thanks.
-(UITableViewCell *) tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
static NSString *CellIdentifier = #"CellIdentifier";
UITableViewCell *tableCell = (UITableViewCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (tableCell == nil) {
tableCell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease] ;
[tableCell setSelectionStyle:UITableViewCellSelectionStyleGray];
}
}
Or you can also try this on cellForRowAtIndexPath
if (indexPath.row == selectedIndex)
{
Cell.LblDynamicCell.textColor=[UIColor whiteColor];
Cell.LblBackView.backgroundColor=[UIColor Black];
}
//LblDynamicCell,LblBackView objects declare in cellViewController class
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
selectedIndex = indexPath.row;
[self.ResultTbl reloadData];
}
Following enum is defined for selection style -
typedef enum {
UITableViewCellSelectionStyleNone,
UITableViewCellSelectionStyleBlue,
UITableViewCellSelectionStyleGray
} UITableViewCellSelectionStyle;
So for your purpose you can use - UITableViewCellSelectionStyleGray
You can change the color of selected cell as follows:
- (void)setSelected:(BOOL)selected animated:(BOOL)animated
{
[super setSelected:selected animated:animated];
UIImageView *theImageView = [[UIImageView alloc] initWithImage:[UIImage imageName:#"table_selected_cell.png"]];
self.selectedBackgroundView = theImageView;
[theImageView release];
}
to change the color of your choice, where table_selected_cell.png is a 2px image of your color.

How to change tableViewCell background color

NOTE: this is about a cell in GROUPED tableView. That makes a HUGE difference, when compared to normal tableView! The default cell customization answers do NOT work in this case, so please verify your answer first.
This is how I set gray screen and yellow tableView background:
- (void)viewDidLoad
{
[super viewDidLoad];
self.view.backgroundColor = [UIColor grayColor];
UIView *myView = [[UIView alloc] initWithFrame:magicRect];
myView.backgroundColor = [UIColor yellowColor];
[self.tableView addSubview:myView];
[self.tableView sendSubviewToBack:myView];
}
This is how I set green cell background. As you can see from picture, it's missing some areas:
- (UITableViewCell *)tableView:(UITableView *)tableView
cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
UITableViewCell *cell =
[tableView dequeueReusableCellWithIdentifier:#"Cell"];
if (cell == nil) {
cell = [[[UITableViewCell alloc]
initWithStyle:UITableViewCellStyleValue1
reuseIdentifier:#"Cell"] autorelease];
cell.backgroundColor = [UIColor greenColor];
}
// Configure the cell...
}
Question: how can I change color at start and end of tableView cell? Now the cell is transparent in those areas and displays self.view.backgroundColor from below the whole tableView. Those areas really are transparent, since textured background remains in same location, when scrolling tableView.
set tableView Background as clear color like this,
- (UITableViewCell *)tableView:(UITableView *)tableView
cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
[tableView setBackgroundColor:[UIColor clearColor]];//Here you can give as yellow instead of adding view
//ur code
}
I don't know why you add subview to tableview, you can set the background color for tableview:
tview.backgroundColor=[UIColor yellowColor];

Changing a custom accessoryView in a uitableviewcell?

I'm trying to change the custom accessoryView of a uitableviewcell immediately after the user clicks on the cell. How would I do this?
For the record, I'm using Matt Gallagher' custom table view tutorial:
http://cocoawithlove.com/2009/04/easy-custom-uitableview-drawing.html
Download link for source: http://projectswithlove.com/projects/EasyCustomTable.zip
EDIT
Tried this code, but it just changes the accessory AFTER touch-up. Also tried willSelectRowAtIndexPath with same result.
- (NSIndexPath *)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
UIImage *indicatorImage = [UIImage imageNamed:#"indicatorSelected.png"];
UITableViewCell *cell = [self.tableView cellForRowAtIndexPath:indexPath];
cell.accessoryView = [[[UIImageView alloc] initWithImage:indicatorImage] autorelease];
return indexPath;
}
EDIT
Problem solved by making the background image of the cell contain the accessories. so the accessory was 'faked' by making it part of the image
Perhaps you can try to reload the cell in willSelectRowAtIndexPath/didSelectRowAtIndexPath:
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
UIImage *indicatorImage = [UIImage imageNamed:#"indicatorSelected.png"];
UITableViewCell *cell = [self.tableView cellForRowAtIndexPath:indexPath];
cell.accessoryView = [[[UIImageView alloc] initWithImage:indicatorImage] autorelease];
[tableView reloadRowsAtIndexPaths:[NSArray arrayWithObjects:indexPath,nil] withRowAnimation:NO];
}
Another recommendation:
didSelectRowAtIndexPath returns void not NSIndexPath.
You could change the accessoryView in the selection method as shown:
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
cell.accessoryView = newView;
}
This just grabs the current cell that was selected and then changes the accessory view of it. Your view object would go where newView is.
Use the highlightedImage property of UIImageView:
UIImageView* arrowView = [[UIImageView alloc] initWithImage:normalImage];
arrowView.highlightedImage = selectedImage;
cell.accessoryView = arrowView;
[arrowView release];

Help adding a backgroundView to UITableViewCell

I'm getting really desperate trying to add a UIImageView to UITableViewCell.backgroundView. All my efforts have resulted in this crappy rendering:
alt text http://img.skitch.com/20091123-ch8wk6pdxqkrn9tpftnhusigcy.jpg
It looks like the cell's label's white background is sitting on top of cell's background and covering portions of it.
I tried setting the label's background color to clear, or some other color and it does not have any event. It is always white.
The reason I know it's the text label's background causing this white area is that if I don't do [cell setText:#"Cell text here"]; the white area is gone and I see just the cell's background image.
Here's the code that I'm using. The table view is added in the .xib file and UITableView is added to UIViewController:
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
return 1;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
return [myCollection.items count];
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
NSUInteger rowIndex = indexPath.row;
static NSString *CellIdentifier = #"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
cell.backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"darkCellBackground.png"]];
cell.selectedBackgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"darkCellBackground.png"]];
}
[cell setText:#"Cell text here"];
return cell;
}
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
// Navigation logic may go here. Create and push another view controller.
// AnotherViewController *anotherViewController = [[AnotherViewController alloc] initWithNibName:#"AnotherView" bundle:nil];
// [self.navigationController pushViewController:anotherViewController];
// [anotherViewController release];
[tableView deselectRowAtIndexPath:indexPath animated:YES];
}
- (BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath {
return NO;
}
I'm sure I'm doing something wrong but cant quite figure out what.
The solution is here: Changing UITableViewCell textLabel background color to clear
- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {
[[cell textLabel] setBackgroundColor:[UIColor clearColor]];
[[cell detailTextLabel] setBackgroundColor:[UIColor clearColor]];
}
What you want is:
cell.backgroundColor = [UIColor colorWithPatternImage:[[UIImage imageNamed:#"some.png"]stretchableImageWithLeftCapWidth:320 topCapHeight:44]];
Did you try setting the cell's textLabel to not be opaque?
cell.textLabel.opaque = NO;
Or, if your background is a solid color where the label is, you could set the label's background color to the appropriate color.
Deprecation sidenote:
[UITableViewCell setText:] is deprecated in OS 3.0 - you shouldn't use it (if you're building for 3.0+) as it could disappear in the future. Instead, you should use UITableViewCell's textLabel property to set the text of the UILabel directly.
Memory management sidenote:
You're leaking two instances of UIImageView for every UITableViewCell you create using this code. These lines
cell.backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"darkCellBackground.png"]];
cell.selectedBackgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"darkCellBackground.png"]];
should be changed to this
cell.backgroundView = [[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"darkCellBackground.png"]] autorelease];
cell.selectedBackgroundView = [[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"darkCellBackground.png"]] autorelease];
Or you could use release instead of autorelease (doing it properly; don't try to just substitute release for autorelease, of course). Either way, the UITableViewCell takes ownership of the background views and because you alloc'd the objects you need to release your ownership of the objects.
Maybe you should take a look at this:
How can I set the background color of a cell in UITableView on iphone?
-(void) tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
cell.backgroundView=[[UIImageView alloc] initWithImage:[UIImage imageNamed:#"list-view-bg.png"] highlightedImage:[UIImage imageNamed:#"list-view-bg.png"]];
}
Set the table view background to clear color

How to get Transparent Accessory View in UITableViewCell? (w/ Screenshot)

I use a custom UITableViewCell from a nib. The accessory view is a Detail Disclosure Indicator . The problem is that the background color of the UITableViewCell behind the accessory view is not getting rendered (see image / source below). Any clues? Also, here are some things that I tried but did NOT work:
Things that DID NOT work:
- Setting the backgroundColor of the accessory view to clearColor
- Setting the contentView.opaque of the cell to FALSE
- Setting the contentView.opaque of the Table View to FALSE
- Setting a non-default accessory view for the cell
alt text http://www.chicknchoke.com/so/IMG_8028.png
-(void)showTablePrep
{
myTableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 480, 320, 416) style:UITableViewStylePlain];
myTableView.dataSource = self;
myTableView.delegate = self;
myTableView.delaysContentTouches = FALSE;
myTableView.opaque = FALSE;
myTableView.rowHeight = 60;
[UIView beginAnimations:#"SlideUp" context:nil];
[UIView setAnimationDuration:0.3f];
[myTableView setCenter:CGPointMake(myTableView.center.x, myTableView.center.y-436)];
[self.view addSubview:myTableView];
[self.view bringSubviewToFront:myTableView];
[UIView commitAnimations];
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
FriendsCell* cell = [tableView dequeueReusableCellWithIdentifier:#"CustomCellID"];
if (cell == nil){
NSArray *nib = [[NSBundle mainBundle] loadNibNamed:#"FriendsCellView" owner:self options:nil];
cell = (FriendsCell*)[nib objectAtIndex:0];
if(indexPath.row % 2 == 0){
cell.contentView.backgroundColor = [UIColor grayColor];
}else{
cell.contentView.backgroundColor = [UIColor lightGrayColor];
}
cell.accessoryView.backgroundColor = [UIColor clearColor];
cell.contentView.opaque = FALSE;
cell.selectionStyle = UITableViewCellSelectionStyleNone;
if(f
riendsCounter > indexPath.row){
cell.titleLabel.text = #"Label";
cell.descLabel.text = #"Description goes here";
}else{
cell.titleLabel.text = #"";
cell.descLabel.text = #"";
cell.accessoryType = UITableViewCellAccessoryNone;
}
}
return cell;
}
You're drawing the background color for your cell incorrectly. A UITableViewCell will be arranged so that the contentView and accessoryView sit side-by-side. (This is done so that the contentView can clip its content so it doesn't overlap with the accessory view) The problem is not that the accessory view is opaque, it's that the gray background is simply not drawn behind the accessory view.
The correct way of customizing the background drawn behind a UITableViewCell is to customize its backgroundView. I haven't tried this, but since you're only changing the color, you might be able to simply set the backgroundColor color on the backgroundView to your desired color.
I found the answer by having a look at the subviews of my custom table view cell.
It seems like the accessory view has a button sitting over it. By finding this button in the subviews and changing its color, i was able to update the background color behind the accessory button.
<UIButton: 0x3b4d690; frame = (277 0; 43 75); opaque = NO; layer = <CALayer: 0x3b3e0b0>>
for (UIView *aSubView in self.subviews) {
if ([aSubView isMemberOfClass:[UIButton class]]) {
aSubView.backgroundColor = [UIColor greenColor];
}
}
Unfortunately I was only able to reach this button within the
- (void)setSelected:(BOOL)selected animated:(BOOL)animated
method of my custom table view cell class. I've used this successfully within my app to display a different highlight color when the user selects a cell. This should point you in the right direction.
I resolve this problem on iOS7 but adding
[cell setSelectionStyle:UITableViewCellSelectionStyleNone];
in
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
and you modify your background and other bakcgrounds here :
- (BOOL)tableView:(UITableView *)tableView shouldHighlightRowAtIndexPath:(NSIndexPath *)indexPath {
return YES;
}
- (void)tableView:(UITableView *)tableView didHighlightRowAtIndexPath:(NSIndexPath *)indexPath {
// Add your Colour.
UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
[cell setBackgroundColor:[UIColor colorWithHexColor:HIGHLIGHT_COLOR]];
}
- (void)tableView:(UITableView *)tableView didUnhighlightRowAtIndexPath:(NSIndexPath *)indexPath {
// Reset Colour.
UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
[cell setBackgroundColor:[UIColor colorWithHexColor:UNHIGHLIGHT_COLOR]];
}