UITableViewCell 中嵌套的 UIStackViews 中的 UILabel 有时会被截断
UILabel inside nested UIStackViews inside UITableViewCell sometimes truncating
我的其中一个表设置中有一个表视图单元格包含以下视图层次结构
外部水平堆栈视图在尾部、前导、底部和顶部边缘固定到单元格的内容视图。
右侧标签固定到其父级 stackViewHackView 的尾部、前部、底部和顶部边缘
在我的控制器代码中,我将单元格设置为动态高度以适应单元格的内容,这样它们就可以根据内容大小增大或缩小
tableView.rowHeight = UITableViewAutomaticDimension
tableView.estimatedRowHeight = 30.0
关于自动布局设置。 (粗体中的相关优先级)
- 外部水平堆栈视图
- 内容拥抱优先级 == 250
- 内容压缩阻力优先级 == 750
- 内部垂直堆栈视图
- 内容拥抱优先级 == 750
- 内容压缩阻力优先级 == 750
- 左侧标签 1
- 内容拥抱优先级 == 750
- 内容压缩阻力优先级 == 750
- 左标签 2
- 内容拥抱优先级 == 750
- 内容压缩阻力优先级 == 750
- 视图(只是将左侧的两个标签填充到堆栈视图的顶部)
- 内容拥抱优先级 == 250
- 内容压缩阻力优先级 == h:750; v:250
- stackViewHackView(使多行标签在堆栈视图和单元格中正常增长)
- 内容拥抱优先级 == 250
- 内容压缩阻力优先级 == h:250; v:750
- 降低水平阻力以允许此视图压缩以适应左侧堆栈视图
- 右标签
- 内容拥抱优先级 == 250
- 内容压缩阻力优先级 == h:250; v:750
- 降低水平阻力以允许此视图压缩以适应左侧堆栈视图
我使用以下代码在一个简单的测试应用程序中用测试数据填充此单元格
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell
{
let cell = tableView.dequeueReusableCell(withIdentifier: "testCell", for: indexPath) as! TestTableViewCell
// Configure the cell...
if indexPath.section == 0
{
cell.leftLabel1?.text = "Label1 aabbccdd"
cell.leftLabel2?.text = "Label2 aabbccdd"
cell.rightLabel?.text = "Cell \(indexPath.row) with a 'really really' long string that needs displaying clearly and causing the table cell to resize to fit the content. We're looking for about 3 or 4 lines of text to be displayed"
}
else if indexPath.section == 1
{
cell.leftLabel1?.text = "Label1 aabbccdd"
cell.leftLabel2?.text = "Label2 aabbccdd"
cell.rightLabel?.text = "Cell \(indexPath.row) with a 'really really really' long string that needs displaying clearly and causing the table cell to resize to fit the content. We're looking for about 3 or 4 lines of text to be displayed"
}
else
{
cell.leftLabel1?.text = "Label1 aabbccdd"
cell.leftLabel2?.text = "Label2 aabbccdd"
cell.rightLabel?.text = "Cell \(indexPath.row) with a 'really really really really really really really really' long string that needs displaying clearly and causing the table cell to resize to fit the content. We're looking for about 3 or 4 lines of text to be displayed"
}
return cell
}
这会导致模拟器在 iPhone 7 目标
上呈现以下效果
中间的表格视图单元格是我一直想要获得的那种输出。我不希望左侧标签被截断,它们的内容总是足够小以适合右侧。然而,鉴于右侧的某些内容,较长的标签 2 有时会被截断,如您在顶部和底部行中所见。
我设置了内容压缩阻力,使得左侧的所有元素都具有高压缩阻力,而右侧的元素设置为较低的阻力,这样它们应该压缩为 space左侧元素。
知道为什么会发生这种情况,或者我如何才能阻止这种情况发生,以便我的标签始终正确显示?
干杯!
(根据 OP 添加为答案)
这可能只是 "how it seems to me" 但是...我看到很多人使用包裹在堆栈视图中的堆栈视图包裹在堆栈视图中,而带有约束的简单视图可以完成这项工作。
看看我在这个项目中是如何做到的:github.com/DonMag/CellTest2
这真的非常简单,您可以查看标签,看看我在更改优先级方面所做的工作有多么少。我使用了您的示例字符串,并添加了更多案例来测试变体。
我的其中一个表设置中有一个表视图单元格包含以下视图层次结构
外部水平堆栈视图在尾部、前导、底部和顶部边缘固定到单元格的内容视图。
右侧标签固定到其父级 stackViewHackView 的尾部、前部、底部和顶部边缘
在我的控制器代码中,我将单元格设置为动态高度以适应单元格的内容,这样它们就可以根据内容大小增大或缩小
tableView.rowHeight = UITableViewAutomaticDimension
tableView.estimatedRowHeight = 30.0
关于自动布局设置。 (粗体中的相关优先级)
- 外部水平堆栈视图
- 内容拥抱优先级 == 250
- 内容压缩阻力优先级 == 750
- 内部垂直堆栈视图
- 内容拥抱优先级 == 750
- 内容压缩阻力优先级 == 750
- 左侧标签 1
- 内容拥抱优先级 == 750
- 内容压缩阻力优先级 == 750
- 左标签 2
- 内容拥抱优先级 == 750
- 内容压缩阻力优先级 == 750
- 视图(只是将左侧的两个标签填充到堆栈视图的顶部)
- 内容拥抱优先级 == 250
- 内容压缩阻力优先级 == h:750; v:250
- stackViewHackView(使多行标签在堆栈视图和单元格中正常增长)
- 内容拥抱优先级 == 250
- 内容压缩阻力优先级 == h:250; v:750
- 降低水平阻力以允许此视图压缩以适应左侧堆栈视图
- 右标签
- 内容拥抱优先级 == 250
- 内容压缩阻力优先级 == h:250; v:750
- 降低水平阻力以允许此视图压缩以适应左侧堆栈视图
我使用以下代码在一个简单的测试应用程序中用测试数据填充此单元格
override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell
{
let cell = tableView.dequeueReusableCell(withIdentifier: "testCell", for: indexPath) as! TestTableViewCell
// Configure the cell...
if indexPath.section == 0
{
cell.leftLabel1?.text = "Label1 aabbccdd"
cell.leftLabel2?.text = "Label2 aabbccdd"
cell.rightLabel?.text = "Cell \(indexPath.row) with a 'really really' long string that needs displaying clearly and causing the table cell to resize to fit the content. We're looking for about 3 or 4 lines of text to be displayed"
}
else if indexPath.section == 1
{
cell.leftLabel1?.text = "Label1 aabbccdd"
cell.leftLabel2?.text = "Label2 aabbccdd"
cell.rightLabel?.text = "Cell \(indexPath.row) with a 'really really really' long string that needs displaying clearly and causing the table cell to resize to fit the content. We're looking for about 3 or 4 lines of text to be displayed"
}
else
{
cell.leftLabel1?.text = "Label1 aabbccdd"
cell.leftLabel2?.text = "Label2 aabbccdd"
cell.rightLabel?.text = "Cell \(indexPath.row) with a 'really really really really really really really really' long string that needs displaying clearly and causing the table cell to resize to fit the content. We're looking for about 3 or 4 lines of text to be displayed"
}
return cell
}
这会导致模拟器在 iPhone 7 目标
上呈现以下效果中间的表格视图单元格是我一直想要获得的那种输出。我不希望左侧标签被截断,它们的内容总是足够小以适合右侧。然而,鉴于右侧的某些内容,较长的标签 2 有时会被截断,如您在顶部和底部行中所见。
我设置了内容压缩阻力,使得左侧的所有元素都具有高压缩阻力,而右侧的元素设置为较低的阻力,这样它们应该压缩为 space左侧元素。
知道为什么会发生这种情况,或者我如何才能阻止这种情况发生,以便我的标签始终正确显示?
干杯!
(根据 OP 添加为答案)
这可能只是 "how it seems to me" 但是...我看到很多人使用包裹在堆栈视图中的堆栈视图包裹在堆栈视图中,而带有约束的简单视图可以完成这项工作。
看看我在这个项目中是如何做到的:github.com/DonMag/CellTest2
这真的非常简单,您可以查看标签,看看我在更改优先级方面所做的工作有多么少。我使用了您的示例字符串,并添加了更多案例来测试变体。