Question

我正在尝试在iOS中创建一个包含Label和相关图像的自定义UITableViewCell。图片必须尽可能靠近标签的后沿。

下面是到目前为止的进度图像。红色区域是Horizontal UIStackView，在其中放置了UILabel（绿色）和UIImageView（青色）。

UILabel设置为Lines = 0。

我玩过许多UIStackView的Distribution和Alignment属性，并且过去一直很好地利用本文A UIStackView Hack for Stacking Child Views Compactly中概述的方法。与该文章中的技术保持一致，我有第三个透明视图，该视图具有Lower ContentHugggingPriority，因此占用了大部分空间。几乎可以使用，但是某种原因导致标签在该固定点处缠绕，看起来好像是整个宽度的1/3。

并非所有行都将显示图像。

有人对如何实现这种布局还有其他建议吗？我尝试使用普通的旧版Autolayout（没有UIStackView），但是还有其他问题

Answer 1

这可能就是您想要的...

使用以下设置将堆栈视图限制为顶部和底部页边距，前页边距+ 12和后页边距>= 12

Axis: Horizontal
Alignment: Top
Distribution: Fill
Spacing: 0

图片视图的宽度和高度限制为24

标签没有约束，但具有：

Content Compression Resistance Priority
    Horizontal: Required (1000)

结果（顶部设置有图像视图，底部设置无）：

Answer 2

尽管我已为此问题标记DonMag's answer as THE answer，但我正在以编程方式创建视图时包含自己的答案，这是我的最终解决方案。

首先为标签和图像创建UISTackView容器

this.drugNameStackView = new UIStackView()
{
    TranslatesAutoresizingMaskIntoConstraints = false,
    Axis = UILayoutConstraintAxis.Horizontal,
    Alignment = UIStackViewAlignment.Top,
    Distribution = UIStackViewDistribution.Fill,
    Spacing = 0
};

然后已经创建了UILabel，将其添加到StackView并设置“压缩阻力”

this.drugNameStackView.AddArrangedSubview(this.drugNameLabel);
this.drugNameLabel.SetContentCompressionResistancePriority(1000.0f, UILayoutConstraintAxis.Horizontal);

解决方案的关键部分以及我从DonMag的答案中学到的主要知识，其中这两个约束是我添加到ContentView的

this.ContentView.AddConstraints(
    new[]
    {
        NSLayoutConstraint.Create(this.drugNameStackView, NSLayoutAttribute.Leading, NSLayoutRelation.Equal, this.ContentView, NSLayoutAttribute.LeadingMargin, 1.0f, 0),
        NSLayoutConstraint.Create(this.ContentView, NSLayoutAttribute.TrailingMargin, NSLayoutRelation.GreaterThanOrEqual, this.drugNameStackView, NSLayoutAttribute.Trailing, 1.0f, 0),
    });

请注意，约束NSLayoutRelation.GreaterThanOrEqual约束的第一项是ContentView，第二项是UISTackView

UIStackView-将图像定位在兄弟姐妹的边缘

2 个答案: