[英]Swift swipe-able views
I'm new to Swift and iOS development, and am looking to set up a series of views, or "cards", that can be swiped left and right, with the next/previous cards remaining at the edges to indicate that they are there. 我是Swift和iOS开发的新手,我希望设置一系列可以左右滑动的视图或“卡片”,下一张/上一张卡片留在边缘,表示它们在那里。 This is done in iOS App Store previews:
这是在iOS App Store预览中完成的:
So far all I've really found is this Medium article: iOS Swift: Swipe View . 到目前为止,我真正发现的是这篇中篇文章: iOS Swift:Swipe View 。 However I'm not sure if this is the right way to do what I'm asking above, and I also don't know how to get the next/previous cards to remain at the edges on each swipe.
但是我不确定这是否是我上面要求的正确方法,而且我也不知道如何让下一张/上一张卡片保持在每次滑动的边缘。
Does anyone have any tips for achieving this? 有没有人有任何实现这个的提示?
The easiest way will be to use UICollectionView
and UICollectionViewFlowLayout
. 最简单的方法是使用
UICollectionView
和UICollectionViewFlowLayout
。 UICollectionViewFlowLayout
is provided out of the box and is very powerful. UICollectionViewFlowLayout
是开箱即用的,功能非常强大。
Basically you need: 基本上你需要:
UICollectionView
to your view controller. UICollectionView
添加到视图控制器。 UICollectionView
goes with Flow
layout selected. UICollectionView
选择Flow
布局。 UICollectionViewFlowLayout
UICollectionViewFlowLayout
Steps above should be enough to have vertically scrollable cards view. 上面的步骤应该足以具有垂直可滚动的卡片视图。 But it will not look great!
但它看起来不会很棒! To make it great you probably need perfectly to center most appropriate card after user end scrolling.
为了使它变得更好,您可能需要在用户结束滚动后完美地居中最合适的卡片。 To achieve sticky scrolling you need to work with the following
UICollectionViewDelegate
methods: 要实现粘性滚动,您需要使用以下
UICollectionViewDelegate
方法:
// compute collection view content offset in method bellow
override func scrollViewDidEndDragging(scrollView: UIScrollView, willDecelerate decelerate: Bool) {
...
}
// compute targetContentOffset in method bellow
override func scrollViewWillEndDragging(scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>) {
...
}
... last hint: to make collection view deceleration look quick in code of your view controller do: ...最后提示:在视图控制器的代码中使集合视图减速看起来很快:
self.collectionView?.decelerationRate = UIScrollViewDecelerationRateFast
Paging indicator: 寻呼指标:
In example that you provide there is a paging control that reflects current item and overall items count. 在您提供的示例中,有一个分页控件可以反映当前项目和整体项目计数。 You need to add
UIPageControll
manually; 您需要手动添加
UIPageControll
; you can do it in storyboard. 你可以在故事板中做到这一点。 The best place to update page control state will be:
更新页面控制状态的最佳位置是:
// method in UICollectionView delegate that you need to define.
// update your paging info in method bellow.
override func scrollViewDidScroll(scrollView: UIScrollView) {
...
}
Remarks: 备注:
Methods that deal with scroll view that i've listed are inherited by UICollectionViewDelegate
from UIScrollViewDelegate
. 处理我列出的滚动视图的方法由
UICollectionViewDelegate
从UIScrollViewDelegate
继承。 UICollectionView
itself derived from UIScrollViewDelegate
. UICollectionView
本身派生自UIScrollViewDelegate
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.