【问题标题】:Auto Layout to dynamically size uilabel width自动布局以动态调整 uilabel 宽度
【发布时间】:2014-01-14 22:00:29
【问题描述】:

所以我在 Storyboard 中有两个并排的 UILabel。第二个标签应与第一个标签的右边缘对接(尾随约束为 1),但我还需要第一个标签(左侧的标签)将其宽度设置为等于其内容大小,除非它达到最大宽度.视觉上:


|标记一个文本| |标记两个文本|


我需要以下约束:

1) 标签一个应该调整宽度,除非它达到最大尺寸。

2) 标签二应始终与标签一的右边缘对接

如何在 Storyboard 中进行设置?

【问题讨论】:

    标签: ios storyboard constraints autolayout


    【解决方案1】:
    1. 在标签之间创建 1 点水平空间:按住 Control 并从 label2 拖动到 label1。从弹出窗口中选择水平间距。双击约束。将常数更改为 1。
    2. label1 一个最大宽度:选择label1。转到顶部菜单栏,选择编辑器 > 引脚 > 宽度。双击约束。将关系更改为
    3. 垂直对齐标签:选择两个标签。转到顶部菜单栏,选择编辑器 > 对齐 > 垂直中心。
    4. 您仍然需要设置约束来定义标签在其容器视图中的定位方式。我把它留给你。我将 label1 固定在距根视图左边缘 32 点处,距顶部布局指南 34 点处。
    5. 更新标签的框架,使其反映上述约束: 转到画布右下角的菜单栏。点击“解决自动布局问题”Tie-Fighter 按钮。在弹出窗口中选择“更新所有帧...”。

    注意:请注意,我不必创建约束来使label1 的宽度反映其内容大小。内容大小约束是自动生成的。

    【讨论】:

    • 好的,我成功了,我的内容拥抱优先级和我的抗压优先级是错误的
    • 这是一个巨大的帮助。谢谢!
    • 领带战斗机按钮。洛兹。
    • @pash3r 这取决于你在做什么,但你想更容易压缩的标签,使优先级低(我只是将它们设置为 1)和不能压缩的标签设置为高(1000)
    • 在第二步中给 label1 一个最大宽度:选择 label1。转到顶部菜单栏,选择编辑器 > 引脚 > 宽度。双击约束。将关系更改为 最好使用适当的乘数(即半途为 0.5)为超级视图提供比例宽度。这将使其适用于多种设备(iPhone 和 iPad)
    【解决方案2】:

    请参考以下约束来设置 UIlabel 和 UIButton 灵活宽度;

    【讨论】:

      【解决方案3】:

      请先使用以下代码获取 textSize:

          CGSize  textSize = { 230.0, 10000.0 };
      
          CGSize size = [[NSString stringWithFormat:@"%@", yourLabelText] 
                         sizeWithFont:[UIFont systemFontOfSize:10]
                         constrainedToSize:textSize
                         lineBreakMode:NSLineBreakByWordWrapping]; 
      

      然后使用此内容大小设置您的第一个标签框架:

         UILabel *lblFirst = [[UILabel alloc] initWithFrame:CGRectMake(X, Y, W, size.height)];
         lblFirst.lineBreakMode = YES;
         lblFirst.lineBreakMode = NSLineBreakByWordWrapping;
         lblFirst.numberOfLines =size.height;
         lblFirst.backgroundColor = [UIColor clearColor];
         [self.view addSubview:lblFirst];
      

      那么第二个标签框架将是:

       UILabel *lblFirst = [[UILabel alloc] 
       initWithFrame:CGRectMake(lblFollowerName.frame.size.width + lblFollowerName.frame.origin.x, Y, W, H)];
      

      【讨论】:

      • 我知道如何以纯编程方式进行操作;但是为了学习起见,我想知道这是否可以仅使用自动布局+故事板。
      猜你喜欢
      • 2016-08-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多