将水平 UICollectionView 中的一个单元格固定到右侧答案

【问题标题】：Pin one cell in a horizontal UICollectionView to the right将水平 UICollectionView 中的一个单元格固定到右侧
【发布时间】：2016-09-26 11:53:14
【问题描述】：

我正在实现一个行为类似于NSTokenField（例如，邮件中的地址选择器）的控件，以便在 iOS 中使用。我使用水平的UICollectionView，我最右边的单元格是UITextField。此控件将出现在具有其他具有右对齐文本的文本字段的表单中。为了让我的新控件在这种情况下看起来正确，我希望 UITextField 始终位于 UICollectionView 的右边缘，并且选定的标签显示在它的左侧。

目前，当我第一次单击该行时，文本字段会向左滚动，然后随着更多标签的添加而被推到右侧。一旦它与UICollectionView 的右边缘齐平（当下图中添加了“开胃菜”时），我就会开始获得我想要的行为。

我一直在考虑像UITextField 上的最小宽度这样的东西，所以它占用的宽度与最初可用的宽度一样多，而随着标签的添加，它会越来越少。或者，以某种方式将固定字段固定在右侧。不过，我还没有找到实现这些想法的方法！

我怎样才能使文本字段始终位于UICollectionView 的右侧？

【问题讨论】：

标签： ios swift uicollectionview

【解决方案1】：

这是一个解决方案，其中 UITextField 不是 UICollectionView 的一部分。

我在情节提要上添加了 collectionView 和 textField，并具有以下布局约束： CollectionView：通向superview、Height、Top to superview、水平间距与textField。 TextField：高度等于collectionView，尾随到superview，Width = 100，与collectionView的水平间距。

我为 textField 的宽度约束创建了一个 IBOutlet。输入文本时，宽度会动态更改。

Swift 3 示例代码

class ViewController: UIViewController {

    @IBOutlet weak var collectionView: UICollectionView!
    @IBOutlet weak var textField: UITextField!
    @IBOutlet weak var textFieldWidthConstraint: NSLayoutConstraint!

    var textArray: [String] = [String]()

    @IBAction func editingChanged(_ sender: AnyObject) {
        let size = textField.sizeThatFits(textField.frame.size)
        textFieldWidthConstraint.constant = max(size.width,100)

        if textArray.count > 0 {
            self.collectionView.scrollToItem(at: IndexPath(row: self.textArray.count-1, section: 0), at: .right, animated: true)
        }
    }

    @IBAction func addText(_ sender: AnyObject) {
        if textField.text?.characters.count ?? 0 > 0 {
            textArray.append(textField.text!)
            textField.text = ""
            textFieldWidthConstraint.constant = 100
            let newIndexPath = IndexPath(row: textArray.count-1, section: 0)
            collectionView.insertItems(at: [newIndexPath])
            collectionView.performBatchUpdates({
                }, completion: { (_) in
                    self.collectionView.scrollToItem(at: newIndexPath, at: .right, animated: true)
            })
        }
    }

}

【讨论】：

我也在考虑同样的事情......这个答案是一个很好的解决方法。它将产生您所需要的效果。 @Hélène Martin
非常感谢@carien-van-zyl。我会在接下来的几天里玩这个。我为赏金到期道歉——我离开了几天！

【解决方案2】：

作为 UICollectionViewDataSource 的一部分

尝试使用

// 返回的视图必须通过调用 -dequeueReusableSupplementaryViewOfKind:withReuseIdentifier:forIndexPath: - (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath;

并将包含文本字段的视图定义为页脚。

【讨论】：

【解决方案3】：

为了完整起见，如果它给某人一个想法，我最终只是在UICollectionView 上强制按从右到左的顺序，如this answer 中所述。这意味着新标签直接出现在满足我需要的UITextField 的左侧。

【讨论】：