I have a UITableViewCell with multiple items inside. (Not just a textView so I cant follow this option.) I'm trying to dynamically size it's height based on the content it has inside.
The heights I will be changing, are a UITextView and a UIView. The textView will constantly be changing (at another method, if you'd like, I can post it). And the UIView will change if the user clicks a button:
Here is my code:
- (void)viewDidLoad
{
self.tableView.rowHeight = UITableViewAutomaticDimension;
}
- (IBAction)thisButton:(id)sender
{
CGRect frame = self.myView.frame;
frame.size.height = 50;
frame.size.width = self.myView.frame.size.width;
self.myView.frame = frame;
// update 'myView's constraint
self.viewHeight.constant = self.myView.frame.size.height;
self.tableView.rowHeight = UITableViewAutomaticDimension;
[myTableView reloadData];
}
Problem:
What happens is, when I press the button, the UIView's height gets
updated, but then everything else in the cell gets moved up, and the cell stays the same size.
When the UITextView's height changes, it doesn't pull everything else
down, and the cells height stays the same. Though the textView's
height does change and it just goes over everything else.
Constraints:
On the UITextView I have 3 constraints - 2 on each side, and 1 on top. The UIView has 3 constraints - 2 on each side, and 1 on the bottom.
I then have a constraint connecting the UIView to the textView.
You can dynamically manage UITableViewCell size by calculating a max height of your internal views:
NSArray *array = [[NSArray alloc] initWithArray:#[view1, view2, view3]];
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
__block CGFloat maxHeight;
[array enumerateObjectsUsingBlock:^(id obj, NSUInteger idx, BOOL *stop) {
UIView *view = obj;
if (view.bounds.size.height > maxHeight) {
maxHeight = view.bounds.size.height;
}
}];
return maxHeight;
}
Then in the end of your method that changes view's dimensions you must call [self.tableView reloadData]
Related
I have a collection view that scrolls horizontally and spans its parent view's full width. My cheap way to achieve paging on it is to set the cell widths to be equal to 1/3 of the collection view width, and to set that same amount of width as left and right content insets.
I disable scrolling in IB and replace with left and right swipe recognizers. My code almost works without setting contentInset, but setting the contentInset seems prevent any scrolling from happening
- (void)viewDidLayoutSubviews {
[super viewDidLayoutSubviews];
CGFloat itemWidth = self.collectionView.bounds.size.width/3.0;
NSInteger count = [self collectionView:self.collectionView numberOfItemsInSection:0];
self.collectionView.contentSize = (CGSize){ .width=itemWidth*count, .height=self.collectionView.bounds.size.height };
// uncomment this line, and the scroll code in the swipes below fails to work
//self.collectionView.contentInset = UIEdgeInsetsMake(0, itemWidth, 0, itemWidth);
self.collectionView.contentOffset = (CGPoint){ .x=self.collectionView.contentSize.width/2.0, .y=0 };
}
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
CGFloat width = self.view.bounds.size.width/3.0;
return (CGSize){ .width=width, .height=collectionView.bounds.size.height };
}
This code handles the swipes...
- (NSIndexPath *)centerIndexPath {
CGRect visibleRect = (CGRect){.origin = self.collectionView.contentOffset, .size = self.collectionView.bounds.size};
CGPoint visiblePoint = CGPointMake(CGRectGetMidX(visibleRect), CGRectGetMidY(visibleRect));
return [self.collectionView indexPathForItemAtPoint:visiblePoint];
}
- (void)swipeLeft:(UISwipeGestureRecognizer *)gr {
NSIndexPath *centerIndexPath = [self centerIndexPath];
NSLog(#"at %#", centerIndexPath);
if (centerIndexPath.row < [self collectionView:self.collectionView numberOfItemsInSection:0]-1) {
[self.collectionView scrollToItemAtIndexPath:centerIndexPath atScrollPosition:UICollectionViewScrollPositionLeft animated:YES];
}
}
- (void)swipeRight:(UISwipeGestureRecognizer *)gr {
NSIndexPath *centerIndexPath = [self centerIndexPath];
NSLog(#"at %#", centerIndexPath);
if (centerIndexPath.row > 0) {
[self.collectionView scrollToItemAtIndexPath:centerIndexPath atScrollPosition:UICollectionViewScrollPositionRight animated:YES];
}
}
All of this works, except when I set the contentInsets in the setup above. Then, even though I reach the scrollToItemAtIndexPath: code in the debugger, no scrolling occurs.
It's important to have those insets, because I want user to understand that center item is the selected item.
Can somebody explain why contentInset spoils scrolling and how to fix?
It looks like UICollectionView has its own built-in way to handle insets:
https://developer.apple.com/library/content/documentation/WindowsViews/Conceptual/CollectionViewPGforIOS/UsingtheFlowLayout/UsingtheFlowLayout.html#//apple_ref/doc/uid/TP40012334-CH3-SW1
Using Section Insets to Tweak the Margins of Your Content
Section insets are a way to adjust the space available for laying out cells. You can use insets to insert space after a section’s header view and before its footer view. You can also use insets to insert space around the sides of the content. Figure 3-5 demonstrates how insets affect some content in a vertically scrolling flow layout.
Figure 3-5 Section insets change the available space for laying out cells
I have five rows of cells each row containing four cells - 5x4. I am trying to accomplish almost an Apple watch like effect. The row in the center of the screen should have cell sizes of 100x100 and the rest return sizes of 80x80. When scrolled, the row moving away from the center should turn to 80x80 and the row moving into the center should turn 100x100.
I have implemented prepareLayout, layoutAttributesForElementsInRect, and layoutAttributesForItemAtIndexPath
So right now I have a center row of 100x100 cells and the rest 80x80.
To make it dynamic I implement shouldInvalidateLayoutForBoundsChange but nothing happens.
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds{
NSMutableArray *allAttributes = [NSMutableArray arrayWithCapacity:self.layoutInfo.count];
[self.layoutInfo enumerateKeysAndObjectsUsingBlock:^(NSString *elementIdentifier,
NSDictionary *elementsInfo,
BOOL *stop) {
[elementsInfo enumerateKeysAndObjectsUsingBlock:^(NSIndexPath *indexPath,
UICollectionViewLayoutAttributes *attributes,
BOOL *innerStop) {
// NSLog(#"%f, %f", newBounds.origin.x, newBounds.origin.y);
if ((newBounds.origin.y < [[UIScreen mainScreen]bounds].size.height/2-50) && (newBounds.origin.y > [[UIScreen mainScreen]bounds].size.height/2+50)) {
CGRect frame = attributes.frame;
frame.size.width = 100.0f;
frame.size.height = 100.0f;
attributes.frame = frame;
}else{
CGRect frame = attributes.frame;
frame.size.width = 80.0f;
frame.size.height = 80.0f;
attributes.frame = frame;
}
[allAttributes addObject:attributes];
}];
}];
return YES;
}
shouldInvalidateLayoutForBoundsChange: is called pretty frequently (whenever the view is resized, or scrolled...), so you probably don't need to be doing all that work there. If you know your cells will always have a fixed size and position then you can just return NO here.
As long as you have implemented prepareLayout, layoutAttributesForElementsInRect, and layoutAttributesForItemAtIndexPath, then make sure you also implement collectionViewContentSize to return the total size of the content.
Hey everybody i have a TableHeaderView and everything gets managed by Autolayout:
The UIImageView at the top should be always 2:1, so i set the Aspect ration and the Rest of the needed Constraints.
The 4 UIButtons should be always horizontal and should have the same Height and Width. So i worked with Equal Width and Equal Height and also with a Aspect Ratio of 1:1
And i have two UILabels with numberOfLines set to 0. I also made a Subclass of my UILabel, because of the preferredMaxLayoutWidth, like this:
- (void) layoutSubviews
{
[super layoutSubviews];
if ( self.numberOfLines == 0 )
{
if ( self.preferredMaxLayoutWidth != self.frame.size.width )
{
self.preferredMaxLayoutWidth = self.frame.size.width;
[self setNeedsUpdateConstraints];
}
}
}
This is my Code:
- (void)initializeHeaderViewLabels
{
//After the Response from my server arrived i set the tableHeaderView with the Textdata
self.tableView.tableHeaderView = nil;
if((self.contentDict[#"title"]) != [NSNull null])
{
self.headerTitleLabel.text = (self.contentDict[#"title"]);
}
if((self.contentDict[#"shortDescription"]) != [NSNull null])
{
self.headerDescriptionLabel.text = (self.contentDict[#"shortDescription"]);
}
[self.headerView setNeedsLayout];
[self.headerView layoutIfNeeded];
CGFloat height = [self.headerView systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height;
CGRect headerFrame = self.headerView.frame;
headerFrame.size.height = height;
self.headerView.frame = headerFrame;
[self.tableView setTableHeaderView:self.headerView];
}
I get my Image and the Text for the UILabels from my Server, so i have to wait until the Response arrives, then i call initializeHeaderViewLabels.
**My Problem is that the tableHeaderView is way too large during Runtime and so my UILabels get stretched and there is a lot of whiteSpace. Maybe i miss something?
In order to make it work you'll need some magic or migrate away from table header view. I've already answered on a similar question here. The trick is to magically reset tableHeaderView after evaluating it's height via autolayout. I've created sample project for that: TableHeaderView+Autolayout.
Try below solution
- (void)sizeHeaderToFit
{
UIView *header = self.tableView.tableHeaderView;
[header setNeedsLayout];
[header layoutIfNeeded];
CGFloat height = [header systemLayoutSizeFittingSize:UILayoutFittingCompressedSize].height;
CGRect frame = header.frame;
frame.size.height = height;
header.frame = frame;
self.tableView.tableHeaderView = header;
}
Source:
table header view height is wrong when using auto layout, IB, and font sizes
Also refer below question...!
How do I set the height of tableHeaderView (UITableView) with autolayout?
My problem was that I was setting constraints on the my header view that were mapping some frame values to superview frame values. When I removed the constraints and just set the frame directly, everything worked.
Header view height is set in the table view delegate. By default it is the same size as in interface builder which is too large when run in app since the width for interface builder is 600.
So what you need is to implement this method in UITableViewDelegate
func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
return 200.0 // Set the desired height based on your device or what ever you are using.
}
And Objective-C version:
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
return 200.0f;
}
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
return 200;
}
As My title said that i want to set frame of UITableView base on number of cell. Cell's height of UITableView is dynamic it is not fix, for do this i apply my following logic
NOTE: I added UITableView on UIScrollView so it is easy to scroll/see whole table's content. And i know UITableView has own scrollView but in my project i need set height of UITableView base on number of cell (dynamic height of cell).
- (void)viewDidAppear:(BOOL)animated
{
[super viewDidAppear:animated];
[self adjustHeightOfTableview]; // custom method for set height of tableView
}
- (void)adjustHeightOfTableview
{
CGRect frame = self.tblView.frame;
frame.size.height = tblHeight; // tblHeight is CGFloat, declare in .h file
self.tblView.frame = frame;
self.scrollView.contentSize = CGSizeMake(300, self.tblView.frame.origin.y + self.tblView.frame.size.height);
}
And get from
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
NSLog(#"%d", indexPath.row);
NSString *AnswerHeight = [[self.listOfQuestions objectAtIndex:indexPath.row] objectForKey:#"Answer"]; // get
CGSize constraint = CGSizeMake(queWidth - (10.0f * 2), 20000.0f);
CGSize size = [AnswerHeight sizeWithFont:[UIFont fontWithName:#"OpenSans-Bold" size:12] constrainedToSize:constraint lineBreakMode:UILineBreakModeWordWrap];
CGFloat height = MAX(size.height, 52);
tblHeight = tblHeight + height + (10.0f * 2) - 1.5; // set tblHeight
return height + (10.0f * 2) - 1.5;
}
But problem is that heightForRowAtIndexPath call 2 times so i am not able to get proper tblHeight so my tableView's height not set properly.
Why my heightForRowAtIndexPath call 2 times or How can i solve my problem ?? or any other solution for set tableView's frame base on dynamic number of cell ??
Just for understanding
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
return 1;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
return 5;
}
why to not make empty footerView.
UIView *footerView=[[UIView alloc]initWithFrame:CGRectZero];
self.taskListTable.tableFooterView=footerView;
and then change the table frame where you thinks it will change:
like in viewWillApear or any of your action
self.taskListTable.frame= CGRectMake(0,0, 320, self.view.bounds.size.height);
Each row will call heightForRowAtIndexPath everytime it will appear in the visible rows, so the solution is quite simple.
Create an NSMutableArray, with number of rows as your table view, then everytime you calculate the height of a row, just change that array's index for that indexPath's row with the height of that row.
And whenever you want the height of the table, just sum all your array's rows, that should do it.
If you have any more clarifications, just ask (Y)
heightForRowAtIndexPath will call for each row which is going to visible.
You can calculate table height in viewDidAppear or ViewWillApearMethod.
for (int i =0 ; i < self.listOfQuestions.count; i++) {
NSString *AnswerHeight = [[self.listOfQuestions objectAtIndex:i] objectForKey:#"Answer"]; // get
CGSize constraint = CGSizeMake(queWidth - (10.0f * 2), 20000.0f);
CGSize size = [AnswerHeight sizeWithFont:[UIFont fontWithName:#"OpenSans-Bold" size:12] constrainedToSize:constraint lineBreakMode:UILineBreakModeWordWrap];
CGFloat height = MAX(size.height, 52);
tblHeight = tblHeight + height + (10.0f * 2) - 1.5; // set tblHeight
}
Check my updated answer
I've got a UITableView with two dynamic rows. Each of the rows is a subclass of UITableViewCell and is loaded from nib. As my rows contain dynamic content, I use layoutSubviews to reposition all subviews:
- (void)layoutSubviews
{
[super layoutSubviews];
CGFloat initialHeight = titleLabel.bounds.size.height;
CGSize constraintSize = CGSizeMake(titleLabel.bounds.size.width, MAXFLOAT);
CGSize size = [titleLabel.text sizeWithFont:titleLabel.font constrainedToSize:constraintSize];
CGFloat delta = size.height - initialHeight;
CGRect titleFrame = titleLabel.frame;
titleFrame.size.height += delta;
titleLabel.frame = titleFrame;
locationLabel.frame = CGRectOffset(locationLabel.frame, 0, delta);
dayLabel.frame = CGRectOffset(dayLabel.frame, 0, delta);
timeLabel.frame = CGRectOffset(timeLabel.frame, 0, delta);
}
The problem is that I can't find a way to determine the height in table view delegate's tableView:heightForRowAtIndexPath: method.
The trick is that I load cell from nib, so just after it's loaded titleLabel.bounds.size.width is 300 px (as in nib), not taking into account type of the device (iPhone/iPad) and current orientation, so it seems impossible to calculate the height without conditional checks for orientation and device type. Any ideas?
Your layoutSubviews doesn't resize the cell, so the following should work:
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
return cell.frame.size.height;
}
If the cell needs to be resized due to the content changing then you can set self.frame = newFrame inside layoutSubviews.
You can also manual cause layoutSubviews to be called by calling setNeedsLayout.