为 CollectionView [Swift] 的单独 Cell 设置圆形标签答案

【问题标题】：Set a circle label for a separate Cell of CollectionView [Swift]为 CollectionView [Swift] 的单独 Cell 设置圆形标签
【发布时间】：2019-05-05 10:36:40
【问题描述】：

我正在尝试为 CollectionView 的可见单元格画一个圆圈，看起来像这样

我尝试通过addSubview 和removeFromSuperview 之前的标签，但它不起作用

let myIndex1 = IndexPath(row: 0, section: 0)
    let myIndex2 = IndexPath(row: 1, section: 0)
if indexPath.row == 0 {

    collectionView.cellForItem(at:myIndex1)?.addSubview(labelNew)
            labelNew.layer.backgroundColor = selectedItem.title.cgColor

        }

        if indexPath.row == 1 {

            labelNew.removeFromSuperview()
            collectionView.cellForItem(at:myIndex2)?.addSubview(labelNew2)
            labelNew2.layer.backgroundColor = selectedItem.title.cgColor

        }

目前在中心的 CollectionView 单元格周围画一个圆圈的正确方法是什么？

【问题讨论】：

你能分享任何示例项目吗？
@Dharmesh 是的，例如，我正在使用来自 Github github.com/rserentill/iOS-WheelMenu 的这个项目，我想在可见单元格周围画一个额外的圆圈。所以你可以在这个项目中看到标签在每次单元格更改时都会更改。我想为我将在单元格周围绘制的另一个圆圈做同样的事情。喜欢这里ibb.co/L6nSxjb
我相信这个圆形视图不应该属于集合视图单元格，但也应该作为子视图添加到集合视图的超级视图中。然后只需设置适当的框架，使圆圈与单元格正上方的所需位置匹配。
看看这个：i.gyazo.com/0e7cef36687cbf61c8f3e13d7d988dfd.gif
让我们continue this discussion in chat。

标签： ios swift uicollectionview uicollectionviewcell indexpath

【解决方案1】：

对于您正在使用的library。在您的单元格中添加一个背景图像，该图像将显示为与您的collectionView 相同的大小，并默认设置为hidden。那么您需要在 scrollViewDidScroll 方法中应用逻辑并显示位于中心的单元格的背景图像，例如：

let indexPath = IndexPath(item: currentIndex, section: 0)
if let cell = wheelMenuCollectionView.cellForItem(at: indexPath) as? WheelMenuCollectionViewCell {
    cell.backImage.isHidden = false
}

要删除之前需要添加的单元格背景图片

for (index, _) in items.enumerated() {
    if index != currentIndex {
        let oldIndexPath = IndexPath(item: index, section: 0)
        if let cell = wheelMenuCollectionView.cellForItem(at: oldIndexPath) as? WheelMenuCollectionViewCell {
            cell.backImage.isHidden = true
        }
    }
}

您的 scrollViewDidScroll 方法将如下所示：

func scrollViewDidScroll(_ scrollView: UIScrollView) {

    let maxOffset = scrollView.bounds.width - scrollView.contentSize.width
    let maxIndex = CGFloat(self.items.count - 1)
    let offsetIndex = maxOffset / maxIndex

    let currentIndex = Int(round(-scrollView.contentOffset.x / offsetIndex)).clamped(to: (0 ... self.items.count-1))

    if self.items[currentIndex].id != self.selectedItem.id {
        self.selectedItem = self.items[currentIndex]
    }

    let indexPath = IndexPath(item: currentIndex, section: 0)
    if let cell = wheelMenuCollectionView.cellForItem(at: indexPath) as? WheelMenuCollectionViewCell {
        cell.backImage.isHidden = false
    }

    for (index, _) in items.enumerated() {
        if index != currentIndex {
            let oldIndexPath = IndexPath(item: index, section: 0)
            if let cell = wheelMenuCollectionView.cellForItem(at: oldIndexPath) as? WheelMenuCollectionViewCell {
                cell.backImage.isHidden = true
            }
        }
    }
}

现在在用户启动您需要添加的应用程序时突出显示第一个单元格

DispatchQueue.main.asyncAfter(deadline: .now() + 1.0, execute: {
        let indexPath = IndexPath(item: 0, section: 0)
        if let cell = self.wheelMenuCollectionView.cellForItem(at: indexPath) as? WheelMenuCollectionViewCell {
            cell.backImage.isHidden = false
        }
    })

在您的 viewWillAppear 方法中。

查看THIS 示例项目了解更多信息。

【讨论】：