如何获得 UICollectionView 的虚线页面指示器？
How to get a dotted page indicator for UICollectionView?
我有一个 UICollectionView 具有以下设置，
public CollectionView(CollectionLayout layout) : base(CGRect.Empty, layout)
{
RegisterClassForCell(typeof(CollectionCell), CollectionCell.CellIdentifier);
CollectionViewLayout = layout;
ShowsHorizontalScrollIndicator = false;
PagingEnabled = true;
}
CollectionViewLayout是，
public CollectionLayout()
{
ScrollDirection = UICollectionViewScrollDirection.Horizontal;
MinimumInteritemSpacing = 0f;
MinimumLineSpacing = 0f;
ItemSize = new CGSize(UIScreen.MainScreen.Bounds.Width, 200f);
}
因此 CollectionView 中的单元格被拉伸，以便一个单元格填充 CollectionView。 CollectionView 只能水平滚动。
现在我想要一个虚线页面指示器，而不是 CollectionView 的滚动条。无论如何我可以正确地实现这个目标吗？
使用 UIPageControl。 Link 下面：
UIPageControl
然后检测你在哪个单元格，写一些代码来改变UIPageControl的"currentPage"。
将一个 UIPageControl 拖到您的 collectionView 上方，并在您的 ViewController 中创建一个 UIPageControl 的 IBOutlet。
然后输入以下代码：
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
pageControl.currentPage = Int(self.collectionView=.contentOffset.x)/ Int(self.collectionView.frame.width)
}
我在 CollectionView 的顶部添加了一个 UIPageControl 组件，将其约束设置为 CollectionView 的底部。然后我得到了这个 UIPageControl 组件的实例到 UICollectionView 的 CollectionSource 的 属性。
我将 UIPageControl 的 Pages 和 CurrentPage 属性设置如下，
public class CollectionSource : UICollectionViewSource
{
private List<SourceDataModel> _dataSource;
public UIPageControl PageControl { get; set; }
// other code
public override void DecelerationEnded(UIScrollView scrollView)
{
var index = (int)(Collection.ContentOffset.X / Collection.Frame.Width);
PageControl.CurrentPage = index;
// other code
}
public override nint GetItemsCount(UICollectionView collectionView, nint section)
{
PageControl.Pages = _dataSource.Count;
return _dataSource.Count;
}
}
遵循的教程：https://blog.learningtree.com/paging-with-collection-views-part-2/
2020 年完全正确的方法：
只需在故事板中添加 UIPageControl。
将其放在您的 collection 视图下方（即在上方可见）。
Link到它...
class YourVC: UIViewController, UICollectionViewDelegate,
UICollectionViewDataSource,
UICollectionViewDelegateFlowLayout {
@IBOutlet var collectionView: UICollectionView!
@IBOutlet var dots: UIPageControl!
只需在 collection 视图中添加一个水平居中的约束，并添加一个对齐底部的约束。
这将给出标准定位/间距。
（当然，你可以把点放在任何地方，但这是标准。）
技巧 1 - 颜色
奇怪的是，点的 默认颜色 是..清晰的！
因此将它们设置为 gray/black 或您想要的任何值：
或者您可以在代码中执行此操作：
override func viewDidLoad() {
super.viewDidLoad()
dots.pageIndicatorTintColor = .systemGray5
dots.currentPageIndicatorTintColor = .yourCorporateColor
}
接下来。在 numberOfItemsInSection 中，添加 ...
func collectionView(_ collectionView: UICollectionView,
numberOfItemsInSection section: Int) -> Int {
let k = ... yourData.count, or whatever your count is
dots.numberOfPages = k
return k
}
提示 2 - 事实上，不要使用减速调用
添加此代码：
func scrollViewDidScroll(_ scrollView: UIScrollView) {
dots.currentPage = Int(
(collectionView.contentOffset.x / collectionView.frame.width)
.rounded(.toNearestOrAwayFromZero)
)
)
}
您只需在“scrollViewDidScroll”中设置页面即可。
事实上
• 不使用 scrollViewWillBeginDecelerating
• 不使用 scrollViewDidEndDecelerating.
查看原因：尝试使用其中一个调用。现在 快速浏览 浏览许多页面。注意它不能正常工作。
只需使用 scrollViewDidScroll 即可获得正确、完美的结果，包括初始化。
提示 3 - 不要 使用 Int 除法 - 它完全改变了行为并且是完全错误的。
你会经常看到这个示例代码：
// wrong, do not do this
dots.currentPage = Int(collectionView.contentOffset.x) /
Int(collectionView.frame.width)
// wrong, do not do this
often-seen 示例代码完全错误。
如果您尝试这样做，当您 略读 翻页。
最好的解释就是试试看。
对于滚动浏览或浏览页面时正常的、正确的 Apple-style 行为，代码是：
dots.currentPage = Int(
(collectionView.contentOffset.x / collectionView.frame.width)
.rounded(.toNearestOrAwayFromZero)
)
最终示例...
我有一个 UICollectionView 具有以下设置，
public CollectionView(CollectionLayout layout) : base(CGRect.Empty, layout)
{
RegisterClassForCell(typeof(CollectionCell), CollectionCell.CellIdentifier);
CollectionViewLayout = layout;
ShowsHorizontalScrollIndicator = false;
PagingEnabled = true;
}
CollectionViewLayout是，
public CollectionLayout()
{
ScrollDirection = UICollectionViewScrollDirection.Horizontal;
MinimumInteritemSpacing = 0f;
MinimumLineSpacing = 0f;
ItemSize = new CGSize(UIScreen.MainScreen.Bounds.Width, 200f);
}
因此 CollectionView 中的单元格被拉伸，以便一个单元格填充 CollectionView。 CollectionView 只能水平滚动。
现在我想要一个虚线页面指示器，而不是 CollectionView 的滚动条。无论如何我可以正确地实现这个目标吗？
使用 UIPageControl。 Link 下面： UIPageControl
然后检测你在哪个单元格，写一些代码来改变UIPageControl的"currentPage"。
将一个 UIPageControl 拖到您的 collectionView 上方，并在您的 ViewController 中创建一个 UIPageControl 的 IBOutlet。
然后输入以下代码：
func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
pageControl.currentPage = Int(self.collectionView=.contentOffset.x)/ Int(self.collectionView.frame.width)
}
我在 CollectionView 的顶部添加了一个 UIPageControl 组件，将其约束设置为 CollectionView 的底部。然后我得到了这个 UIPageControl 组件的实例到 UICollectionView 的 CollectionSource 的 属性。
我将 UIPageControl 的 Pages 和 CurrentPage 属性设置如下，
public class CollectionSource : UICollectionViewSource
{
private List<SourceDataModel> _dataSource;
public UIPageControl PageControl { get; set; }
// other code
public override void DecelerationEnded(UIScrollView scrollView)
{
var index = (int)(Collection.ContentOffset.X / Collection.Frame.Width);
PageControl.CurrentPage = index;
// other code
}
public override nint GetItemsCount(UICollectionView collectionView, nint section)
{
PageControl.Pages = _dataSource.Count;
return _dataSource.Count;
}
}
遵循的教程：https://blog.learningtree.com/paging-with-collection-views-part-2/
2020 年完全正确的方法：
只需在故事板中添加 UIPageControl。
将其放在您的 collection 视图下方（即在上方可见）。
Link到它...
class YourVC: UIViewController, UICollectionViewDelegate,
UICollectionViewDataSource,
UICollectionViewDelegateFlowLayout {
@IBOutlet var collectionView: UICollectionView!
@IBOutlet var dots: UIPageControl!
只需在 collection 视图中添加一个水平居中的约束，并添加一个对齐底部的约束。
这将给出标准定位/间距。
（当然，你可以把点放在任何地方，但这是标准。）
技巧 1 - 颜色
奇怪的是，点的 默认颜色 是..清晰的！
因此将它们设置为 gray/black 或您想要的任何值：
或者您可以在代码中执行此操作：
override func viewDidLoad() {
super.viewDidLoad()
dots.pageIndicatorTintColor = .systemGray5
dots.currentPageIndicatorTintColor = .yourCorporateColor
}
接下来。在 numberOfItemsInSection 中，添加 ...
func collectionView(_ collectionView: UICollectionView,
numberOfItemsInSection section: Int) -> Int {
let k = ... yourData.count, or whatever your count is
dots.numberOfPages = k
return k
}
提示 2 - 事实上，不要使用减速调用
添加此代码：
func scrollViewDidScroll(_ scrollView: UIScrollView) {
dots.currentPage = Int(
(collectionView.contentOffset.x / collectionView.frame.width)
.rounded(.toNearestOrAwayFromZero)
)
)
}
您只需在“scrollViewDidScroll”中设置页面即可。
事实上
• 不使用 scrollViewWillBeginDecelerating
• 不使用 scrollViewDidEndDecelerating.
查看原因：尝试使用其中一个调用。现在 快速浏览 浏览许多页面。注意它不能正常工作。
只需使用 scrollViewDidScroll 即可获得正确、完美的结果，包括初始化。
提示 3 - 不要 使用 Int 除法 - 它完全改变了行为并且是完全错误的。
你会经常看到这个示例代码：
// wrong, do not do this
dots.currentPage = Int(collectionView.contentOffset.x) /
Int(collectionView.frame.width)
// wrong, do not do this
often-seen 示例代码完全错误。
如果您尝试这样做，当您 略读 翻页。
最好的解释就是试试看。
对于滚动浏览或浏览页面时正常的、正确的 Apple-style 行为，代码是：
dots.currentPage = Int(
(collectionView.contentOffset.x / collectionView.frame.width)
.rounded(.toNearestOrAwayFromZero)
)
最终示例...
