I have a Tab Bar (UITabBarController) application with a "More" View Controller because of having more than 5 views. The rest of my application has a black background and white text, and I have been able to customize this table to match this. As a result of this however, the Tab Bar images that normally appear on the left side of the "More" table are invisible (since they're meant for a white background). I need to find a way to make the Tab Bar images display as they do in the Tab Bar which itself has a black background.
Example:
Black Background (Invisible Images)
I have subclassed the TabBarController and changed the data source for the "MoreTableView":
TabBarController.m
- (void)viewDidLoad {
[super viewDidLoad];
UINavigationController *moreController = self.moreNavigationController;
moreController.navigationBar.barStyle = UIBarStyleBlackOpaque;
if ([moreController.topViewController.view isKindOfClass:[UITableView class]])
{
UITableView *view = (UITableView *)moreController.topViewController.view;
view.separatorColor = [[UIColor alloc] initWithRed:0.3 green:0.3 blue:0.3 alpha:1.0];
view.backgroundColor = [UIColor blackColor];
view.dataSource = [[MoreTableViewDataSource alloc] initWithDataSource:view.dataSource];
}
}
MoreTableViewDataSource.m
-(MoreTableViewDataSource *) initWithDataSource:(id<UITableViewDataSource>) dataSource
{
originalDataSource = dataSource;
[super init];
return self;
}
- (NSInteger)tableView:(UITableView *)table numberOfRowsInSection:(NSInteger)section
{
return [originalDataSource tableView:table numberOfRowsInSection:section];
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
UITableViewCell *cell = [originalDataSource tableView:tableView cellForRowAtIndexPath:indexPath];
cell.textColor = [[UIColor alloc] initWithRed:1 green:0.55 blue:0 alpha:1.0];
cell.accessoryView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"customAccessory.png"]];
return cell;
}
Thanks in advance,
Julian
Doing moreController.topViewController.view is kinda dangerous.
I'd recommend instead putting in a tab of your own creation that does the more list, with the normal icon, then opening the other tabs under the more list via normal nav controller methods. You'll need to remove any overflow tab items from the tab bar of course.
There might be a more elegant way to do this, however.
first, thanks for posting your subclass of the tabbar controller.
I included it into the application im writing and ran into the same problem.
My solution is to simply swap the image and the highlighted image.
For this you have to change the method tableView:cellForRowAtIndexPath: of MoreTableViewDataSource.m, e.g.:
- (UITableViewCell *) tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
UITableViewCell *cell = [dataSource tableView:tableView cellForRowAtIndexPath:indexPath];
UIImageView *imageView = [cell imageView];
UIImage *image = [imageView image];
[imageView setImage:[imageView highlightedImage]];
[imageView setHighlightedImage:image];
return cell;
}
Cheers,
Michael
Related
As shown in the below image, I have set the table's background and some other styles. The index, highlighted in red, is transparent. How do I set it to be white like the rest of the cell?
You can use the designated UITableView properties:
tableView.sectionIndexColor = [UIColor brownColor];
tableView.sectionIndexBackgroundColor = [UIColor whiteColor];
tableView.sectionIndexTrackingBackgroundColor = [UIColor blueColor];
Messing around with the underlying TableView layers will likely reject your app and may break if Apple changes their UITableView implementation.
its too much easy dude.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
for(UIView *view in [tableView subviews])
{
if([[[view class] description] isEqualToString:#"UITableViewIndex"])
{
[view performSelector:#selector(setIndexColor:) withObject:[UIColor whiteColor]];
//give color which you want
}
}
static NSString *MyIdentifier = #"MyIdentifier";
//go further with table cell design...
}
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];
I'm trying to create the exact same effect as in the AppStore app for viewing screenshots: inside a UITableView, I have custom subclasses of UITableViewCell's. One of them is designed to show previews of some product, say 4 images. I want them to show the same way as the AppStore presents screenshots of an app : inside a horizontal UIScrollView with its attached UIPageControl.
So I add my UIScrollView and my UIPageControl to my UITableViewCell, just like that :
#implementation phVolumePreviewCell
- (id)init {
if (self = [super initWithStyle:UITableViewCellStyleDefault reuseIdentifier:kVolumePreviewCellIdentifier]) {
[self setAccessoryType:UITableViewCellAccessoryDisclosureIndicator];
[self setSelectionStyle:UITableViewCellSeparatorStyleNone];
previews = [[NSMutableArray alloc] initWithCapacity:4];
for (int i = 0; i < 4; i++) {
[previews addObject:#"dummy"];
}
scrollView = [[UIScrollView alloc] initWithFrame:CGRectZero];
[scrollView setPagingEnabled:YES];
[scrollView setBackgroundColor:[UIColor grayColor]];
[scrollView setIndicatorStyle:UIScrollViewIndicatorStyleBlack];
[scrollView setShowsHorizontalScrollIndicator:YES];
[scrollView setBounces:YES];
[scrollView setScrollEnabled:YES];
[scrollView setDelegate:self];
[self.contentView addSubview:scrollView];
[scrollView release];
pageControl = [[UIPageControl alloc] initWithFrame:CGRectZero];
[pageControl setNumberOfPages:[previews count]];
[pageControl setBackgroundColor:[UIColor grayColor]];
[self.contentView addSubview:pageControl];
[pageControl release];
}
return self;
}
(note: I'm populating "previews" with dummy data here, just in order to have a [previews count] that works ; I want to view the scrollView's scroll indicator for test purposes only, I'll hide them later on).
My problem is that I can scroll the whole UITableView containing this phVolumePreviewCell (subclass of UITableViewCell), but I can't scroll the UIScrollView. How can I achieve this?
The only information I found is there: http://theexciter.com/articles/touches-and-uiscrollview-inside-a-uitableview.html
But it talks of old SDKs (namely 2.2) and I'm sure there is a more "recent" approach to doing this.
Some precisions :
I can scroll the UIScrollView with two fingers. That's not what I want, I want it to be able to scroll with one finger only.
When I scroll with two fingers, the TableView still intercepts the touches and scroll a little bit to the top or the bottom. I'd like the TableView to stick at its position when I touch the ScrollView.
I believe I have to work out how to intercept touches on my TableView, and if the touch is on the phVolumePreviewCell (custom UITableViewCell subclass), pass it to the cell instead of handling it on the TableView.
For the record, my TableView is created programmatically in a UITableViewController subclass:
#interface phVolumeController : UITableViewController <UITableViewDelegate> {
LocalLibrary *lib;
NSString *volumeID;
LLVolume *volume;
}
- (id)initWithLibrary:(LocalLibrary *)newLib andVolumeID:(NSString *)newVolumeID;
#end
#implementation phVolumeController
#pragma mark -
#pragma mark Initialization
- (id)initWithLibrary:(LocalLibrary *)newLib andVolumeID:(NSString *)newVolumeID {
if (self = [super initWithStyle:UITableViewStylePlain]) {
lib = [newLib retain];
volumeID = newVolumeID;
volume = [(LLVolume *)[LLVolume alloc] initFromLibrary:lib forID:volumeID];
[[self navigationItem] setTitle:[volume title]];
}
return self;
}
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
return 1;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
return 1;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:kVolumePreviewCellIdentifier];
if (cell == nil) {
cell = [[[phVolumePreviewCell alloc] init] autorelease];
}
[(phVolumePreviewCell *)cell setVolume:volume];
return (UITableViewCell *)cell;
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
return kVolumePreviewCellHeight;
}
Thanks for any help!
I have found a workaround.
Recreating from scratch a very simple UITableView (8 rows), and inserting a UIScrollView in just the second row, works perfectly. Nested scroll views (the TableView and the ScrollView) scroll independently as expected. All that was done in a single-file test project, in the AppDelegate.
So... first I thought "this might be a delegation problem", so I told the scrollView that its delegate was the TableView, not my custom TableViewCell subclass. To no avail.
Then instead of resorting to a custom, clean TableViewCell subclass that just adds the ScrollView and the PageControl, I resorted to creating a plain TableViewCell in the TableView's cellForRowAtIndexPath: method. Then, I create a UIScrollView right after initializing the TableViewCell, then add it to the TableViewCell, and shazam... it works!
Before:
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:kVolumePreviewCellIdentifier];
if (cell == nil) {
cell = [[[phVolumePreviewCell alloc] init] autorelease];
}
[(phVolumePreviewCell *)cell setVolume:volume];
// That does the job of creating the cell's scrollView and pageControl
return (UITableViewCell *)cell
After:
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:kvcPreviewRowIdentifier];
if (cell == nil) {
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:kvcPreviewRowIdentifier] autorelease];
previewScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, tableView.frame.size.width, kvcPreviewScrollViewHeight)];
[previewScrollView setContentSize:CGSizeMake(1000, kvcPreviewScrollViewHeight)];
[[cell contentView] addSubview:previewScrollView];
previewPageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, kvcPreviewScrollViewHeight, tableView.frame.size.width, kvcPreviewPageControlHeight)];
[previewPageControl setNumberOfPages:4];
[[cell contentView] addSubview:previewPageControl];
}
return (UITableViewCell *)cell;
How the heck comes that when I create my scrollView from the TVCell subclass, it doesn't play nice ; but when I create the scrollView from the TableView right after creating a "classical" TVCell, it works?
I might have found a solution, but I'm still puzzled by the reason.
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
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]];
}