代码之家  ›  专栏  ›  技术社区  ›  Ümañg ßürmån

在DesignView和运行时,UITextView倾斜

  •  -1
  • Ümañg ßürmån  · 技术社区  · 6 年前

    情况:

    如上图所示,我使用xcode 9设计了布局,设计完成后不久,我注意到一个奇怪的 layout issue.

    如果仔细观察,可以观察到 uilabels are being“斜面”or“tilted”toward the right.

    问题:

    知道为什么会这样吗?在开发了一半的应用程序之后,我第一次观察到了这一点。以前从未发生过。

    注: 没有 swift code written for designing,everything is aligned using autolayout , stackview and uilabel 。如果您想让我提供任何代码,我会按要求发布。

    如有任何帮助,我们将不胜感激。谢谢,

    . : enter image description here

    情况:

    如上图所示,我使用 XCODE 9 设计完成后不久,我发现 layout 问题。

    如果你仔细观察,你可以观察 UILabels 正在向右“倾斜”或“倾斜”。

    问题:

    知道为什么会这样吗?在开发了一半的应用程序之后,我第一次观察到了这一点。以前从未发生过。

    注: 没有 Swift 为设计而编写的代码,所有内容都使用 AutoLayout , StackView UILabel . 如果你要我提供任何代码,我会按要求发布。

    如有任何帮助,我们将不胜感激。谢谢。

    1 回复  |  直到 6 年前
        1
  •  2
  •   rob mayoff    6 年前

    我用了一个图像编辑器添加一些非常水平的红线到你的故事板屏幕截图。红线使我们更容易理解为什么它看起来是倾斜:

    所有标签都有完美的水平基线,所有灰色标签都正确对齐(垂直对齐)。

    The_斜面_157;appears because your black__---_ labels are not aligned vertical with each other.

    你没有给我足够的信息来解释为什么你的仪表板标签没有垂直对齐,但也许你现在有足够的信息来自己跟踪问题。如果没有,请编辑您的问题,以包含有关如何配置和约束仪表板标签的更多信息。

    更新< /H3>

    我已经上传了一个故事板 to this gist that shows how I would lay out out this view.

    以下是我在故事板中所做的:

    在每一个并排放置一行两个标签的地方,将它们放在水平堆栈视图中,对齐设置为__第一个基线_,分布设置为__,均匀填充_。如果需要在行周围填充,请将堆栈视图的布局页边距(在“大小检查器”中)更改为“固定页边距”,并将页边距设置为获取所需的填充。因此:

    这是我的文档大纲:

    所有标签都配置了水平内容拥抱优先级251,垂直内容拥抱优先级1000,并且两个轴的内容压缩阻力优先级都设置为1000:。

    所有水平行堆栈视图都配置了__fixed__layout margins,其中左侧和右侧设置为8,顶部和底部根据需要设置。例如,包含__available credits_和__used credits_157;标签的堆栈视图具有以下边距:

    storyboard with red lines

    所有标签都有完美的水平基线,所有灰色标签都正确对齐(垂直)。

    _斜面_157;出现是因为您的黑色__---_标签没有垂直对齐。

    你没有给我足够的信息来解释为什么你的仪表板标签没有垂直对齐,但也许你现在有足够的信息来自己跟踪问题。如果没有,请编辑问题以包含有关如何配置和约束仪表板标签的更多信息。

    更新

    我上传了一个故事板 to this gist 这说明了我将如何布局这个视图。

    以下是我在故事板中所做的:

    在每一个并排放置一行两个标签的地方,将它们放在水平堆栈视图中,对齐设置为__第一个基线_,分布设置为__,均匀填充_。如果需要在行周围填充,请将堆栈视图的布局页边距(在“大小检查器”中)更改为“固定页边距”,并将页边距设置为获取所需的填充。因此:

    storyboard screen shot

    这是我的文档大纲:

    document outline

    所有标签都配置了水平内容拥抱优先级251、垂直内容拥抱优先级1000,并且两个轴的内容压缩阻力优先级都设置为1000:

    label intrinsic content size priorities

    所有水平行堆栈视图都配置了__fixed__layout margins,其中左侧和右侧设置为8,顶部和底部根据需要设置。例如,包含__available credits_和__used credits_157;标签的堆栈视图具有以下边距:

    credits labels row margins

    推荐文章