Ios 如何以编程方式将UIStackview放入Swift中的UIView中

我想在UIView中放置5个图像的Stackview。基本上我想要的是做一个带阴影的圆形按钮，在按钮内水平放置5个不同的小图像

我已经有了一个viewcontroller，每个都有一个声明和设置功能。我能使你的视野开阔

以下是我试图实现的目标：

我如何解决这个问题

我已经有了一些代码：

private let btnUIView: UIView = {
        let btnUIView = UIView(frame: CGRect(x: 50, y: 50, width: 343, height: 77))
        btnUIView.layer.shadowColor = UIColor.black.cgColor
        btnUIView.layer.shadowOpacity = 0.5
        btnUIView.layer.shadowOffset = .zero
        btnUIView.layer.shadowRadius = 3
        btnUIView.backgroundColor = .white
        btnUIView.translatesAutoresizingMaskIntoConstraints = false
        btnUIView.layer.borderWidth = 0
        btnUIView.layer.borderColor = UIColor.gray.cgColor
        return btnUIView
    }()

 private let btnStackView: UIStackView = {
        let image = UIStackView()
        image.translatesAutoresizingMaskIntoConstraints = false
        image.distribution = .fillEqually
//        image.spacing = 60
        return image
    }()




func setupBtnView(){
        view.addSubview(btnUIView)
        btnUIView.addSubview(btnStackView)
        NSLayoutConstraint.activate([
            btnUIView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            btnUIView.topAnchor.constraint(equalTo: btnText.bottomAnchor, constant: 15),
            btnUIView.heightAnchor.constraint(equalToConstant: btnUIView.frame.height),
            btnUIView.widthAnchor.constraint(equalToConstant: btnUIView.frame.width),
        ])


let imgone = UIImageView(image: #imageLiteral(resourceName: "imgtest1"))
        let imgtwo = UIImageView(image: #imageLiteral(resourceName: "imgtest1"))
        let imgthree = UIImageView(image: #imageLiteral(resourceName: "imgtest1"))
        let imgfour = UIImageView(image: #imageLiteral(resourceName: "imgtst1"))
        let imgfive = UIImageView(image: #imageLiteral(resourceName: "imgtest1"))




btnStackView.addArrangedSubview(imgone)
btnStackView.addArrangedSubview(imgtwo)
btnStackView.addArrangedSubview(imgthree)
btnStackView.addArrangedSubview(imgfour)
btnStackView.addArrangedSubview(imgfive)

imgone.contentMode = .scaleAspectFill
imgtwo.contentMode = .scaleAspectFill
imgthree.contentMode = .scaleAspectFill
imgfour.contentMode = .scaleAspectFill
imgfive.contentMode = .scaleAspectFill


imgone.clipsToBounds = true
imgtwo.clipsToBounds = true
imgthree.clipsToBounds = true
imgfour.clipsToBounds = true
imgfive.clipsToBounds = true
    }


func setupImages(){
        view.addSubview(btnStackView)
        NSLayoutConstraint.activate([
            btnStackView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            btnStackView.topAnchor.constraint(equalTo: btnUIView.bottomAnchor, constant: 20),
            btnStackView.widthAnchor.constraint(equalToConstant: btnStackView.frame.width)
        ])

我在应用程序中看到的是一个空的UIView：

---

这似乎很简单。我花了大约两分钟的时间编写代码，让我们了解到：

这只是对你所追求的东西的一个粗略的描述，但它表明基本的想法是足够简单的。我所做的只是：

创建外部视图，使用圆角边框对其进行配置，并将其添加为子视图

创建堆栈视图，将其配置为等间距等，并将其作为子视图添加到外部视图中

使用图像创建五个图像视图（此处仅为圆形），并将它们作为排列的子视图添加到堆栈视图中

实际上，我的

viewDidLoad

中只有11行代码

---

至于您的代码（您现在已经展示了），主要的问题可能是约束没有意义。以下是我对代码的更正（出于测试目的，替换我自己的圆圈图像）；这是我的测试应用程序视图控制器的全部代码：

private let btnUIView: UIView = {
    let btnUIView = UIView()
    btnUIView.layer.shadowColor = UIColor.black.cgColor
    btnUIView.layer.shadowOpacity = 0.5
    btnUIView.layer.shadowOffset = .zero
    btnUIView.layer.shadowRadius = 3
    btnUIView.backgroundColor = .white
    btnUIView.translatesAutoresizingMaskIntoConstraints = false
    btnUIView.layer.borderWidth = 0
    btnUIView.layer.borderColor = UIColor.gray.cgColor
    return btnUIView
}()
private let btnStackView: UIStackView = {
    let image = UIStackView()
    image.translatesAutoresizingMaskIntoConstraints = false
    image.distribution = .fillEqually
    image.alignment = .center
    return image
}()

override func viewDidLoad() {
    super.viewDidLoad()
    let r = UIGraphicsImageRenderer(size: CGSize(width: 30, height: 30))
    let im = r.image { _ in UIBezierPath.init(ovalIn: CGRect(x: 1, y: 1, width: 28, height: 28)).stroke() }

    let imgone = UIImageView(image: im)
    let imgtwo = UIImageView(image: im)
    let imgthree = UIImageView(image: im)
    let imgfour = UIImageView(image: im)
    let imgfive = UIImageView(image: im)
    
    btnStackView.addArrangedSubview(imgone)
    btnStackView.addArrangedSubview(imgtwo)
    btnStackView.addArrangedSubview(imgthree)
    btnStackView.addArrangedSubview(imgfour)
    btnStackView.addArrangedSubview(imgfive)
    
    setupBtnView()
}

func setupBtnView(){
    view.addSubview(btnUIView)
    btnUIView.addSubview(btnStackView)
    NSLayoutConstraint.activate([
        btnUIView.centerXAnchor.constraint(equalTo: view.centerXAnchor),
        btnUIView.topAnchor.constraint(equalTo: view.topAnchor, constant: 40),
        btnUIView.heightAnchor.constraint(equalToConstant: 100),
        btnUIView.widthAnchor.constraint(equalToConstant: 300),
    ])
    NSLayoutConstraint.activate([
        btnStackView.leadingAnchor.constraint(equalTo: btnUIView.leadingAnchor),
        btnStackView.trailingAnchor.constraint(equalTo: btnUIView.trailingAnchor),
        btnStackView.topAnchor.constraint(equalTo: btnUIView.topAnchor),
        btnStackView.bottomAnchor.constraint(equalTo: btnUIView.bottomAnchor),
    ])
}

结果:

---

我在编辑中添加了代码。你能看一下吗？我在寻找一个解决方案，但主要是人们在StackView中以另一种方式询问UIView。好吧，你有一些垃圾约束，比如

btnUIView.heightAnchor.constraint（equalToConstant:btnUIView.frame.height）

（不要在约束中谈论某个东西的框架，这些概念是相互对立的），但主要问题是空堆栈视图是不可见的，而堆栈视图是空的：其中的五个图像在哪里？此外，在代码中，您似乎已经忘记了哪个视图是哪个视图。：）您似乎多次添加与子视图相同的堆栈视图，这毫无意义。我已经指定了下面的图像。我可以在里面放一个UILabel，没有问题，但是它不会显示图像。“我已经指定了下面的图像。”在你给我看的代码中没有，你没有。现在它应该显示在编辑中，我很抱歉。