I need UITableViewCell in a dynamic height depends on the content length.
This is a prototype cell
And the content shows fine when first loaded like this
But when I scroll the UITableView, the cell's content breaks like this, especially for UIImageView.
In the implementation of the cell, I only used setImage and setText method.
What seems the problem? Or, is there another way to set each cell's height differently after viewDidLoad?
** Edit: this is my implementation of cellForRowAtIndexPath
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
NotificationCell *cell = [tableView dequeueReusableCellWithIdentifier:#"notification"];
if(!cell) {
[tableView registerNib:[UINib nibWithNibName:#"NotificationCell" bundle:nil] forCellReuseIdentifier:#"notification"];
cell = [tableView dequeueReusableCellWithIdentifier:#"notification"];
}
[cell setContent:[notifications objectAtIndex:indexPath.row]];
[cell layoutIfNeeded];
return cell;
}
And setContent in NotificationCell.m has only setText and setImage
Because the tableView already has an imageView property and it is on the left side of the cell, you set the image to that imageView. You should rename the outlet of your custom imageView. So, it should be not called imageView, give the other name for it.
I found a weird white space on UITableView for iPhone 6 Simulator (iOS 8) on Xcode 6 GM. I have tried to set the SeparatorInset from both storyboard and also the code, but the white space is till there.
The following code works on iOS 7 but not on iOS 8 (iPhone 6 simulator).
-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath{
if ([tableView respondsToSelector:#selector(setSeparatorInset:)]) {
[tableView setSeparatorInset:UIEdgeInsetsZero];
}
}
I attached screenshot below:
I am using AutoLayout by the way. I hope someone can show me a way to remove the weird white space on the TableView.
Thanks Student for pointing me to the right direction with the comment "Try this self.myTableView.layoutMargins = UIEdgeInsetsZero;" This line of code will only work on iOS 8 because layoutMargins is only available from iOS 8. If I run the same code on iOS 7, it will crash.
#property(nonatomic) UIEdgeInsets layoutMargins
Description The default spacing to use when laying out content in the view.
Availability iOS (8.0 and later)
Declared In UIView.h
Reference UIView Class Reference
Below is the right answer to solve this weird white space by setting the tableview layoutMargins and cell layoutMargins as UIEdgeInsetsZero if it exists (for iOS 8). And it will not crash on iOS 7 as well.
-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath{
if ([tableView respondsToSelector:#selector(setSeparatorInset:)]) {
[tableView setSeparatorInset:UIEdgeInsetsZero];
}
if ([tableView respondsToSelector:#selector(setLayoutMargins:)]) {
[tableView setLayoutMargins:UIEdgeInsetsZero];
}
if ([cell respondsToSelector:#selector(setLayoutMargins:)]) {
[cell setLayoutMargins:UIEdgeInsetsZero];
}
}
See the screen shot below:-
Try to create a UITableViewCell class category and add this getter
- (UIEdgeInsets)layoutMargins {
return UIEdgeInsetsZero;
}
in iOS7 this will not be called cos there's no this property in SDK,and will not cause any crash;
in iOS8 this will be called every time you use the cell
It works for me
My solution with just three lines of code:
-(UITableViewCell*)tableView:(UITableView*)tableView cellForRowAtIndexPath:(NSIndexPath*)row{
//
// ... your code ...
//
if ([cell respondsToSelector:#selector(preservesSuperviewLayoutMargins)]){
cell.layoutMargins = UIEdgeInsetsZero;
cell.preservesSuperviewLayoutMargins = false;
}
return cell;
}
IOS8 introduce a new concept named Configuring Content Margins , a new property named layoutMargins is also introduced , for the details of the property , please refer to the Apple Doc . The type of layoutMargins is UIEdgeInsets , by default the value is {8,8,8,8} . To remove the seperator line of TableView in IOS8 , in addition to set tableView.seperatorInset = UIEdgeInsetsZero , you must also do as :
First define the macro
#define isIOS8SystemVersion (NSFoundationVersionNumber > NSFoundationVersionNumber_iOS_7_1)
In the UITableViewDelegate method add :
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *reuseId = #"cellReuseID" ;
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:reuseId];
if(!cell){
cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:reuseId];
if(isIOS8SystemVersion){
cell.layoutMargins = UIEdgeInsetsZero;
cell.preservesSuperviewLayoutMargins =NO ;
}
}
Doing these will remove the seperator line . You can also do as follow :
UITableView *tableView = [[UITableView alloc] init];
if(isIOS8SystemVersion){
tableView.layoutMargins = UIEdgeInsetsZero ;
}
and in the UITableViewDelegate method add :
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *reuseId = #"cellReuseID" ;
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:reuseId];
if(!cell){
cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:reuseId];
if(isIOS8SystemVersion){
cell.layoutMargins = UIEdgeInsetsZero;
}
}
In my case in Xcode 6.2, in addition to Will Q's answer, I have to go to Main.storyboard > select the UITableViewCell > Attributes Inspector. Change Separator dropdown list from Default Insets to Custom Insets. Change the left inset from 15 to 0.
Workaround for iOS 7 & iOS 8
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
cell.separatorInset = UIEdgeInsetsMake(0.0f, cell.frame.size.width, 0.0f, 0.0f);
}
In iOS8 you have to set the Inset both on Row and on Table level.
Row level in the cellForRowAtIndexPath:
if ([cell respondsToSelector:#selector(preservesSuperviewLayoutMargins)]){
cell.layoutMargins = UIEdgeInsetsZero;
cell.preservesSuperviewLayoutMargins = false;
}
Table level in the viewDidLoad:
[tableReference setSeparatorInset:UIEdgeInsetsZero];
After that it is a good idea to CLEAN your project. On some occasions I noted that these changes were not directly introduced in the executable App in the simulator.
for iOS 8
try by setting cell.layoutMargins = UIEdgeInsetsZero; in cellForRowAtIndexPath method
If you want to remove the white line, but keep separator inset as it is, just set the cell.backgroundColor to the tableView backgroundColor. Just setting the cell.contentView.backgroundColor does not make the problem disappear.
I've tried many ways, none of them work but this one works for me.
Add startup images for iPhone 6 and Plus. Before the images are added the phone is running in scaling mode, i.e. older Apps get scaled to fit the new screen sizes. This may be causing the lines.
The new images are Retina HD 5.5 (iPhone6Plus) 1242x2208 and Retina HD 4.7 (iPhone6) 750x1334.
See iOS 8 UITableView separator inset 0 not working
Basically, you need to set both the cell.layoutMargin as well as the tableView's layoutMargin. YMMV, but I had to set the table view up in layoutSubviews before it would work!
To make your UITableView separator insets to zero for both iOS7 and iOS8, instead of making a change in the code, make a change in the xib for the UITableView by changing the View->Mode->Aspect Fill.
I have static UITableView and wanted to shift the margin of a cell separator to the left edge.
Thanks to the above answers, this was my solution
override func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) {
// needed to shift the margin a specific cell to the left edge
if indexPath.section == 3 && indexPath.row == 0 {
cell.layoutMargins = UIEdgeInsetsZero
cell.preservesSuperviewLayoutMargins = false
cell.separatorInset = UIEdgeInsetsMake(0.0, 0.0, 0.0, 0.0)
}
}
Just add the following:
tableView.separatorStyle = .none
This is my first iOS project, so I am learning a lot and have to learn more.
I learnt that in order to fit more items on UITableViewCell, I need to subclass it and then use it. I created TransactionCell and in my ViewController I use it as
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
// make last cell visible: http://stackoverflow.com/questions/11928085/uitableview-not-visible-the-last-cell-when-scroll-down
tableView.contentInset = UIEdgeInsetsMake(0, 0, 120, 0);
[tableView registerNib:[UINib nibWithNibName:#"TransactionCell" bundle:nil] forCellReuseIdentifier:CellIdentifier];
TransactionCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath];
if (cell == nil) {
cell = [[TransactionCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:CellIdentifier];
}
TransactionModel *transactionModel = self.transactionsModel.transactions[(NSUInteger) indexPath.row];
cell.dateAndMonth.text = transactionModel.date;
cell.name.text = transactionModel.name;
cell.amount.text = transactionModel.amount;
cell.categoryImage.image = [self getShortImage:[UIImage imageNamed:transactionModel.category]];
cell.transactionTypeImage.image = [self getShortImage:[UIImage imageNamed:#"Debit"]];
cell.imageView.contentMode = UIViewContentModeCenter;
return cell;
}
Also, I set the height of cell as
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
return 100;
}
My xib looks like
When I run the project however, I see the following
Things don't fit up!
Question
- How do I make the labels appear completely on TransactionCell?
- How do I fit all the elements in a single row without cutting off
I am sure I need to learn something else, but not sure what
While your label is selected in the xib, go to the autoshrink section in the attributes inspector and change the option to minimum font scale, I usually set it to around 0.5.
Add three separate UILabel inside the cell and set the frame for three different size.
As #Shadowfiend told,you have to work with the auto layout and auto resizing.
Check this link: http://www.appcoda.com/self-sizing-cells/
It is nice tutorial on auto resizing the cells and well described too.
Hope it help.
I am trying to create a project with a custom UITableViewCell. The custom cells never load, they're just blank. At this point in the project what I'm trying to do is placing a UITableViewCell in a .xib, designing it the way I want and specifying its reuse identifier along with tag IDs for the components so that I can use them in code later on.
I've googled a ton and found several tutorials that look like what I want to do, along with many SO questions that have answers that seem applicable. At this point it's probably just my head spinning with too many different angles and solutions.
This is my current attempt at trying to register the custom cell with my UITableView, yet when running this on a device the rows in the table view are entirely blank.
UITableViewCell* cell = [self.tableView dequeueReusableCellWithIdentifier:#"MyCell"];
if (cell == nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:#"MyCell"];
}
UILabel* l1 = (UILabel*)[cell viewWithTag:1];
UILabel* l2 = (UILabel*)[cell viewWithTag:2];
UILabel* l3 = (UILabel*)[cell viewWithTag:3];
l1.text = #"Foobar";
l2.text = #"Foobar";
l3.text = #"Foobar";
I'm pretty certain that I've hooked up all the properties and such correctly, but at this stage I need a fresh pair of eyes to point out the facepalm for me.
The interesting files are FilmerView.m/h/xib and the cell is in FilmerViewCell.xib. When running the app this TableView is in the second tab of the tab bar controller.
Project:
http://speedy.sh/WhhpP/test12.zip
I can't provide a full answer atm but look up the tableview method. registerNib:forCellReuseIdentifier:
Also, stop using that dequeue method. Use the one that includes the indexPath.
Then you don't have to check if the cell is nil afterwards.
EDIT
In viewDidLoad (or somewhere like that)...
UINib *cellNib = [UINib nibWithNibName:#"MyCustomCellXibFileName" bundle:[NSBundle mainBundle]];
[self.tableView registerNib:cellNib forCellReuseIdentifier:#"CellIdentifier"];
Now in the table view datasource method...
- (UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:#"CellIdentifier" forIndexPath:indexPath];
// no need to check cell == nil.
// this method is guaranteed to return a non nil cell.
// if it doesn't then the program will crash telling you that you need to...
// register a class or nib (but we just did this in viewDidLoad) :D
// configure your cell here...
[self configureMyCell:(MyCustomCell *)cell atIndexPath:indexPath];
return cell;
}
- (void)configureMyCell:(MyCustomCell *)cell atIndexPath:(NSIndexPath *)indexPath
{
cell.nameLabel.text = #"Hello, world";
}
Hope this helps.
Make sure that you have set datasource and delegate properties of your tableView.
Make sure that you have implemented (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section method and it returns a positive value (>0).
Evaluate the following:
Is the ReuseIdentifier set in the XIB. See Properties Tab in Interface Builder on the right when selecting the cell.
Are the AutoresizingMasks set properly for the labels to be visible?
WrapModes: Which did you select? When having wrapmode WrapWord, is the font size too large for the text to be moved in the next line becoming invisible?
Set the background color of the UITableViewCellss content view to something else than white or transparent, as well as the background colors of the labels to see if the cell is even there.
Manually call numberOfRowsInSection on your table, pass the proper NSIndexPath identifying the target section and see if its greater 0 to confirm that the TableView even attempts to load the data, thus, the cells. ( Alternatively set a breakpoint in the method or do a NSLog. )
Do a NSLog in cellForRowAtIndexPath to confirm that the cell returned is not nil and the method is even called!
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"MyCell";
MyCustomCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath];
if (cell == nil)
cell = [[MyCustomCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
Movie *movie = [self.movies objectAtIndex:indexPath.row];
cell.title.text = movie.title;
cell.subtitle.text = movie.subtitle;
cell.subtitle.numberOfLines = 0;
[cell.subtitle sizeToFit];
return cell;
}
I am calling reloadData from two places. One is from the end of a loadInitialData function, which is called from viewDidLoad.
A second one is being called from viewDidAppear, although this is inconsequential to my problem, because it existed before it and exists without it.
I initially load 3 rows of sample data, with titles and subtitles. Now what happens is my subtitle text is vertically centered when this window first launches. If I grab the table and scroll is high up, all of a sudden my [cell.subtitle sizeToFit] goes into action, and my text goes to the top vertically, which is desired.
So my issue is... why is the text vertically centered from the beginning? reloadData doesn't work either. When I return from adding a new row, all rows but the newly added row are vertically aligned to top as they should. The new row is incorrectly vertically centered.
Why doesn't this work? Everything seems good. New data is added etc. Via NSLog statements, I have verified numberOfRowsInSection is immediately called after reloadData is called.
So why does the aligning of the text vertically to the top not work?
Thanks!
This is probably because the UITableViewCell has not yet been layed out and so it does not have a size yet. Try doing the sizeToFit in this UITableViewDelegate method
- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
I am not sure this will work, but it worth trying.
Add [cell setNeedsLayout]; before you return the cell so it will layout the cell before presentation.