【问题标题】:Auto layout not set properly when give equal width constrains to buttons为按钮提供相等宽度约束时,自动布局设置不正确
【发布时间】:2016-10-05 13:30:42
【问题描述】:

我看到了许多解决方案并应用了自动布局约束,但我仍然没有得到想要的解决方案。

当前结果:

给所有按钮的约束:

查看层次结构:

【问题讨论】:

  • 您想要的解决方案是什么?
  • 你能告诉我们你的故事板控制器上是否有警告吗?
  • @Damien:它没有给出任何警告
  • @Rajan:希望解决方案与故事板中显示的所有按钮宽度相等
  • @user2017279 能否显示视图层次结构并显示此设计中所有设备的预览。

标签: ios autolayout


【解决方案1】:

假设您想要的是让 3 个按钮彼此相等并使用 Interface Builder 填充屏幕宽度(没有代码,即:不是以编程方式),这是一个解决方案:

您不需要将它们添加到视图中。只需按照以下步骤操作:

让我们从这个开始:

请注意,按钮还没有任何约束,只需将它们添加到视图底部(或者您想要显示它们的任何位置,对于此解决方案,我将它们显示在底部屏幕)。确保它们中的 3 个具有相同的大小。

橙色按钮添加约束:

添加以下约束: 前导、底部空间和等高。

蓝色按钮添加约束:

添加以下约束: 尾随、底部空间和等高。

青色按钮添加约束:

  • ctrl + 从青色按钮拖动到橙色按钮并添加以下约束:水平间距和垂直居中。

  • ctrl + 从青色按钮拖动到蓝色按钮并添加以下约束:水平间距。

  • 底部空间和等高。

到目前为止一切顺利,我们几乎完成了!

现在,选择 3 个按钮并添加以下约束:等宽。

您的按钮应如下所示:

现在,您所要做的就是选择两个水平间距约束中的每一个,并将它们的常量设置为 0(来自尺寸检查器):

你去吧:

我希望这会有所帮助,干杯。

【讨论】:

    【解决方案2】:

    对不起,代码中的解决方案..Swift 3.0:

        let button1 = UIButton()
        let button2 = UIButton()
        let button3 = UIButton()
        let buttons = [button1, button2, button3]
        button1.backgroundColor = .red
        button2.backgroundColor = .blue
        button3.backgroundColor = .green
        buttons.forEach {
            $0.translatesAutoresizingMaskIntoConstraints = false
            view.addSubview($0)
        }
        buttons.forEach {
            let cnt1 = NSLayoutConstraint(item: $0, attribute: .centerY, relatedBy: .equal, toItem: view, attribute: .centerY, multiplier: 1, constant: 0)
            let cnt2 = NSLayoutConstraint(item: $0, attribute: .height, relatedBy: .equal, toItem: view, attribute: .height, multiplier: 0.2, constant: 0)
            view.addConstraints([cnt1, cnt2])
        }
        let cnt1 = NSLayoutConstraint(item: button1, attribute: .leading, relatedBy: .equal, toItem: view, attribute: .leading, multiplier: 1, constant: 0)
        let cnt2 = NSLayoutConstraint(item: view, attribute: .trailing, relatedBy: .equal, toItem: button3, attribute: .trailing, multiplier: 1, constant: 0)
        let cnt3 = NSLayoutConstraint(item: button2, attribute: .width, relatedBy: .equal, toItem: button1, attribute: .width, multiplier: 1, constant: 0)
        let cnt4 = NSLayoutConstraint(item: button3, attribute: .width, relatedBy: .equal, toItem: button2, attribute: .width, multiplier: 1, constant: 0)
        let cnt5 = NSLayoutConstraint(item: button2, attribute: .leading, relatedBy: .equal, toItem: button1, attribute: .trailing, multiplier: 1, constant: 0)
        let cnt6 = NSLayoutConstraint(item: button3, attribute: .leading, relatedBy: .equal, toItem: button2, attribute: .trailing, multiplier: 1, constant: 0)
        view.addConstraints([cnt1, cnt2, cnt3, cnt4, cnt5, cnt6])
    

    【讨论】:

      【解决方案3】:

      您是否要在水平方向布置三个高度和宽度相等的按钮?我认为你可以在不使用 UIViews 的情况下实现这一点。我设置了如下约束。

      这是一个模拟器截图。

      【讨论】:

        猜你喜欢
        • 2017-06-14
        • 2023-03-22
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2013-06-23
        • 2021-10-28
        • 2019-01-19
        • 1970-01-01
        相关资源
        最近更新 更多