I added a UITableView as a subview to a custom UIView class I'm working on. However I noticed that whenever I scroll the table it calls my classes layoutSubviews. I'm pretty sure its the UIScrollview that the table is inheriting from which is actually doing this but wanted to know if there is a way to disable this functionality and if not why is it happening? I don't understand why when you scroll a scrollview it needs its superview to layout its subviews.
Code:
#implementation CustomView
- (id)initWithFrame:(CGRect)frame {
if ((self = [super initWithFrame:frame])) {
self.clipsToBounds = YES;
UITableView *tableView = [[UITableView alloc] initWithFrame:CGRectMake(0.0, 15.0, 436.0, 132.0) style:UITableViewStylePlain];
tableView.dataSource = self;
tableView.delegate = self;
tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
tableView.backgroundColor = [UIColor clearColor];
tableView.showsVerticalScrollIndicator = NO;
tableView.contentInset = UIEdgeInsetsMake(kRowHeight, 0.0, kRowHeight, 0.0);
tableView.tag = componentIndex;
[self addSubview:tableView];
[tableView release];
}
return self;
}
- (void)layoutSubviews {
// This is called everytime I scroll the tableview
}
#end
Yes, a UIScrollView does call layoutsubviews whenever it scrolls. I could've sworn this was stated in the documentation somewhere, but I guess not.
Anyways, the prevailing idea for this is that a UIScrollView should layout its stuff so that views that currently can't be seen shouldn't be laid out. As users scroll in the scroll view, it should add and remove subviews as necessary. I'm guessing this is what TableViews use to enqueue table cells that get hidden.
Is there any reason why you would care if layoutsubviews gets called or not?
UITableView at least does appear to layout its superview. This behavior can be problematic when you have a layoutSubviews method that might be expensive (e.g. if you call some JavaScript).
The quick fix is add an intermediary subview that prevents the scroll view from laying out your superview. Instead, it will layout the intermediate subview.
This could be somewhat imperfect but it should work for most cases:
Assume UIView * intermediateView is defined as an instance variable:
-(id) initWithFrame:(CGRect)frame
{
self = [super initWithFrame: frame];
if (self)
{
UIScrollView * theScrollView; // = your scroll view or table view
intermediateView = [[[UIView alloc] initWithFrame:CGRectZero] autorelease];
// Ensures your intermediate view will resize its subviews.
intermediateView.autoresizesSubviews = YES;
// Ensure when the intermediate view is resized that the scroll view
// is given identical height and width.
theScrollView.autoresizingMask = UIViewAutoresizingFlexibleWidth |
UIViewAutoresizingFlexibleHeight;
[intermediateView addSubview: theScrollView];
// Ensure the frame of the scroll view is exactly the bounds of your
// intermediate view.
theScrollView.frame = bottomContainerView.bounds;
[self addSubview: intermediateView];
}
return self;
}
-(void) layoutSubviews
{
intermediateView.frame = CGRectMake(0, 50, 42, 42); // replace with your logic
}
Not sure i understand your issue correctly but when you scroll a tableview it removes the cells not shown from the memory and loads them again when they are scrolled back into visibility (cells are allocated on demand, only the visible ones) , in effect doing what you seem to be describing.
Related
I'm having an issue receiving touches in UICollectionViews contained within UITableViewCells. The desired effect is a UITableView with n rows of horizontally scrolling UICollectionViews. The view is displaying correctly but the collection views only receive touches in the top 44px. I imagine that the table view is still in the process of initialization when the collection views are created and that the collection views are using UITableView's default cell height when setting up their gesture recognizers. Relevant code is below.
In my UITableViewCell subclass, I create a container view for the UICollectionView:
- (void)layoutSubviews
{
if (!_collectionViewContainer) {
_collectionViewContainer = [[CVTCollectionViewContainer alloc] init];
_collectionViewContainer.frame = self.bounds;
[self.contentView addSubview:_collectionViewContainer];
};
}
In my container view, I instantiate a UICollectionView:
- (void)drawRect:(CGRect)rect
{
[super drawRect:rect];
if (!self.collectionView) {
UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
self.collectionView = [[UICollectionView alloc] initWithFrame:self.bounds collectionViewLayout:flowLayout];
self.collectionView.delegate = self;
self.collectionView.dataSource = self;
self.collectionView.backgroundColor = [UIColor clearColor];
flowLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
flowLayout.itemSize = CGSizeMake(130.0, 130.0);
[_collectionView registerClass:[CVTCollectionViewCell class] forCellWithReuseIdentifier:#"Collection view cell"];
[self addSubview:self.collectionView];
}
}
There's nothing interesting in my UITableViewController, just that I return 200 in tableView:heightForRowAtIndexPath:
It occurred to me that the layoutSubviews method of my UITableViewCell subclass may be the wrong place for initialization of the 'container' view for my UICollectionView. But, when I NSLog(#"cell: %#", self); in layoutSubviews, the cell's frame shows the desired height (200). Still, I have a feeling that I am doing my setup for the collection view too early, but I can't think of where else I might perform this work.
So, the gist: how can I add a UICollectionView to a UITableViewCell and make sure that the UICollectionView's gesture recognizers respond in the entirety of the collection view, rather than just the top 44 px?
Thanks in advance, as always.
Bit of a facepalm here, I was using a UITableViewController that was created in storyboard but mostly configured in code. In storyboard, I had not set the row height of the table view, so it was still at the default 44 px. Of course, the table view looked at IB for its initial config so, although tableView:heightForRowAtIndexPath: was being called and the cells were displaying correctly, the initial height set in IB was affecting how the cell's subviews were created.
I'm building an app for a blog site.
I have a UINavigationController with a UITableViewController as it's root view.
I laid this out in a storyboard no problem, but I'm trying to drag an iAd view to the bottom of the screen and xcode will not let me add it.
It looks like I have to switch from a subclass of UITableViewController to a subclass of UIViewController, and just put my delegate and datasource methods in my subclassed UIViewController.
This seems wrong to me. I'm just trying to end up with a UITableView of article headlines, with a navbar up top, and an iAd at the bottom...
Advice? Suggestions?
Thanks in advance.
One of the easiest ways to accomplish this is using the UITableView's tableFooterView property. Yes, I know the footer stays at the bottom of the table, but it doesn't have to. You can set its frame within the table. Add the iAd as the footer like so:
self.tableView.tableFooterView = iAd;
Then, to adjust the frame of the iAd as the table scrolls, implement the UIScrollView delegate method: (This is possible because UITableView is a subclass of UIScrollView)
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
CGRect iAdFrame = iAd.frame;
CGFloat newOriginY = table.contentOffset.y + table.frame.size.height - iAdFrame.size.height;
CGRect newIAdFrame = CGRectMake(iAdFrame.origin.x, newOriginY, iAdFrame.size.width, iAdFrame.size.height);
iAd.frame = newIAdFrame;
}
You can see that the implementation is easy enough. We simply use the contentOffset y to determine how far down the frame of the iAd should be.
I tried to use the example above by NJones with adjusting the position of the tableFooterView, but I found out it was hard to manage it when reloading the data or refreshing the table.
Then I found out that this could be done by adding the iAd banner to the superview of the tableViewController's view.
self.bannerViewController = [[BannerViewController alloc] init];
[self.bannerViewController.view setHidden:YES];
[self.bannerViewController.view setFrame:CGRectMake(0, self.view.superview.frame.size.height - self.tabBarController.tabBar.frame.size.height - 50, 320, 50)];
[self.view.superview addSubview:self.bannerViewController.view];
[self.bannerViewController loadBanner];
When the banner is loaded I create a tableFooterView to make space for the last cell in the tableViewController
-(void)bannerDidLoad{
[self.bannerViewController.view setHidden:NO];
self.tableView.tableFooterView = [[UIView alloc];
initWithFrame:self.bannerViewController.view.frame];
}
I had to make some changes to the solution posted by NJones, since there was a problem with the ad not being displayed on top of all other cells/views.
First make sure your tableViewController is a AdBannerViewDelegate:
#interface MyTableViewController () <ADBannerViewDelegate>
Adding the AdBanner to the tableviewcontroller:
- (void)viewDidLoad {
[super viewDidLoad];
...
ADBannerView *adBanner = [[ADBannerView alloc]initWithAdType:ADAdTypeBanner];
adBanner.delegate = self;
self.tableView.tableFooterView = adBanner;
}
The code to position the ad banner is taken from NJones, I only added the last line to bring the ad banner to the front:
-(void)positionAdBanner {
ADBannerView *adBanner = (ADBannerView *) self.tableView.tableFooterView;
if (adBanner) {
CGRect iAdFrame = adBanner.frame;
CGFloat newOriginY = self.tableView.contentOffset.y + self.tableView.frame.size.height - iAdFrame.size.height;
CGRect newIAdFrame = CGRectMake(iAdFrame.origin.x, newOriginY, iAdFrame.size.width, iAdFrame.size.height);
adBanner.frame = newIAdFrame;
[self.tableView bringSubviewToFront:adBanner];
}
}
This function gets called whenever the view is going to layout its subviews (so you only need it here, no need to check for scrolling, etc):
-(void)viewWillLayoutSubviews{
[super viewWillLayoutSubviews];
[self positionAdBanner];
}
You also should handle the ADBannerViewDelegate methods:
-(void)bannerViewDidLoadAd:(ADBannerView *)banner
{
banner.hidden = NO;
[self positionAdBanner];
}
-(void)bannerView:(ADBannerView *)banner didFailToReceiveAdWithError:(NSError *)error
{
banner.hidden = YES;
}
I have a UITableView which is not being resized properly using autoresizeMask (in iPhone 3.0).
The UITableView is inside a UIViewController inside a UINavigationController inside a UITabBarController, all of which are being created programatically. The status bar is visible.
The code of the UIViewController is basically:
- (void)loadView {
UIView* rootView = [[UIView alloc] init];
self.view = rootView;
[rootView release];
}
- (void)viewDidLoad {
[super viewDidLoad];
// table = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, 320, 480-20-49-44)];
table = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, 320, 100)]; table.autoresizingMask = UIViewAutoresizingFlexibleHeight;
[self.view addSubview:table];
}
When created like this, the UITableView is slightly bigger than the available space. If I'm not mistaken, it's exactly 44 pixels bigger, the size of the navigation bar.
However, if I uncomment the commented line and comment the next line the size of the UITableView is exactly right. I would prefer to use autoresizingMask instead of manually calculating the size of the UITableView. What am I doing wrong?
Thank you in advance!
The problem seems to be that I wasn't setting the frame of the root view in loadView. If you define such frame, and then define the frame of the subviews in relation to that frame, then the autoresize masks will correctly resize the subviews according to how the root view was resized by the framework.
For example:
- (void)loadView {
UIView* rootView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 480)];
self.view = rootView;
[rootView release];
}
- (void)viewDidLoad {
[super viewDidLoad];
table = [[UITableView alloc] initWithFrame:self.view.frame];
table.autoresizingMask = UIViewAutoresizingFlexibleHeight;
[self.view addSubview:table];
}
Thanks to Colin Gislason who pointed me in the right direction.
The autoresizing mask will not help you with the initial size of the table view. The table view is created with the frame that you give it. The autoresizing mask defines the rules for resizing this frame relative to the parent view when the parent's frame changes.
So if I define a table that is 320x100 it will stay that size unless I change it explicitly or the parent view's frame changes.
Depending on the other views, you could do the calculation based on the other views held by the parent or by the parent's frame itself.
Create UIViewController subclass instand of UITableViewController Subclass.
insert UITableView instance.
in NIB simply drag and drop UIView
on top of that wier place the existing UITableVIew object.
set the size of the uitableview via nib or viewDidLoad method.
set the reference , dataSource and delegate via nib.
now its simply transfer the UIViewController class and the can change tableview size as you wish.
I have a view that was created with all of the default UITableView stuff, but now I need to add a header area above where the UITableView is (so the UITableView will scroll normally, but the top 100px of the screen or so will have static header content). I don't see where I can resize the UITableView in IB, and am not sure how to do this.
Does anyone know?
You can use UITableViewDelegate methods to create a custom header view for a table and specify the height, namely tableView:viewForHeaderInSection: and tableView:heightForHeaderInSection:. You can add whatever you like to the view. Here's an example that adds a right aligned UILabel:
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0,0,tableView.frame.size.width,30)];
UILabel *headerLabel = [[UILabel alloc] initWithFrame:CGRectMake(60, 0, headerView.frame.size.width-120.0, headerView.frame.size.height)];
headerLabel.textAlignment = NSTextAlignmentRight;
headerLabel.text = [titleArray objectAtIndex:section];
headerLabel.backgroundColor = [UIColor clearColor];
[headerView addSubview:headerLabel];
return headerView;
}
-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
return 30.0;
}
Why don't you use the UITableView provided header?. As follow:
- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section
{
return #"My Title";
}
Additionally you may resize your table view in IB by dragging the borders.
When you add a UIView or one of its subclasses onto the UITableView using IB (just drag a UIView and drop it onto the UPPER part of UITableView of yours), it automatically adds that UIView component and makes it the "tableHeader" component.
Each UITableView has one tableHeader and one tableFooter component reserved...
This way the new view would be a part of the UITable, and scroll with it or appear/disappear or whatever you do to the table. You can change its hidden property if you need conditional behavior.
On the other hand, if you want the header view stay put, as the table scrolls, then it is better to make the table smaller and put the header above it as suggested in other answers...
I finally solved this problem the right way without changing the base class. The one answer to add the view to the parent nav controller is nice but the transitions look horrible.
The fix is actually easy. The trick is to create custom setter and getter for self.tableView property. Then, in loadView, you replace the view with a fresh UIView and add the tableView to it. Then you're free to add subviews around the tableView. Here's how it's done:
In header:
#interface CustomTableViewController : UITableViewController
{
UITableView *tableView;
}
In .m:
- (UITableView*)tableView
{
return tableView;
}
- (void)setTableView:(UITableView *)newTableView
{
if ( newTableView != tableView )
{
[tableView release];
tableView = [newTableView retain];
}
}
- (void)loadView {
[super loadView];
//save current tableview, then replace view with a regular uiview
self.tableView = (UITableView*)self.view;
self.view = [[UIView alloc] initWithFrame:self.tableView.frame];
[self.view addSubview:self.tableView];
//code below adds some custom stuff above the table
UIView *customHeader = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 20)];
customHeader.backgroundColor = [UIColor redColor];
[self.view addSubview:customHeader];
[customHeader release];
self.tableView.frame = CGRectMake(0, customHeader.frame.size.height, self.view.frame.size.width, self.view.frame.size.height - customHeader.frame.size.height);
}
- (void)viewDidUnload
{
self.tableView = nil;
[super viewDidUnload];
}
Enjoy!
You will have to embed the UITableView in a UIView alongwith another view (which you are referring to as header section).
So, the UIView will have 2 subviews. The header view followed by the table view.
UIView(parent)
UIView (header)
UITableView (table)
Hope this helps.
I like the answer from noodl_es (upvoted), because it provides the functionality and behavior you want, yet you don't have to worry about resizing the UITableView: that is handled for you automatically. However, the solution is best suitable only if the header information pertains specifically to the first section of the table (or if the table has only one section). If the table has more than one section, then the header of the second section will push away the header of the first section when scrolled up, and therefore the header view will not appear to pertain to the whole table.
Found a solution at iphonedevsdk
Instead of doing this:
[tableViewController.view addSubview:viewSubclass];
do this
[tableViewController.navigationController.view addSubview:viewSubclass];
Suppose to have your UITableViewController
#interface MXMTableViewController : UITableViewController <UITableViewDelegate,UIScrollViewDelegate> {
/// your table view interface here
}
and a xib with you simple UITableView defined yet in it, you can do as Mihir says overriding the loadView method like this:
- (void)loadView {
[super loadView];
UIView *mainView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 480)];
self.view = mainView;
[mainView release];
// Add Header View
UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 36)];
headerView.backgroundColor = [UIColor redColor];
[self.view addSubview:headerView];
// now, move your table view down. Check you nib to choose
// the right Y-axis offset
CGRect f = tableView.frame;
f.origin.y += headerView.frame.size.height/2;
tableView.frame = f;
// Add the table view to the container view
[self.view addSubview:self.tableView];
// Add footer
UIView *footerView = [[UIView alloc] initWithFrame:CGRectMake(0, self.tableView.frame.size.height, 320, 125)];
footerView.backgroundColor = [UIColor redColor];
[self.view addSubview:footerView];
[footerView release];
[headerView release];
}
...and that's it. You have a UITableView with fixed header and footer.
PS. You may now use your xib custom views as the header and footer's views.
First a little background info:
I have UIViewController that contains a UITableView. In the loadView method (after initialization of the table), I set the UIViewControllers view to the table view with: self.view = tableView;
What I want is a view on the top of the screen (before the UITableView), that doesn't scroll with the rest of the table view when it is scrolled. I have tried adding my UIView to the table view's tableViewHeader, which displays correctly but scrolls with the rest of the table.
Is there any easy fix for this? Either way, any hints towards a solution is greatly appreciated.
EDIT:
Come to think of it, what I want is something like the stock application where the bottom part is stationary and the rest of the screen is a UITableView. The only difference is that I want the stationary part at the top of the screen.
As kmit has already pointed out, you can easily add more than one subview to your view. So, don't set the table view directly as self.view, but rather create a blank UIView (as container) and add the table view as well as the header view as subviews to that view. You can control the views' extents via their frame attributes. A simple example:
- (void)loadView {
UIView* view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 460)];
[view setAutoresizingMask:UIViewAutoresizingFlexibleHeight|UIViewAutoresizingFlexibleWidth];
// header view
HeaderView* headerView = [[HeaderView alloc] initWithFrame:CGRectMake(0, 0, 320, 182)];
self.headerView = headerView; // in case you need the reference later on
[view addSubview:headerView];
[headerView release];
// table view
UITableView* tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 182, 320, 186) style:UITableViewStylePlain];
[tableView setAutoresizingMask:UIViewAutoresizingFlexibleHeight|UIViewAutoresizingFlexibleWidth];
tableView.delegate = self;
tableView.dataSource = self;
[view addSubview:tableView];
self.tableView = tableView;
[tableView release];
self.view = view;
[view release];
}
As an alternative to creating the containing UIView manually, you can call [super loadView] at the beginning of your loadView implementation.
Is there a reason you are setting the view of the UIViewController to that of the UITableView? Why not handle the UITableView as a subview? That would allow you to add anything you want above the UITableView -another view, empty space with the view of the UIViewController as your background, etc.