I thought about the possibilities in UI Design for a new app. What I want to do is:
Have three view where the user can paginate horizontally. In each of this view there is a UIScrollView (fills the whole view) where the user can scroll vertically.
How could I manage, that horizontal scroll events are managed by the Pagination and vertical scrolls are managed by the ScrollView?
I'm sorry, maybe this is kind of a "beginner-Question"...
There might be a possibility to send the different touches to different UI-Elements?
Place the 3 scroll views inside a large scroll view.
The 3 vertical scrolling views should have a content size that matches the screen's width - this will stop them scrolling horizontally and the event will pass up to the the parent scroll view to allow horizontal scrolling.
Ensure that the content size of the parent view matches the screen height so that it only scrolls horizontally.
Related
I want to have two collection views that scrolls like this: the goal
I have achieved this but I then have the problem that when I scroll down the green collection view scrolls for alone and not the whole view: collection view with scroll
I then locked the scroll in the green collection view and put a scroll view around the whole screen. But when you scroll the collection view gets cut like this: collectionview locked
I have seen other apps like medium have two collection view that scrolls in two directions but I can not figure out have to achieve this.
Medium home
To make the scroll view able to scroll have I done this to calculate the height of the two collectio views and then setting the heigt to the scrollview:
var size : CGSize
let height = firstView.frame.height +
secondview.collectionViewLayout.collectionViewContentSize.height
size = CGSize(self.view.frame.width,height)
scrollview.contentSize = size
And my guess is that I might want to do the same for the green collection view but I have not got that to work.
Thanks!
Take a UITableView (for vertical scrolling). Put a collection view (with horizontal scrolling) in the header of the table view. By doing this, you would have horizontally scrollable view and the problem of cutting of view would be fixed. Moreover, you will not have to take another view for vertical scrolling. You will achieve that with the cells of table view.
Design like Medium (or many other apps) are easily achievable this way. A table view (vertical scrolling), a collection view (horizontal scrolling) as table view's header, and rest everything would be managed by table view. Give it a try.
To elaborate on my question, I've three scrollviews one top of another, let say base, middle and top. Base scroll view's content size is more so it will scroll, middle scrollview's content size is equal to its frame so it will not scroll, top scrollview's content size is more than its frame so it will also scroll.
Now when I scroll the top scrollview, once it reaches its end, I"m expecting it would scroll the base scroll view as middle is not scrollable. But it seems middle scroll view consumes all my scroll events and not letting the scroll event to go to base scroll view.
I"ve tried by setting more content size to middle scrollview, then it working as expected, first top scroll view scrolls fully then it passes the scroll event to middle scroll view then to the base scroll view.
Now it is more evident that middle scrollview (which is non scrollable) is consuming all of my scrolling event from going to base scroll view. How do I prevent that.
Note : As I've to support zooming, I need scroll view in all three levels.
Any help would be really appreciated.
Thanks.
I am trying to find the way to implement a scroll view on my viewController screen, which allows the user to scroll between different pages of controls and have the controls around it, outside the scroll view, react to whatever data or actions take place in the scroll view.
All the tutorials I have found is adding a scroll view that shows a carousel of images, or programmatically adding coloured frames. Very little control interaction.
But none that shows how to create 2-3 pages of controls (buttons and labels), and how to integrate it with the parent view (so the parent view and scroll view talk to each other in one view).
So for now, what would be the first step to create a scroll view with 2 'pages' of controls? Has anyone come across any good resources for this? How is the best way to achieve this?
Thanks!
Add Scroll View. Add top,left,right, bottom constraint to scroll view. Set horizontal only in storyboard.
Add a view inside scroll view. Now add height constraint from this view to super view. (Not the scroll view.) Specify some width and add width constraint.
I suggest you to use UIPageViewController for this type of scrolling.
I suggest you go for UICollectionViewLayout and enable paging to true. Using this will give you the finest control of each page and the horizontal as well as vertical scroll.
I've implemented pretty common pattern: you could scroll horizontally between views (paging enabled) and you could scroll any "page" down for more details. It is done with parent UICollectionView containing UIScrollViews, see enclosed image:
Collection View can scroll only horizontally, Scroll View can scroll only vertically.
However I am unable to achieve "proper" horizontal scrolling. I cannot scroll horizontally while inner scroll view is decelerating which heavily decreases UX quality. Tried so far: directionalLockEnabled, delaysContentTouches, canCancelContentTouches, touchesShouldBegin: and gestures with requireGestureRecognizerToFail - all without success (but maybe not all done right).
I found that Yahoo weather app has 2 scroll views, one can scroll vertically and the other can scroll horizontally.
These 2 scroll views are overlapped. How can I know which scroll view to scroll, based on the gesture?
For example, if I swipe up, the first scroll view should scroll up and the second one should remain unchanged.