具有缩放效果和三个可见项目的集合视图流布局答案

【问题标题】：Collection View flow layout with zoom effect and three items visible具有缩放效果和三个可见项目的集合视图流布局
【发布时间】：2018-05-22 20:55:20
【问题描述】：

这个问题可能被标记为不好问，但更好。

我正在尝试找到一个解决方案，了解如何在 Xamarin.iOS 中创建一个集合视图，其中三个项目可见，一个居中，两个在两侧，左右部分可见。像这样https://github.com/lukagabric/LGLinearFlow。我发现了许多快速且客观的 c 实现，但对于 Xamarin.iOS 却一无所获。

我发现最接近的是在子类化 UICollectionViewFlowLayout https://docs.microsoft.com/en-us/xamarin/ios/user-interface/controls/uicollectionview 部分下的文档中使用自定义 UICollectionViewFlowLayout，但没有定义如何使用它。

你知道一些实现或如何在 Xamarin.iOS Native 中实现它吗？

【问题讨论】：

标签： ios xamarin uicollectionview slider flowlayout

【解决方案1】：

在您发帖时，此文档 https://docs.microsoft.com/en-us/xamarin/ios/user-interface/controls/uicollectionview 告诉我们如何实现 flowLayout。我们只需要用这个流布局初始化一个UICollectionView。

构造一个新的集合视图：

LineLayout lineLayout = new LineLayout();

UICollectionView collectionView = new UICollectionView(View.Bounds, lineLayout);
View.AddSubview(collectionView);
collectionView.DataSource = new MyCollectionViewSource();
collectionView.BackgroundColor = UIColor.White;

collectionView.RegisterNibForCell(UINib.FromName("MyCollectionViewCell", null), "Cell");

那么它的dataSource可以是这样的：

public class MyCollectionViewSource : UICollectionViewDataSource
{
    public override UICollectionViewCell GetCell(UICollectionView collectionView, NSIndexPath indexPath)
    {
        MyCollectionViewCell cell = collectionView.DequeueReusableCell("Cell", indexPath) as MyCollectionViewCell;

        cell.MyStr = "label" + indexPath.Row;

        return cell;
    }

    public override nint GetItemsCount(UICollectionView collectionView, nint section)
    {
        return 20;
    }       
}

请注意LineLayout 中的常量可以根据您的要求进行调整。而SectionInset是指每个section之间的距离，我们应该调整这个以保证CollectionView只有一行。

我做了一个样本here供你参考。

【讨论】：

此解决方案存在一个问题，第一个和最后一个元素无法访问。但很容易修复。