UILabel 不能同时包裹和对齐
UILabel can not be wrapped and aligned at the same time
我无法同时换行和对齐显示在 UITableViewCell
中的 UILabel
。
我希望一些 UILabel(在下面显示为白色背景)右对齐
如果文本太长,则换行。为了澄清下面的截图:
UILabel
白底就是我说的标签
- 我正在使用两种不同类型的单元格(分别具有蓝色和橙色背景)
UITableView
有类似粉红色的背景
- 显示
UITableView
的ViewController
背景为浅灰色
要么对齐正确但文字没有换行(其实文字"Long.. "很长,请看第二张截图)
或者文本已正确换行但未右对齐:
我的代码基于本教程:How to build a Table View with multiple cell types
在以橙色背景显示的单元格的代码中:
class AttributeCell: UITableViewCell {
@IBOutlet weak var titleLabel: UILabel?
@IBOutlet weak var valueLabel: UILabel?
let orange = UIColor(red: 1, green: 165/255, blue: 0, alpha: 1)
var item: AttributeLabelLabel? {
didSet {
titleLabel?.backgroundColor = .white
titleLabel?.setLabel(contentText: (item?.attributeNameFromLocalizable)!, alignmentText: .right)
valueLabel?.backgroundColor = .green
valueLabel?.setLabel(contentText: (item?.attributeValue)!, alignmentText: .left)
self.backgroundColor = orange
}
}
static var nib:UINib {
return UINib(nibName: identifier, bundle: nil)
}
static var identifier: String {
return String(describing: self)
}
}
我在 UILabel
中添加了一个扩展来设置单元格上显示的两个标签的对齐方式和文本,所有标签的文本换行方式都是相同的。
标签下方的扩展名对齐但未换行(请参见上面的第一个屏幕截图)。
extension UILabel{
func setLabel(contentText: String, alignmentText: NSTextAlignment){
self.text = contentText
self.textAlignment = alignmentText
self.numberOfLines = 0
self.lineBreakMode = .byWordWrapping // inefficient alone
}
}
如果我想让文本换行,那么我必须添加对 sizeToFit()
的调用,但是短标签(请参阅带有文本 "Short" 的标签)没有右对齐(请参阅上面的第二个屏幕截图)。
extension UILabel{
func setLabel(contentText: String, alignmentText: NSTextAlignment){
self.text = contentText
self.textAlignment = alignmentText
self.numberOfLines = 0
self.lineBreakMode = .byWordWrapping
self.sizeToFit() // allow text to be effectivly wrapped
}
}
为什么我需要在文档中指定 self.sizeToFit()
我发现只提到使用 lineBreakMode
来换行文本?
因为我无法处理自动换行和文本对齐,所以我想将 UILabel 的宽度与其文本进行比较,并根据比较来处理对齐(对于足够短的文本)或换行 (如果文本太长)。但是我没有找到如何获取 UILabel 的宽度。
另一个想法是创建自定义 UILabel 并在代码中设置所有约束、压缩和阻力。目前没有限制:
有人已经处理过这样的问题吗?
是否可以同时处理文本换行和文本对齐?
注:
在第二个屏幕截图中,带有换行文本的 UILabel
与单元格边界重叠。这不是第一个问题,我现在可以忍受,但如果有人对此有所暗示......
我实际上使用以下代码来处理不同高度的单元格:
cell?.estimatedRowHeight = 200
cell?.rowHeight = UITableView.automaticDimension
一个UILabel
绝对可以右对齐并换行。这是一个例子:
实际上,标签内容具有误导性,因为它包含四行! ;-)
这可以通过 AutoLayout 约束和 UILabel
上的正确设置来实现。这个特定的 UILabel
受到如下限制:
- 垂直居中
- 领先超级视野
- 宽度
这里是约束条件,如 Interface Builder 所示:
最后,要对多行进行 UILabel
换行,需要通过 Interface Builder 或代码将其 numberOfLines
属性 设置为 0。
您还可以使用 textAlignment
属性 右对齐文本,将其设置为 .right
,再次通过 Interface Builder 或代码。
您缺少一些约束条件。
要让多行标签换行,必须限制其宽度(否则它怎么知道文本太长?)。
要获得自动布局以调整单元格的高度,您需要将单元格的内容限制在 "push down" 单元格的底部。
所以...
- 将您的左上角标签限制为
Leading: 0
、Top: 0
、Width: 77
(根据您的图片,我使用 77 作为宽度)。
- 将您的右上角标签限制为
Leading: 8
(到左上角标签的尾部)、Top: 0
、Trailing: 0
- 将您的左下角标签限制为
Leading: 0
、Top: 8
(到左上角标签的底部)、Width: 77
(或者,宽度等于左上角标签)
- 将您的右下角标签限制为
Leading: 8
(到左下角标签的尾部),Top: 8
(到右上角标签的底部,或 Top: 0
到底部的顶部-左标签), Trailing: 0
然后,将 >= 0
的 Bottom
约束添加到每个底部标签。
我猜底部标签可能会换行,所以将每行设置为 Number of Lines: 0
布局:
结果:
我无法同时换行和对齐显示在 UITableViewCell
中的 UILabel
。
我希望一些 UILabel(在下面显示为白色背景)右对齐 如果文本太长,则换行。为了澄清下面的截图:
UILabel
白底就是我说的标签- 我正在使用两种不同类型的单元格(分别具有蓝色和橙色背景)
UITableView
有类似粉红色的背景- 显示
UITableView
的ViewController
背景为浅灰色
要么对齐正确但文字没有换行(其实文字"Long.. "很长,请看第二张截图)
或者文本已正确换行但未右对齐:
我的代码基于本教程:How to build a Table View with multiple cell types
在以橙色背景显示的单元格的代码中:
class AttributeCell: UITableViewCell {
@IBOutlet weak var titleLabel: UILabel?
@IBOutlet weak var valueLabel: UILabel?
let orange = UIColor(red: 1, green: 165/255, blue: 0, alpha: 1)
var item: AttributeLabelLabel? {
didSet {
titleLabel?.backgroundColor = .white
titleLabel?.setLabel(contentText: (item?.attributeNameFromLocalizable)!, alignmentText: .right)
valueLabel?.backgroundColor = .green
valueLabel?.setLabel(contentText: (item?.attributeValue)!, alignmentText: .left)
self.backgroundColor = orange
}
}
static var nib:UINib {
return UINib(nibName: identifier, bundle: nil)
}
static var identifier: String {
return String(describing: self)
}
}
我在 UILabel
中添加了一个扩展来设置单元格上显示的两个标签的对齐方式和文本,所有标签的文本换行方式都是相同的。
标签下方的扩展名对齐但未换行(请参见上面的第一个屏幕截图)。
extension UILabel{
func setLabel(contentText: String, alignmentText: NSTextAlignment){
self.text = contentText
self.textAlignment = alignmentText
self.numberOfLines = 0
self.lineBreakMode = .byWordWrapping // inefficient alone
}
}
如果我想让文本换行,那么我必须添加对 sizeToFit()
的调用,但是短标签(请参阅带有文本 "Short" 的标签)没有右对齐(请参阅上面的第二个屏幕截图)。
extension UILabel{
func setLabel(contentText: String, alignmentText: NSTextAlignment){
self.text = contentText
self.textAlignment = alignmentText
self.numberOfLines = 0
self.lineBreakMode = .byWordWrapping
self.sizeToFit() // allow text to be effectivly wrapped
}
}
为什么我需要在文档中指定 self.sizeToFit()
我发现只提到使用 lineBreakMode
来换行文本?
因为我无法处理自动换行和文本对齐,所以我想将 UILabel 的宽度与其文本进行比较,并根据比较来处理对齐(对于足够短的文本)或换行 (如果文本太长)。但是我没有找到如何获取 UILabel 的宽度。
另一个想法是创建自定义 UILabel 并在代码中设置所有约束、压缩和阻力。目前没有限制:
是否可以同时处理文本换行和文本对齐?
注:
在第二个屏幕截图中,带有换行文本的 UILabel
与单元格边界重叠。这不是第一个问题,我现在可以忍受,但如果有人对此有所暗示......
我实际上使用以下代码来处理不同高度的单元格:
cell?.estimatedRowHeight = 200
cell?.rowHeight = UITableView.automaticDimension
一个UILabel
绝对可以右对齐并换行。这是一个例子:
实际上,标签内容具有误导性,因为它包含四行! ;-)
这可以通过 AutoLayout 约束和 UILabel
上的正确设置来实现。这个特定的 UILabel
受到如下限制:
- 垂直居中
- 领先超级视野
- 宽度
这里是约束条件,如 Interface Builder 所示:
最后,要对多行进行 UILabel
换行,需要通过 Interface Builder 或代码将其 numberOfLines
属性 设置为 0。
您还可以使用 textAlignment
属性 右对齐文本,将其设置为 .right
,再次通过 Interface Builder 或代码。
您缺少一些约束条件。
要让多行标签换行,必须限制其宽度(否则它怎么知道文本太长?)。
要获得自动布局以调整单元格的高度,您需要将单元格的内容限制在 "push down" 单元格的底部。
所以...
- 将您的左上角标签限制为
Leading: 0
、Top: 0
、Width: 77
(根据您的图片,我使用 77 作为宽度)。 - 将您的右上角标签限制为
Leading: 8
(到左上角标签的尾部)、Top: 0
、Trailing: 0
- 将您的左下角标签限制为
Leading: 0
、Top: 8
(到左上角标签的底部)、Width: 77
(或者,宽度等于左上角标签) - 将您的右下角标签限制为
Leading: 8
(到左下角标签的尾部),Top: 8
(到右上角标签的底部,或Top: 0
到底部的顶部-左标签),Trailing: 0
然后,将 >= 0
的 Bottom
约束添加到每个底部标签。
我猜底部标签可能会换行,所以将每行设置为 Number of Lines: 0
布局:
结果: