Hi i want to add a line in my UITableView just like the reminder apps red line. I tried adding it to my custom cell but then it only display in the cell which are used and not in all cell. I want a red image like below
Thanks in advance
You could use a UIView that has the size of the red stripe and place it over your UITableView where you want the red line to appear. Set it's backgroundColor to the color of the red line and make sure that userInteractionEnabled is set to NO to avoid interfering with the scolling of the UITableView.
Try To add UIView on tableView and set it`s Background Color with pattern Image whatever you want,then add such view on tableview. like below.
lineView = [[UIView alloc] initWithFrame:CGRectMake(100, 0, 1,
tblView.frame.size.height)];
[lineView setBackgroundColor:[UIColor blackColor]]; //Change as per your req.
lineView.userInteractionEnabled = NO;
[tblView addSubview:lineView];
But you face problem with this when you scroll up then at vertical bounce you have to manage height of this UIView. So you can implement this by ScrollViewDidScroll Delegate method, This method call cause UITableView is extends from UIScrollView.
-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
lineView.frame = CGRectMake(100, 0, 1, tblView.frame.size.height+scrollView.contentOffset.y);
}
Related
I try to use setSeparatorStyle=UITableViewCellSeparatorStyleNONE;
And it works but I am disappointed because it lets all the separator disappear, this is not what I want. I want to have cell 1, 3 and 4 have separator, while cell 2 separator needs to be hidden. How can i do that?
You can Hide tableView's standard separator line
First use
self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
You can Change hight/width/color/image of UIView for set your separatorLine.
Add custom separator to add UIView of 1px height in cell:
UIView* separatorLineView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 1)];/// change size as you need.
separatorLineView.backgroundColor = [UIColor grayColor];// you can also put image here
[cell.contentView addSubview:separatorLineView];
and in index 2
Cell.separatorLineView.hidden = TRUE;
SeperatorStyle property is assigned to the UITableView. So for customization first of all set
[tableview setSeparatorStyle=UITableViewCellSeparatorStyleNone]
//thus the default seperator will be hidden.
Now insert a view having width, the same as cell width, height 1, and color separator preferred color. thus by giving reference we can show or hide this seperatorView accordingly. Seems bulky, but simple.
setSeparatorStyle=UITableViewCellSeparatorStyleNONE; //remove all separator
2.the contentView of Cell call the method addSubview ,the subView is a image(line is bottom at a background image) or a view whose height is 1px.
View the subView as a separator .
3.design a property for a cell, then change the property in the method cellForRowAtIndexPath() According to the property, you can determine if the separator is Hidden in method awakeFromNib
I'm facing a problem with UITableView and it's property tableHeaderView.
I want to have the tableHeaderView to behave like UISearchBar, i.e. the content offset should be the of tableHeaderView.
Setting contentOffset, etc. didn't help when the table view wouldn't fill the view's frame.
Here's a screenshot of the current behavior:
(source: tubtub.de)
And how I'd like it to have:
(source: tubtub.de)
I'm inserting the headerView in viewDidLoad as follows:
- (void)viewDidLoad
{
[super viewDidLoad];
UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 44)];
headerView.backgroundColor = [UIColor redColor];
self.tableView.tableHeaderView = headerView;
}
Any help or hint is highly appreciated. Thanks!
EDIT: I made it working by utilizing UIScrollViewDelegate and subclassing UITableView. Check it out on the github repo provided.
You can use setContentOffset: by headerView height.
This contentOffset will only happen when you have enough number of data to be off by your headerView height. i.e) If tableView is not scrollable because you have only few data like one in your screenshot, the headerView is still visible. However if you have lots of number of data that can't not be displayed in the screen it will have contentOffset.
Try this with 20 rows. You will see what I mean.
UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 44)];
headerView.backgroundColor = [UIColor redColor];
self.tableView.tableHeaderView = headerView;
[self.tableView setContentOffset:CGPointMake(0, 44)];
With only 3 rows, this contentOffset won't work and it might be desired behavior in your case because you don't want to hide the searchBar when you have extra space to display.
I came up with implementing my own solution.
I utilize UIScrollViewDelegate and came up with a subclass of UITableView for calculating the contentSize dynamically.
Take a look at the github repo here.
I would double check the frame for the table itself. By setting the headerView's frame to start at 0,0, you are specifying that it should have its origin in the top left of the the view that is designated for the table.
I have a UITableViewCell in which I would like to draw some lines (say a 2pt line at 1/3rd from top of the TableCell covering the whole width). The lines would always be in the same place within the tableview cell.
One straightforward solution is to just have a -drawRect method that will use CGContextStrokePath to draw the line. But that seems to be like an overkill since it would call drawRect everytime which is inefficient.
I would think that there would be a way to be able to cache it somehow, so that all tableview cells are created with the lines by default. One way I can think of is to create 2pt*2pt png file and add it to a UIImageView on top of the tableview cell. Any other ways?
Try this -
Add this code in your cellForRowAtIndexPath, just adjust y position og this image view-
UIImageView *seperatedImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 49, 320, 1)];
seperatedImageView.backgroundColor = [UIColor colorWithRed:201.0/255.0 green:250.0/255.0 blue:152.0/255.0 alpha:1.0];
[cellBackView addSubview:seperatedImageView];
Another option is, to add a UIView and set its background color. For example:
UIView *lineView = [[[UIView alloc] initWithFrame:CGRectMake(0,0,cell.contentView.bounds.size.width, 2)] autorelease];
lineView.backgroundColor = [UIColor grayColor];
[cell.contentView addSubview:lineView];
You can just add a UIView like a subView of your UITableViewCell.
I am doing a slide menu using a UITableView and I have 2 options on the menu and I want to put a button at the bottom like in this image:
I try to do that add a tableFooterView like that.
UIView *footerView = [[UIView alloc] initWithFrame:CGRectMake(0, 500, 320, 70)];
footerView.backgroundColor = [UIColor blackColor];
self.tableView.tableFooterView = footerView;
However, the view appears just after the second cell, but I want it at the bottom.
Thanks for help.
No you shouldn't add any empty cells, that's just hacky. If you really need the button to be at the bottom, you should use layoutSubviews to control the frame of the tableView and the footerView.
- (void)layoutSubviews
{
[super layoutSubviews];
self.tableView.frame = // top 80% of the screen
self.footerView.frame = // bottom 20% of the screen
}
You should know that every UITableViewCell has its height and footer is part of a UITableView and will appear at the bottom of a UITableView. If you want to make your UITableView look like what that image shows, you should make sure that your cells are high enough to make sure that your UITableView are high enough so that footer will appear at the bottom of UITableView
My suggestion is to add extra "empty" cell(I mean a cell with no content but has a height).
Add a Container View with View Controller from storyboard. You can use autoresizing to set the buttons on right place.
I want to display a double bordered like following image...
The border has a dark color (magenta) and a light color (white) (not the actual colors).
I have created a custom .xib file and a custom class extending UITableViewCell for my table view cells.
self.tableView.separatorColor = [UIColor whiteColor];
Then in the custom table view class, I did this...
- (void)awakeFromNib
{
[super awakeFromNib];
UIView *cellBottom = [[UIView alloc] initWithFrame:CGRectMake(0, self.bounds.size.height, self.bounds.size.width, 1.0f)];
cellBottom.backgroundColor = [UIColor magentaColor]; //
[self addSubview:cellBottomView];
// ... other code
}
I got the following result... there seems to be some gap between backgroundColor and separatorColor.
Why is this happening? The height of UIView has been set to 1 and is positioned at the bottom of UIView as well.
If there is some better solution to this could somebody throw some light on that?
Michal Zygar is partially correct.
Make sure your -(NSInteger)tableView:(UITableView*) heightForRowAtIndexPath:(NSIndexPath*) is correctly set to the height of the view. It doesn't automatically do that for you.
The other tip I would suggest as I do it myself, is to NOT use separators. Set your separator to none, and then add in two 1px-heigh views at the top and bottom of the cell in the XIB file.
Make sure to set the autosizing for the bottom two to stick only to the bottom edge, just in case you want to change the cell's height!