How to get Table View to scroll above Image View? - ios

I'm using a table and image in my program.
I placed the image on top and table just below that.
Now I need to keep the Image static and On scrolling I want the table to go above the image according to the scroll height.

Use the contentInset of your UITableView to adjust the initial offset of the content. Make sure your tableView is front of your UIImageView.
[self.tableView setContentInset:UIEdgeInsetsMake(viewHeight, 0, 0, 0)];
contentInset will only adjust the initial content position, so when scrolling, the whole frame of your UITableView is used.
Update: UIView is UIImageView in your case

You can use it by Placing both the UIImageView and UITableView in UIScrollView
And set UIScrollView contentSize() according to need like
1.) scrollView.scontentSize = CGSizeMake(scrollView.frame.size.width, imageView.frame.size.height + tableView.frame.size.height + 10);
2.) Set UITableView scrolling to NO
This would help you.ThankYou

Related

Can I push tableview cells apart from each other?

I want to make my cells separated. Is there a way I can increase the space between tableview cells?
As you can see in this photo, I want to make the cells appear further away from each other. Is there a way I can achieve this?
If you are using a storyboard for UI and a using custom cell in your tableview, you can achieve your goal by keeping the custom cell's frame bigger than Content View's View.
So, if cell > Content View's frame = 0, 0, 375, 100
Please make, cell > Content View > View's frame = 15, 5, 345, 90
You can fix the spacing between your cells by making the cell Fram bigger than the content view.
You can do it by the storyboard. Or by using the delegate method estimatedHieghtForRowAt and height for rowAt.

Move TableViewCell down a little when the UIView is expanded

I want to move the tableViewCell down a little when the UIView is expanded.
I have some detail information initially hidden inside the view. Now if the users are interested in the detail information, they can click the button on the view to show the detail information, but the frame of detail intrudes onto the tableViewCells, so I want to change the location of tableViewCells to move it down a little to fit the view's frame.
Is possible to change the frame of the cell in the cellForRowAtIndexPath?
I have tried it, but I get an error.
The following picture says when I click the arrow image, it shows the detail information.
Thanks.
Note: My UIView is inside the UITableView, so changing the frame of UITableView doesn't work.
self.tableView.frame = CGRectMake(self.tableView.frame.origin.x,self.detailView.frame.origin.y + self.detailView.frame.size.height,self.tableView.frame.size.width,self.tableView.size.height - x);//set value of x according to your need
I hope this would help.Thankyou
You should change contentInset of the UITableView:
youtableview.contentInset = UIEdgeInsetsMake(x, 0, 0, 0);
You should fix that x value to deal with your custom view height.
Good luck.
You could change the ContentOffset of the UITableView.
self.tableView.contentOffset = CGPointMake(0, self.tableView.contentOffset.y + 44);

Scrolling ViewController Content

What I have in the view controller view are :
An image of fixed height
Few labels
Table view with n rows.
Once rendered I want everything here to be inside the scroll the view so the user can scroll the entire screen as needed. Note that the scrollView needs to expand to the entire size of the tableView to show its full contents. I have tried different ways of doing this but unable to do it. I would appreciate any pointers or code segment to get this done.
There are essentially two ways to do so.
tableHeaderView
The first way involves the tableHeaderView property of the UITableView instance you have. You can simply add the UITableView with the constraints/frame/autoresizingMask that allows you to put it full-screen. Done that, you simply do (i.e. in your viewDidLoad):
UIView *headerView = [UIView new];
// Here I am supposing that you have a 200pt high view and a `self.tableView` UITableView
headerView.frame = CGRectMake(0, 0, self.tableView.frame.size.width, 200.0);
UIImageView *fixedImageView = [UIImageView new];
// configure your imageView..
[headerView addSubview:fixedImageView];
// configure labels as you want and add them to headerView as subviews
// Now set `UITableView` headerView
self.tableView.tableHeaderView = headerView;
If you want to use AutoLayout for your tableHeaderView, I suggest you to take a look at this question
Dynamic scrollView
Another way to do this is to to create an UIScrollView, put everything inside, and let it scroll. The downside of this method is that if you are using floating section headers for your UITableView, they will not float due to the fact that the tableView is going to stay fixed, while the parent scrollView is going to scroll.
On the other side, this approach is more AutoLayout friendly due to the fact you can use constraints easily.
To do so, you start adding an UIScrollView to your view, and placing all your other views inside it.
Be sure to add a Vertical Spacing constraint between the first view inside your scrollView (I suppose the UIImageView) and the scrollView top, and between the last view (I suppose the UITableView) and the scrollView bottom, to avoid an ambiguous content size.
You should have something like that (I omitted the labels for the sake of brevity):
Note that every view is inside a parent UIScrollView
After that, add an Height constraint to the tableView, and add an IBOutlet to your view controller subclass, i.e. like this:
#property (weak, nonatomic) IBOutlet NSLayoutConstraint *tableViewHeightConstraint;
Now you only need to configure this constraint to reflect the tableView natural height, given by its rows, etc. To do so, you simply calculate the height in this way:
// Resize TableView
CGFloat height = self.tableView.contentSize.height;
self.tableViewHeightConstraint.constant = height;
Now the tableView will resize, and due to its constraints it will adapt the parent scrollView contentSize.
Just be sure to refresh this height constraint anytime you reload the UITableView dataSource.

Unable to increase the scroll view width of horizontal UITableView

In my application, I rotated the table view for 90 degrees i.e., the table view is now horizontal table view. After rotation I tried to increase its scroll size as I was unable to view the last row but I couldn't increase it. As table view is sub class of UIScroll view, I tried to change it in Interface Builder but nothing solved my problem. Please tell me how to increase this table view scroll view width to view all the contents.
rotateTable = CGAffineTransformMakeRotation(-M_PI_2);
tableView.transform = rotateTable;
[tableView setFrame:CGRectMake(40, 333, self.view.frame.size.width , 37)];
In IB,Size Inspector: Scroll View Size: Scroller Insets : Right : 500 (I changed the Right attribute to increase the width)
You don't need to manage it. Tableview does it itself. Your problem is frame of tableview. Your tableview is crossing bounds of it's superview(view in which tableview is added). Check tableview's frame. Make sure it will not exceed bounds of superview.

how to expand image on UITableView like in CNN app

I have the CNN app on my iPhone.
If you open it will show "top stories", and has always a picture on the top of the table.
When we slide our finger down it expands/zooms the image.
When we slide our finger up to show more rows it does not move the image upwards at the same speed has the table rows instead the table rows move faster than the picture going off the screen.
Do you know how to do this effect?
You need UIImageView to UIScrollView contentInset and set top inset more than zero.
UIScrollView *scroll = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
UIImage *topImage = [UIImage imageNamed:#"photo"];
topImage.frame = CGRectMake(0, -topImage.frame.size.height, topImage.frame.size.width, topImage.frame.size.height);
[scroll addSubview:topImage];
self.contentInset = UIEdgeInsetsMake(topImage.frame.size.height, 0, 0, 0);
After that set UIScrollView's contentOffset like this
scroll.contentOffset = CGPointMake(0, topImage.frame.size.height);
So you have the UIScrollView with image inside it. Now you just need to add delegate to UIScrollView and wait for - (void)scrollViewDidScroll:(UIScrollView *)scrollView. Resize image and change contentInset right after this method called.
This advice you also can apply to UITableView similar way, or create category on UIScrollView.
I also advice you to read code of this project https://github.com/samvermette/SVPullToRefresh. It's also about UITableView and adding view to it's top side
It seems like a completely custom effect that you will have to implement yourself. To point you in the right direction, I'd first monitor contentOffset changes in the scrollViewDidScroll: messages sent by your myTableView instance, and when the contentOffset.y < 0, change the scale of your imageView via
[myImageView setValue:[NSNumber numberWithFloat:scaleIncrementAmountFloat] forKeyPath:#"transform.scale"];
My guess is that the top cell (or cells) of the tableview are transparent and there is a UIImageView behind the tableview that is resized/moved based on how the table view is scrolled.
Since the table view inherits from UIScrollView, its delegate (UITableViewDelegate) inherits from the UIScrollViewDelegate protocol which is notified when a the user scrolls the scroll view. Implement the - (void)scrollViewDidScroll:(UIScrollView *)scrollView method to receive these notifications and check the contentOffset property on the scroll view.
You may have to implement you own table view controller to build the desired UI in the interface builder.

Resources