0

我正在尝试执行下图所示的以下任务

到目前为止，这就是我所拥有的约束，“娱乐”字符串由categoryLabel表示，“Disney：build it freeze”由nameLabel 表示。

在此处输入图像描述

addConstraints(withFormat: "H:|-8-[v0(90)]-8-[v1]-8-|", views: imageView, nameLabel)
addConstraints(withFormat: "V:|-8-[v0(90)]", views: imageView)

addConstraints(withFormat: "H:[v0]-8-[v1]", views: imageView, nameLabel)
addConstraints(withFormat: "V:|-8-[v0]-8-[v1]", views: nameLabel, categoryLabel)

func addConstraints(withFormat format: String, views: UIView...) {
    var viewsDictionary = [String: UIView]()
    for (index, view) in views.enumerated() {
        let key = "v\(index)"
        view.translatesAutoresizingMaskIntoConstraints = false
        viewsDictionary[key] = view
    }

    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: format, options: NSLayoutFormatOptions(), metrics: nil, views: viewsDictionary))
}

我遇到的问题是如何将“类别标签”添加到约束中，使其与 imageView 的右侧对齐 8 个像素，并在 nameLabel 的正下方对齐 8 个像素。正如您从屏幕截图中看到的那样，我可以将其放置在 nameLabel 下方，但我很难将其设置为“categorylabel”也位于图像视图的右侧。

任何提示将不胜感激:)

我希望它看起来像什么 在此处输入图像描述

4

1 回答 1

1

不幸的是，通过包装NSLayoutConstraint.constraints您自己的函数，您阻止了对所需功能的访问，即指定.alignAllLeading NSLayoutFormatOptionsnameLabel-category 约束。

本质上，您需要的是：

NSLayoutConstraint.constraints(withVisualFormat: "V:|-8-[v0]-8-[v1]", options: .alignAllLeading, metrics: nil, views: viewsDictionary))

这将告诉自动布局您希望两个项目的前缘对齐并垂直分隔 8。由于您的名称字段已经相对于图像视图的边缘定位，这会将您的类别字段放在您想要的位置.

你可以重构你的addConstraints函数来接受 NSLayoutFormatOptions：

func addConstraints(withFormat format: String, options: NSLayoutFormatOptions = NSLayoutFormatOptions(), views: UIView...) {

var viewsDictionary = [String: UIView]()
    for (index, view) in views.enumerated() {
        let key = "v\(index)"
        view.translatesAutoresizingMaskIntoConstraints = false
        viewsDictionary[key] = view
    }

    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: format, options: options, metrics: nil, views: viewsDictionary))
}

然后调用它：

addConstraints(withFormat: "V:|-8-[v0]-8-[v1]", options: .alignAllLeading, views: nameLabel, categoryLabel)

顺便说一句，您不需要使用故事板来使用堆栈视图。

于 2017-02-05T03:02:07.630 回答