将 UILabel 放在集合视图的中心？

Posted 2023-03-14

【中文标题】将 UILabel 放在集合视图的中心？

【英文标题】：Putting UILabel in center of Collection View?

【发布时间】：2016-11-22 05:19:15

【问题描述】：

我希望 UILabel 以背景颜色出现在我的 Collection View 的中心。但是，当我将一个拖到 Storyboard 中的视图上并设置其背景颜色时，它似乎占据了整个视图。相反，我希望它只占用一个小的矩形部分，该部分仅围绕其中的文本。这是我拥有的以及我希望它看起来的样子：

当前：

目标：

有没有办法手动设置标签的高度和宽度？我希望它继续当前出现在集合视图中生成的单元格上的行为，但只占用有限的空间而不是占用整个视图。

【问题讨论】：

设置你想要的标签框架，最后使 label.layer.makstobound = true

您确定要将标签作为集合的子视图吗？

@AhmadF 我只是希望它始终出现在视图的中间，并带有一个可以更改其文本和不透明度的插座

将一个uiview拖到你的viewcontroller外面并在代码中作为子view使用

将标签拖到集合视图上时按住命令，将阻止它添加为集合视图的子视图。您的集合视图正在为其框架提供标签。

【参考方案1】：

编辑：

感谢@robmayoff 评论说在collection view controller的情况下这个解决方案是不可能的。

仅当您有 常规视图控制器 但没有 集合视图控制器时，此答案才适用。

我之所以没有删除它，是因为 - 希望 - 它可能对其他一些观众有用。

---

我建议：

让label后面的collectionView：

从这里（文档大纲）：

将标签拖到 collectionView 的顶部（而不是作为子视图）。确保两个组件在同一层次结构中，但标签位于 collectionView 后面。完成此操作后，

双击标签（也来自文档大纲）：

现在您可以将它移动到视图的中心（例如，通过使用键盘上的箭头），确保它位于屏幕的中心。

添加适当的约束，让标签始终位于屏幕中心。

使collectionView的背景透明（清晰的颜色）。

就是这样！

我希望这会有所帮助。

【讨论】：

您不能将标签放在集合视图控制器场景内的集合视图顶部。集合视图始终是集合视图控制器场景中的根视图。场景中的所有其他视图必须是集合视图的后代。他们不能是它的兄弟姐妹。

【参考方案2】：

拖动一个 UIView 并将其放在集合视图中以完全覆盖它。 拖动 UILabel 并在情节提要中设置其高度和宽度约束，并在水平和垂直方向上设置中心约束。

您还需要在代码中设置集合视图的高度和宽度，如下所示

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
return CGSize(width: collectionView.frame.width, height: cellHeight)

【参考方案3】：

请按以下步骤操作：

创建一个 CollectionView 的扩展

在其中添加下面的函数。

  extension UICollectionView 
  func setMessage(_ message: String) 
      let messageLabel = UILabel(frame: CGRect(x: 0, y: 0, width: self.bounds.size.width, height: self.bounds.size.height))
      messageLabel.text = message
      messageLabel.textColor = .black
      messageLabel.numberOfLines = 0
      messageLabel.textAlignment = .center
      messageLabel.sizeToFit()

      self.backgroundView = messageLabel
   
  func removeMessage() 
      self.backgroundView = nil
  
  

如果您想删除该消息，只需使用上述removeMessage() 函数即可。

用法

设置消息：

self.collcetionview.setMessage("message")

要删除消息：

self.collcetionview.removeEmptyMessage()