如何将“自定义"单元格与“右详细信息"和“基本"单元格对齐? [英] How to align Custom cells to Right Detail and Basic cells?

查看:95
本文介绍了如何将“自定义"单元格与“右详细信息"和“基本"单元格对齐?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用包含4个部分的静态单元格来创建设置"场景:

I am using static cells with 4 sections to create a Settings scene:

对于某些单元格,我使用预定义的样式: Right Detail Basic .

For some cells I use the predefined styles: Right Detail and Basic.

但是对于以下单元格,我会根据自己的约束使用自定义样式:

But for the following cells I use Custom style with my own constraints:

    左侧为
  • 标签,右侧为 Switch (就像上面屏幕截图中选择的单元格一样)
  • 滑块占据整个单元格
  • Label on the left and Switch on the right side (like the cell selected in above screenshot)
  • Slider occupying the whole cell

我的问题:我无法正确获得前导对齐方式,而且我的两行自动换行 Label Switch 推到了正确:

My problems: I can not get the leading alignment right and also my 2-lines word-wrapping Label pushes a Switch to the right:

如您在顶部屏幕截图中所见,我对自定义单元中有问题的 Label 的约束是:

As you can see at the top screenshot, my constraints for the problematic Label in Custom cell are:

  • 将中心Y对齐到超级视图:0像素
  • 要进行预览的领先空间:2个像素(与 Right Detail Basic 不匹配)
  • 将空格拖到 Switch 等于或大于:4个像素(仍然将 Switch 推到右侧太远)
  • Align Center Y to Superview: 0 pixels
  • Leading Space to Superview: 2 pixels (does not match Right Detail and Basic)
  • Trailing Space to Switch equal or greater than: 4 pixels (still pushes the Switch too far to the right)

请帮助,我想知道其他带有设置"屏幕的应用程序是如何做到的.

Please help, I wonder how other apps with Settings screens do it.

解决方案:

  1. 我未选中限制边距,并将领先空间设置为15像素(感谢安德烈)
  2. 我已经解决了第二个问题,方法是将标签水平内容压缩优先级降低到250
  1. I have unchecked Constrain to Margins and set Leading Space to 15 pixels (thanks Andre)
  2. I have solved my 2nd problem by lowering Horizontal Content Compression Resistance Priority of the Label to 250

推荐答案

如果使用自动布局,

您可以在其中打开保留超级视图保证金"

you can turn on "Preserve Superview Margins" in

  1. 内容视图
  2. 您的标签和切换
  3. 您的自定义表格视图单元格

并保留Label的前导空格和Switch的尾随空格为0(默认值)

and leave Label's leading space and Switch's trailing space to 0 (default)

这篇关于如何将“自定义"单元格与“右详细信息"和“基本"单元格对齐?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆