I am trying to make an app which has similar functionality to Apple's App Store Today Article controller. Basically, as you can see on the sample gif below the scroll view's content is below the header image. So I am trying to figure out how to make the image follow the scrollView below it, without being added to the scroll view itself? Is there a simple way of bonding image to scroll view? Thanks!
https://gph.is/2LKWBBZ
The image on the top could act as the header of the tableView or collectionView that would automatically scroll when you interact with the UITableView / UICollectionView.
You could start looking at ParallaxTableViewHeader and CSStickyHeaderFlowLayout to see how it works. Note: above controls use this header with UITableView or UICollectionView, but you could do the same with the scrollView with or without any modifications.
Related
I am trying to achieve a scrolling over a fixed image, as you can see on the picture.
I thought I should use a scrollview but I didn't quite get it how to use it and what to include into the scrollview, since the image and the button on the bottom should be fixed. In addition, the content should only be scrollable, when the text is to long.
I think the best solution here would be using a UITableView inside a UIViewController.
You can then set up the cells to make it look exactly the way you want.
For instance the first cell would just be the image, the second cell would be your title, the third one would be your menu bar, and so on.
This may be really useful if you plan to present dynamically the elements inside your UIViewController (for example if you need to use a database, you may want to animate the insertion of the rows only if the content has be downloaded already)
So using a UIViewController, you can just add the UITableView to it and set it up using contraints so that it fills the entire view. Then you can just add your button on the top of your table view, as a subview of your UIViewController's view (not as a subclass of your table view otherwise your button would end up scrolling too).
And again here you would need to add a few constraints to your button to make it look alright!
Just try it like this and let me know if you have any difficulties in the implementation :)
It is very complex to explain, To understand you must know good autolayout
To achieve that you need two scrollview and little math :)
Suppose your headerview height is 200
As you know when using autolayout we need following view hierarchy
Your view Hierarchy should be
--> Main View
--> ScrollView
--> Container View
-->Your HeaderView (200)
-->Content View (Equal height to UIView)
--> UIView (Your tabs like button , followbutton)
--> ScrollView 2
--> ContainerView
-->Subviews
Scroll view 1 Will used wo scroll the headerview and second scrollview will used to scroll other content of scrollview (Like Tab and text content as shown in picture )
Content View (Equal height to UIView) will allow your content view to give height of 200 extra to scroll bottom and your second scrollview will scroll to top which will allow to scroll your other content too
https://media.giphy.com/media/a2A4AQeAIkAhO/giphy.gif
I'm working on iOS RSS app, and my last view, which is a UIViewController, is similar to the attached image. I inserted in my DetailView.xib, one Image View to pass the images of the RSS feeds and two Text View to pass the title and summary respectively.
The question is, how can i make the same, but inside a UITableview?
you can use custom cells for it and can add this custom cell at particular index. At first index you just add image view and at second index you just add textview.
Check out this pretty good tutorial Custom UITableViewCell Using Interface Builder.
i hope it helps you.
You can achieve this particular thing by using Custom Table View Cell.
Table View gets created using single Table View Cell again and again. It is much more efficient and uses less memory.
You should check this tutorial.
I hope it will help you.
Thanks
You can make TableView height UITableView.automaticDimension and make sure UITextView autoscroll is disabled and constraint should be leading, trailing, bottom and top.
Here's the link this might work for you:
How to make a UITextView Expand with the text like the Notes app
I have got a uitableview inside of a uiscrollview.
So the uitableview is smaller than the uiscrollview. And when I start to scroll down on the uitableview and it reaches the bottom, I am able to scroll in the uiscrollview.
And it works fairly. But not perfectly.
I would like to make the ux perfect so the scrollview would be kind of an extension (or another section of the uitableview). I don't want to add any section or footerview at the bottom of the tableview.
I was wondering on doing this by implementing something like this:
//
if tableview didscroll to bottom
then scrollview scrolltorect xxx
//
but it would only work if the uitableview was scrolling down.
I am not sure if this would replicate the correct ux behaviour.
Could you guys give me your advice on how to do this?
Thank you and best regards.
I found this very hard and difficult to execute so I changed my UI in order to put the bottom of the interface inside the tableview footer's view. This way the experience of scrolling my app got much smoother.
The only UITableViews I have worked with thus far are sized to fill the entire page.
I'm trying to create a page in my app where I will have an image and a label on the top of the page followed by a UITableView to hold comments below it.
Something like this springs to mind: http://www.inquisitr.com/wp-content/fbb.jpg
My problem is if I add a UITableView below the image and label, when I scroll the tableview then only the UITableView cells scroll. Not the entire page.
How would I go about making the entire page scroll so that the label and image scroll off the page and more table cells appear?
Thanks.
Put your image and label in a container UIView, and then set that container to the tableHeaderView property of your UITableView.
You could try setting the tableHeaderView property of the UITableView to a custom view containing your controls.
I have a horizontal UIScrollView that contains UIButtons (though it could be any object). I would like to only download images for these buttons as the user scrolls and they are seen. I would also like an activityindicator running on each button while the images are downloading. Here's what I've tried with results:
Check content offset of uiscrollview and download images for visible buttons. Problem: issues getting activity view shown within subclassed UIButton and not desired usability since images are only downloaded once scrolling stops.
Add subviews (not buttons) to the UIScrollview hoping to use the view's ViewController to initiate a downloaded on viewDidAppear. Problem: viewDidAppear never seems to get called (because I am using addSubView?).
I've seen other apps that do this kind of loading but need some guidance on the typical set-up. Ebay's app is a great example. All items have a default image until the item comes into view, then an activityindicator runs and the items unique image is downloaded.
Thanks for assistance.
Without actually trying it out, here's my idea:
You can use the UIScrollViewDelegate method scrollViewDidScroll: to find out when your scroll view finished scrolling and then use [UIScrollView contentOffset] to determine which part of the scroll view is visible and (CGRect)convertRect:(CGRect)rect fromView:(UIView *)view to determine the button's position within the visible part of the scroll view. Have a method that checks if the button has had its image loaded yet and if not, load it and refresh the view if necessary.
Most such apps are using a UITableView, not a plain scroll view. Joe Hewitt's Three20 framework has a TTImageView class that can do lazy image loading and is pretty well suited to this kind of use.