I am trying to create a Card Based News feed (Similar to Facebook app) in iOS.I'm implementing programmatically because the height of UITablecell has to increase/decrease based on the data.
Consider i have one UIlabel and one UIImageView added, then the height of UITablecell should be adjusted based on the fields. If one more text feild is added then height has to increase and if imageview is removed then height has to decrease.
The issue here is I couldn't to add CustomView on the UItablecell programmatically but when i create using Interface builder then its working fine but the height remains constant which i don't want to have.
Can some one please help me out.
TableViewCell.h
#interface TableViewCell : UITableViewCell
#property (strong,nonatomic) UIView *customView;
#property (strong,nonatomic) UILabel *customLabel;
#property (strong,nonatomic) UIImageView *customImage;
#end
TableViewCell.m
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
// configure control(s)
[self addSubview:self.customView];
[self.customView addSubview:self.customLabel];
[self.customView addSubview:self.customImage];
}
return self;
}
- (UIView *)customView
{
if (!_customView)
{
_customView = [[UIView alloc] initWithFrame:CGRectMake(0, 10, self.contentView.frame.size.width, 50)];
[_customView setTranslatesAutoresizingMaskIntoConstraints:NO];
}
return _customView;
}
- (UIImageView *)customImage
{
if (!_customImage)
{
_customImage = [UIImageView new];
_customImage.clipsToBounds = YES;
[_customImage.layer setBorderColor: [[UIColor grayColor] CGColor]];
[_customImage.layer setBorderWidth: 1.0];
_customImage.contentMode = UIViewContentModeCenter;
[_customImage setTranslatesAutoresizingMaskIntoConstraints:NO];
}
return _customImage;
}
- (UILabel *)customLabel
{
if (!_customLabel)
{
_customLabel = [UILabel new];
[_customLabel setTranslatesAutoresizingMaskIntoConstraints:NO];
}
return _customLabel;
}
UITableVIewController.m
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath: (NSIndexPath *)indexPath
{
static dispatch_once_t onceToken;
dispatch_once(&onceToken, ^{
if (!_stubCell)
{
_stubCell = [tableView dequeueReusableCellWithIdentifier:#"TableCell"];
}
});
CGFloat height = [_stubCell.contentView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height;
return height + 1;
}
- (CGFloat)tableView:(UITableView *)tableView estimatedHeightForRowAtIndexPath:(NSIndexPath *)indexPath
{
return 50.f;
}
- (UITableViewCell *)tableView:(UITableView *)theTableView cellForRowAtIndexPath: (NSIndexPath *)indexPath
{
static NSString *cellIdentifier = #"TableCell";
// Similar to UITableViewCell, but
_stubCell = (TableViewCell *)[theTableView dequeueReusableCellWithIdentifier:cellIdentifier];
if (_stubCell == nil) {
_stubCell = [[TableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];
}
// Just want to test, so I hardcode the data
_stubCell.customLabel.text = #"Testing";
return cell;
}
I think it may be better to create multiple nibs for the same class UITableViewCell, one for each of the possible layouts that you need. Depending on which nib is used then set heightForRowAtIndexPath to the height of the nib.
This will give you predictability of the layout for each situation and you connect only the fields defined in UITableViewCell in cellForRowAtIndexPath.
never mind i found answer by myself. I am calculating the height of each UIView that is added the super view. Based on the total height the UITableview height increases and decrease and also using auto layout adjusting the layout constraints made me simple.
I am still working on the design once its done i'll post the code so that it will be help ful for other developers.
Related
Hi i am new for ios and in my app i have created one UITableView and i have set background image for UITableViewcell but image not filling the whole width of screen as like below screen. Why this problem is occuring?
I mean UITableViewCell left and right sides gap is coming images is not filling whole cell width.
please help me someone
my code:-
#import "TableViewController.h"
#interface TableViewController ()
{
UITableView * tableList;
TableCell * Cell;
}
#end
#implementation TableViewController
- (void)viewDidLoad {
[super viewDidLoad];
tableList = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, [[UIScreen mainScreen]bounds].size.width, [[UIScreen mainScreen]bounds].size.height) style:UITableViewStylePlain];
tableList.delegate = self;
tableList.dataSource = self;
tableList.separatorStyle = UITableViewCellSeparatorStyleNone;
[self.view addSubview:tableList];
}
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
return 1;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
return 10;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *simpleTableIdentifier = #"MyCell";
Cell = (TableCell *)[tableList dequeueReusableCellWithIdentifier:simpleTableIdentifier];
if (Cell == nil)
{
NSArray *nib = [[NSBundle mainBundle] loadNibNamed:#"TableCell" owner:self options:nil];
Cell = [nib objectAtIndex:0];
}
//UIImageView *imageBackground = [[UIImageView alloc] init];
if (indexPath.row == 0) {
Cell.backGroundImage.image = [UIImage imageNamed:#"cell_top.png"];
} else if (indexPath.row == 9) {
Cell.backGroundImage.image = [UIImage imageNamed:#"cell_bottom.png"];
} else {
Cell.backGroundImage.image = [UIImage imageNamed:#"cell_middle.png"];
}
//imageBackground.contentMode = UIViewContentModeScaleToFill;
//Cell.backgroundView = imageBackground;
return Cell;
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
return 44.0;
}
-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath{
if ([cell respondsToSelector:#selector(setSeparatorInset:)]) {
[cell setSeparatorInset:UIEdgeInsetsZero];
}
if ([cell respondsToSelector:#selector(setPreservesSuperviewLayoutMargins:)]) {
[cell setPreservesSuperviewLayoutMargins:NO];
}
if ([cell respondsToSelector:#selector(setLayoutMargins:)]) {
[cell setLayoutMargins:UIEdgeInsetsZero];
}
}
#end
Try to set the layoutMargins property of the cells and the UITableView to UIEdgeInsetsZero.
- (void) viewDidLayoutSubviews {
[super viewDidLayoutSubviews];
tableList.layoutMargins = UIEdgeInsetsZero;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
[...]
Cell.layoutMargins = UIEdgeInsetsZero;
return Cell;
}
Also check for the contentMode of the UIImageview.
Cell.backGroundImage.contentMode = UIViewContentModeScaleAspectFill;
try set contentInset on Left = 0
self.tableView.contentInset = UIEdgeInsetsMake(0, 0, 0, 0);
Use Debug View Hierarchy to figure out UITableView, UITableViewCell or UIImage is not filling the whole width of screen
http://www.raywenderlich.com/98356/view-debugging-in-xcode-6
Please check your "TableCell" in the storyboard. Did you select custom insets option for your custom cell?
Rather than setting up your table view with code, you want to do this in a storyboard. Then you'll want to use auto layout to connect constraints from the table view to the view controller's view. There are lots of tutorials available to teach you how to do this. Learning this will make things much easier in the long run.
Change the name of your tableList property to tableView. That will make more sense to other developers (including yourself in the future), since that's what it is (a UITableView instance).
Your cell is named Cell with a capital C, but you don't want to name properties with capital letters. Also, it doesn't need to be a class property the way it's being used. Remove it from the #interface section.
Coding Guidelines for Cocoa
Remove the -numberOfSectionsInTableView: method. The default is 1, so you don't need code to return the default value.
Instead of -dequeueReusableCellWithIdentifier:, use -dequeueReusableCellWithIdentifier:forIndexPath:. Then you won't need to follow it with a test to see if a cell was returned (it always will be). You'll need to register your nib with -registerNib:forCellReuseIdentifier:. Or better yet, just design it in the storyboard.
It appears that your custom table view cell has a UIImageView named backGroundImage. That should be added as a subview to the cell's backgroundView property (which you'll need to create - the view, not the property, which is already part of UITableViewCell). Set the image view's autoresizingMask so it will resize with the backgroundView:
- (void)awakeFromNib
{
[super awakeFromNib];
self.backgroundView = [[UIView alloc] initWithFrame:self.bounds];
self.backGroundImage.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
self.backGroundImage.frame = self.backgroundView.bounds;
[self.backgroundView addSubview:self.backGroundImage];
}
Remove the -tableView:heightForRowAtIndexPath: method. You only want to use this if you return different values. The default row height is 44.0, so you don't need to do anything else.
I've got a table view where the cells are created as follows:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:#"Cell" forIndexPath:indexPath];
cell.textLabel.text = #"TempTitle";
cell.textLabel.font = [UIFont fontWithName: #"AppleSDGothicNeo-Bold" size:16.0];
[cell setSelectionStyle:UITableViewCellSelectionStyleNone];
UILabel *numberLabel = [[UILabel alloc] init];
[numberLabel setFrame:CGRectMake(230.0, 5.0, 40.0, 30.0)];
[numberLabel setText:[NSString stringWithFormat:#"%#", [self.arrayOne objectAtIndex:indexPath.row]]];
UIButton *buttonDown = [[UIButton alloc] init];
[buttonDown setFrame:CGRectMake(190.0, 5.0, 40.0, 30.0)];
buttonDown.tag = indexPath.row;
[buttonDown addTarget:self action:#selector(quantityDown:) forControlEvents:UIControlEventTouchUpInside];
UIButton *buttonUp = [[UIButton alloc] init];
[buttonUp setFrame:CGRectMake(270.0, 5.0, 40.0, 30.0)];
[cell addSubview:buttonDown];
[cell addSubview:numberLabel];
[cell addSubview:buttonUp];
return cell;
}
where self.arrayOne (name changed for this thread) holds integer values that are displayed in each cell. The method when buttonDown is selected is as following:
- (void) quantityDown:(id)sender {
int clicked = ((UIButton *)sender).tag;
... math to lower int by one and save the new value in arrayOne
... this part works just fine. The value does go down, as intended.
[self.tableView reloadData];
}
When the tableView reloads, a new label is printed on top of the existing label in that cell, as can be seen in the image below:
I can only assume that new buttons are being printed on top of the existing ones as well. This is both expensive and makes the numbers unreadable (especially if you change it multiple times!). Leaving the view and coming back to it shows the new numbers cleanly, but only until you start changing them again.
A similar effect happens when I use the UISegmentedControl at the top. Selecting one or the other changes the contents of the table and runs [self.tableView reloadData]. The textLabel for each cell reloads just fine when this method is called, but the sub views do not reload, and instead stack upon one another.
How would I go about writing this so that there is only ever one subview in each cell, instead of multiple stacked upon one another? Something speedy and not expensive on resources. Maybe removing all subviews and then adding the new ones? I tried something like
[[cell.contentView viewWithTag:tagVariable]removeFromSuperview];
to no avail. Really, I only need to modify the one cell in the table that the user is clicking in. Except for when the user uses the UISegmentedControl at the top, then all the cells need to be modified.
Thanks in advance.
EDIT 1:
Created a custom UITableViewCell class...
#interface SSCustomTableViewCell : UITableViewCell
#property (nonatomic) UILabel *quantity;
#property (nonatomic) UIButton *down;
#property (nonatomic) UIButton *up;
#end
#implementation SSWeightsTableViewCell
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
self.quantity = [UILabel new];
[self.contentView addSubview:self.quantity];
self.down = [UIButton new];
[self.contentView addSubview:self.down];
self.up = [UIButton new];
[self.contentView addSubview:self.up];
}
return self;
}
- (void) layoutSubviews {
[super layoutSubviews];
[self.down setFrame:CGRectMake(190.0, 5.0, 40.0, 30.0)];
[self.down setBackgroundColor:[UIColor purpleColor]];
[self.up setFrame:CGRectMake(270.0, 5.0, 40.0, 30.0)];
[self.up setBackgroundColor:[UIColor purpleColor]];
[self.quantity setFrame:CGRectMake(230.0, 5.0, 40.0, 30.0)];
[self.quantity setTintColor:[UIColor purpleColor]];
}
#end
and then in my UITableView class...
#import "SSCustomTableViewCell.h"
- (void)viewDidLoad
{
[super viewDidLoad];
[self.tableView
registerClass:[SSCustomTableViewCell class]
forCellReuseIdentifier:NSStringFromClass([SSCustomTableViewCell class])
];
}
and
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
UITableViewCell *cell = [tableView
dequeueReusableCellWithIdentifier: NSStringFromClass([SSWeightsTableViewCell class])
forIndexPath:indexPath
];
}
but now all I see is the following...
where the subviews are not correctly laid out, nor are they the correct size. Also, within the cellForRowAtIndexPath method, I cannot access the cell's components. When I enter
cell.quantity
I get an error saying that "Property 'quantity' not found on object of type UITableViewCell*"
So I tried
SSCustomTableViewCell *cell = [tableView
dequeueReusableCellWithIdentifier: NSStringFromClass([SSWeightsTableViewCell class])
forIndexPath:indexPath
];
and the error goes away, but it still looks the same when I run it.
Edit 2: Working Solution
All I had to do was add
cell = [[UITableViewCell alloc]init];
within the cellForRowAtIndexPath method. Everything else stayed the same, and no custom classes required.
You are seeing this error because cell instances are reused. If you add a view each time you configure the cell, you will be adding to cells that already have the subviews on them. You should create your own subclass of UITableViewCell and add the subviews to it in init. Then your method above would just set the values on the various subviews.
Your cell would look something like this:
#interface MyCustomCell : UITableViewCell
#property (nonatomic, strong) UILabel *myCustomLabel;
#end
#implementation MyCustomCell
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
self.myCustomLabel = [UILabel new];
[self.contentView addSubview:self.myCustomLabel];
}
return self;
}
- (void)layoutSubviews
{
[super layoutSubviews];
// Arrange self.myCustomLabel how you want
}
#end
Then your view controller would look like this:
- (void)viewDidLoad
{
[super viewDidLoad];
[self.tableView
registerClass:[MyCustomCell class]
forCellReuseIdentifier:NSStringFromClass([MyCustomCell class])
];
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
UITableViewCell *cell = [tableView
dequeueReusableCellWithIdentifier:NSStringFromClass([MyCustomCell class])
forIndexPath:indexPath
];
cell.myCustomLabel.text = #"blah";
return cell;
}
Try this in cell configure method, this will make sure objects doesn't overlap
for (UIView *subview in [cell.contentView subviews]) {
[subview removeFromSuperview];
}
example:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *cellId = #"cellId";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellId];
if (cell==nil) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellId];
}
for (UIView *subview in [cell.contentView subviews]) {
[subview removeFromSuperview];
}
return cell;
}
Hope this will help
I created several cells with Interface Builder, and I'm using them to fill a UITableView. In other words, I have 3 classes for 3 different kinds of cell, and an other view which contains a UITableView.
- My UITableView containing different kinds of cells :
Here's my problem :
On the iPhone emulator, it looks great. But on the iPad emulator, the custom cells width is fixed. The UITableView width fits to the screen width, so it's good, but the UITableViewCells does not fit to the UITableView. I want to force the custom UITableViewCells to take the UITableView width.
Is there anything to do in - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPathmethod, where I instanciate my custom cells ?
Or do I have to write a thing like self.fitToParent; in the custom cells header file ?
EDIT (schema) :
EDIT 2 (cellForRowAtIndexPath method) :
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *cellIdentifierType1 = #"cellType1";
static NSString *cellIdentifierType2 = #"cellType2";
NSString *currentObjectId = [[myTab objectAtIndex:indexPath.row] type];
// Cell type 1
if ([currentObjectId isEqualToString:type1])
{
CelluleType1 *celluleType1 = (CelluleType1 *)[tableView dequeueReusableCellWithIdentifier:cellIdentifierType1];
if(celluleType1 == nil)
celluleType1 = [[CelluleType1 alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifierType1];
celluleType1.lblAuteur.text = #"Type1";
return celluleType1;
}
// Cell type 2
else if ([currentObjectId isEqualToString:type2])
{
CelluleType2 *celluleType2 = (CelluleType2 *)[tableViewdequeueReusableCellWithIdentifier:cellIdentifierType2];
if(celluleType2 == nil)
celluleType2 = [[CelluleType2 alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifierType2];
celluleType2.lblAuteur.text = #"Type2";
return celluleType2;
}
else
return nil;
}
}
I think uitableviewcell's width is the same as the tableview's width.You can try to set cell's background color to test it. cell.backgroundColor = [UIColor redColor] ;
You should create a class which inherit from UITableViewCell and override it's method - (void)layoutSubviews , adjust your content's frame there.
I resolved my problem using the following code in each custom cell class. It's not very clean, but I can't spend one more day on this issue...
- (void)layoutSubviews
{
CGRect contentViewFrame = self.contentView.frame;
contentViewFrame.size.width = myTableView.bounds.size.width;
self.contentView.frame = contentViewFrame;
}
Thank you for your help KudoCC.
- (void)awakeFromNib {
[super awakeFromNib];
// anything you write in this section is taken with respect to default frame of width 320.
}
awakeFromNib is called when [tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath]; is processed- anything you write in section is taken with respect to default frame of width 320.
You need to make another custom function and call it after cell gets initialized.
For eg:-
#implementation CheckinTableViewCell{
UILabel *NameLabel;
UILabel *rollLabel;
}
- (void)awakeFromNib {
[super awakeFromNib];
NameLabel = [[UILabel alloc] initWithFrame:CGRectZero];
rollLabel = [[UILabel alloc] initWithFrame:CGRectZero];
[self.contentView addSubview:NameLabel];
[self.contentView addSubview:rollLabel];
}
-(void) bindView{
NameLabel.frame = CGRectMake(10, 10, self.contentView.frame.size.width-20, 20);
rollLabel.frame = CGRectMake(10, 30, NameLabel.frame.size.width, 20);
}
and call this function in tableview cellForRowAtIndex:-
-(UITableViewCell*) tableView: (UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
static NSString *CellIdentifier = #"Cell";
CheckinTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath];
if(cell ==nil){
cell = [[CheckinTableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
}
cell.name = #"Harry";
cell.rollno = #"123456";
[cell bindView];
return cell;
}
I am trying to create a (not very) custom UITableView with a button on the left side of the cell, and text to the right of the button.
I try to calculate where to put the UILabel that is part of the cell but changing the frame has no effect (and it doesn't even appear to be computed -- all zeros).
My question is: when is the frame size for the label computed? (So that changes will have an effect).
Is this the right way to do it?
Code snippets below.
First is from the cell init (called in response to the dequeueReusable...
and yes, 'buttonColor', 'onTapSel', 'buttonFrame', and 'buttonColor' are "member variables (File static globals)
- (id)initWithStyle: (UITableViewCellStyle)style
reuseIdentifier: (NSString *)reuseIdentifier
{
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (nil == buttonColor)
{ buttonColor = kDefaultCellButtonColor; }
if (nil == onTapSel)
{ onTapSel = #selector(defaultCellButtonTapped:); }
if (self)
{
EGCellButton * cellButton = (EGCellButton *)[[EGCellButton alloc ] initWithFrame:buttonFrame ];
cellButton.backgroundColor = buttonColor;
[cellButton setTitle:buttonLabel forState:UIControlStateNormal];
[cellButton addTarget:self action:(onTapSel) forControlEvents: UIControlEventTouchUpInside];
[self setCellButton:cellButton];
float xx = buttonFrame.origin.x + buttonFrame.size.width + 5;
CGRect frame = self.textLabel.frame;
frame.origin.x += xx;
self.textLabel.frame = frame;
[self addSubview:cellButton];
}
return self;
}
and now from the cellForRowAtIndexPath:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = #"EGButtonTableCellID";
EGButtonTableCell * cell = (EGButtonTableCell *) [tableView dequeueReusableCellWithIdentifier:CellIdentifier forIndexPath:indexPath];
cell.cellButton.indexPath = indexPath;
// Configure the cell...
cell.textLabel.text = #"abcdefghijklmnopqrstuvwxyz";
float xx = cell.cellButton.frame.origin.x + cell.cellButton.frame.size.width + 5;
CGRect frame = cell.textLabel.frame;
frame.origin.x += xx;
cell.textLabel.frame = frame;
return cell;
}
The result being that the button appears on the left side of the cell (as intended), but the first letter I see in the label is 'g', so the first 6 chars are hidden behind the button (not intended).
When I dump the values in the frame, all except origin.x are zero in both methods.
This should work, yes? no? why not? etc.
Thank you all very much!
:bp:
Set frame for your UILabel and UIButton in layoutSubviews method of your custom UITableViewCell
See Apple Documentation on the subject:
Subclasses can override this method as needed to perform more precise
layout of their subviews. You should override this method only if the
autoresizing and constraint-based behaviors of the subviews do not
offer the behavior you want. You can use your implementation to set
the frame rectangles of your subviews directly.
You can create a custom UITableViewCell, access objects in the class or implement methods.
CustomCell.h
#import <UIKit/UIKit.h>
#interface CustomCell : UITableViewCell
#property (nonatomic, retain) UILabel *customCellLabel;
#property (nonatomic, retain) UIButton *customCellButton;
#end
CustomCell.m
#import "TLCell.h"
#implementation CustomCell
#synthesize customCellLabel, customCellButton
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
if (self) {
customCellLabel = [[UILabel alloc] init];
customCellLabel.frame = CGRectMake(180, 0, 60, 30);
[self addSubview:customCellLabel];
customCellButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
customCellButton.frame = CGRectMake(0, 0, 60, 30);
[self addSubview:customCellButton];
}
return self;
}
#end
CustomTableView.m
/* --- */
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *cellIdentifier = #"Cell";
CustomCell *cell = (CustomCell *)[tableView dequeueReusableCellWithIdentifier:cellIdentifier];
if (cell==nil) {
cell = [[CustomCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];
}
[cell.customLabel setText:#"hello"];
// [cell.
[cell.customButton addTarget:self action:#selector(yourMethod:) forControlEvents:UIControlEventTouchUpInside];
}
/* --- */
I create a UITableView with different types of UITableViewCell depending on the type of content to display. One of this is a UITableViewCell with inside an UITextView programmatically created in this way:
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
...
if([current_field.tipo_campo isEqualToString:#"text_area"])
{
NSString *string = current_field.valore;
CGSize stringSize = [string sizeWithFont:[UIFont boldSystemFontOfSize:15] constrainedToSize:CGSizeMake(320, 9999) lineBreakMode:UILineBreakModeWordWrap];
CGFloat height = ([string isEqualToString:#""]) ? 30.0f : stringSize.height+10;
UITextView *textView=[[UITextView alloc] initWithFrame:CGRectMake(5, 5, 290, height)];
textView.font = [UIFont systemFontOfSize:15.0];
textView.text = string;
textView.autoresizingMask = UIViewAutoresizingFlexibleWidth;
textView.textColor=[UIColor blackColor];
textView.delegate = self;
textView.tag = indexPath.section;
[cell.contentView addSubview:textView];
[textView release];
return cell;
}
...
}
Since the text view is editable the cell that contains it should change its height to correctly fit the text view sizes. Initially I did this by resizing the UITextView inside the method textViewDidChange:, in this way:
- (void)textViewDidChange:(UITextView *)textView
{
NSInteger index = textView.tag;
Field* field = (Field*)[[self sortFields] objectAtIndex:index];
field.valore = textView.text;
[self.tableView beginUpdates];
CGRect frame = textView.frame;
frame.size.height = textView.contentSize.height;
textView.frame = frame;
newHeight = textView.contentSize.height;
[self.tableView endUpdates];
}
I save the new height of text view in a variable and then when tableView:heightForRowAtIndexPath: method is called, I resize the cell in this way:
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
...
if ([current_field.tipo_campo isEqualToString:#"text_area"])
{
return newHeight +10.0f;
}
else
return 44.0f;
...
}
In this way both are resized but is not done in sync, ie first the TextView is resized and then it is resized the height of the cell, so for an instant the user see that the text view is larger than the cell. How can I fix this bad behavior?
I have created one demo for your problem, hope will help you.
My idea of solution is using AutoResizingMask of UITextView.
My .h file
#import <UIKit/UIKit.h>
#interface ViewController : UIViewController<UITabBarDelegate, UITableViewDataSource, UITextViewDelegate>{
IBOutlet UITableView *tlbView;
float height;
}
#end
And my .m file (Includes only required methods)
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
height = 44.0;
}
- (void)textViewDidChange:(UITextView *)textView{
[tlbView beginUpdates];
height = textView.contentSize.height;
[tlbView endUpdates];
}
#pragma mark - TableView datasource & delegates
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return 1;
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
if (indexPath.row==0) {
if (height>44.0) {
return height + 4.0;
}
}
return 44.0;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
UITableViewCell *cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:#"CellIdentifier"];
UITextView *txtView = [[UITextView alloc] initWithFrame:CGRectMake(0.0, 2.0, 320.0, 40.0)];
[txtView setDelegate:self];
[txtView setAutoresizingMask:UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight]; // It will automatically resize TextView as cell resizes.
txtView.backgroundColor = [UIColor yellowColor]; // Just because it is my favourite
[cell.contentView addSubview:txtView];
return cell;
}
Hope it will help you out.
To resize the cells you would use code similar to this
- (BOOL)textView:(UITextView *)textView shouldChangeTextInRange:(NSRange)range replacementText:(NSString *)text {
NSString *newText = [textView.text stringByReplacingCharactersInRange:range withString:text];
CGSize size = // calculate size of new text
CGRect frame = textView.frame;
frame.size.height = textView.contentSize.height;
textView.frame = frame;
if ((NSInteger)size.height != (NSInteger)[self tableView:nil heightForRowAtIndexPath:nil]) {
// if new size is different to old size resize cells.
[self.tableView beginUpdates];
[self.tableView endUpdates];
}
return YES;
}
Set the TextView Frame With An Animation ..so that it syncs with the cell's animation of expanding height
Check this out: UIView Contentmode - play with the values like:
cell.contentMode = //...//
- (void)textViewDidChange:(UITextView *)textView
{
UITableViewCell *cell = (UITableViewCell*)textView.superview.superview;
if (cell.frame.size.height < textView.contentSize.height) {
[self.tableView beginUpdates];
CGRect frame = textView.frame;
frame.size.height = textView.contentSize.height;
textView.frame = frame;
CGRect cellFrame = cell.frame;
cellFrame.size.height = textView.frame.size.height;
cell.frame = cellFrame;
[self.tableView endUpdates];
}
}
Siba Prasad Hota's code probably will do the trick (You need reference to table view from cell level), but I have another, longer approach. I always do such stuff in this way, because I like to have all things separated (MVC pattern).
If I were You, I would do this like that (code from head):
Cell parent protocol:
#protocol CellParent <NSObject>
#required
#property (nonatomic, strong) UITableView *tableView;
#end
Cell model:
#interface CellModel
#property (nonatomic, assign) BOOL hasTextView;
#property (nonatomic, strong) NSString *textViewContent;
-(float)getCurrentHeightForCell;//implement calculating current height of cell. probably 2 * SOME_MARGIN + height of temporary textView with textViewContent variable
Cell
#interface MyCell
#property (nonatomic, strong) CellModel *dataModel;
#property (nonatomic, weak) id<CellParent> parent;
#property (nonatomic, strong) UITextView *textView;
- (id)initWithStyle:(UITableViewCellStyle)style andModel:(CellModel*) model;
with implementations like this:
(id)initWithStyle:(UITableViewCellStyle)style andModel:(CellModel*) model
{
self = [super initWithStyle:style reuseIdentifier:#"MyCell"];
if (self)
{
[[NSBundle mainBundle] loadNibNamed:#"MyCell" owner:self options:nil];
self.dataModel = model;
}
return self;
}
-(void) setDataModel:(CellModel *)dataModel
{
_dataModel = dataModel;
if(_dataModel.hasTextView)
{
//show text view
}
else
{
//hide text view
}
//do other cell modifications
}
-(BOOL)textView:(UITextView *)textView shouldChangeTextInRange:(NSRange)range replacementText:(NSString *)text
{
self.dataModel.textViewContent = textView.text;
[self.parent.tableView beginUpdates];
[self.parent.tableView endUpdates];
return YES;
}
Controller with table view
-(UITableViewCell*) tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
MyCell *cell = [tableView dequeueReusableCellWithIdentifier:#"MyCell"];
if (cell == nil)
{
cell = [[MyCell alloc] initWithStyle:UITableViewCellStyleDefault andModel: [self.cellsModels objectAtIndex:indexPath.row]];
}
cell.dataModel = [self.cellsModels objectAtIndex:indexPath.row];
cell.parent = self;
return cell;
}
-(CGFloat) tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
return [((CellModel*)[self.tableContentArray objectAtIndex:indexPath.row]) getCurrentHeightForCell];
}
You should calculate newHeight for cell before loading cell. Instead of calculating newHeight in textViewDidChange, calculate it in heightForRowAtIndexPath and return same as
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
if ([current_field.tipo_campo isEqualToString:#"text_area"])
{
NSString *string = current_field.valore;
CGSize stringSize = [string sizeWithFont:[UIFont boldSystemFontOfSize:15] constrainedToSize:CGSizeMake(320, 9999) lineBreakMode:UILineBreakModeWordWrap];
CGFloat height = ([string isEqualToString:#""]) ? 30.0f : stringSize.height+10;
return height + 10.0f;
}
else
{
return 44.0f;
}
}
I would not bother with cells height using method
(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
and rather made your view text field delegate and handle the following event in a way shown below:
- (void) textFieldDidResize:(id)sender
{
[self.tableView beginUpdates];
[self.tableView endUpdates];
}
Also make sure that you did the following:
yourInputField.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
Then, the only one thing you need is to resize your text field. Your cells in tableview will adopt to the size of inner text field. Just add it as subview to cell.contentView.