如何通过循环swift 5

这是通过for循环在滚动视图中显示图像视图的方式:

func addPageController() {
        let imgArray = ["AquariumBG","PaludariumBG","TerrariumBG"]

        let scrollContentViewWidthAnchor = scrollContentView.widthAnchor.constraint(equalTo: headerScrollView.widthAnchor,constant:0)
        scrollContentViewWidthAnchor.isactive = true

        for (index,item) in imgArray.enumerated() {
            let imgView = UIImageView()
            imgView.contentMode = .scaleAspectFill
            imgView.image = UIImage(named: item)
            let xPos = CGFloat(index) * UIScreen.main.bounds.size.width

            scrollContentView.addSubview(imgView)
            scrollContentView.translatesAutoresizingMaskintoConstraints = false
            scrollContentView.topAnchor.constraint(equalTo: headerScrollView.topAnchor,constant: 0).isactive = true
            scrollContentView.bottomAnchor.constraint(equalTo: headerScrollView.bottomAnchor,constant: 0).isactive = true
            scrollContentView.leadingAnchor.constraint(equalTo: headerScrollView.leadingAnchor,constant: 0).isactive = true
            scrollContentViewWidthAnchor.constant = xPos

            scrollContentView.setNeedsLayout()
            scrollContentView.layoutIfNeeded()

            imgView.translatesAutoresizingMaskintoConstraints = false
            imgView.topAnchor.constraint(equalTo: scrollContentView.topAnchor,constant: 0).isactive = true
            imgView.bottomAnchor.constraint(equalTo: scrollContentView.bottomAnchor,constant: 0).isactive = true
            imgView.widthAnchor.constraint(equalToConstant: headerScrollView.frame.size.width).isactive = true
            imgView.leadingAnchor.constraint(equalTo: scrollContentView.leadingAnchor,constant: xPos).isactive = true
            imgView.widthAnchor.constraint(equalToConstant: headerScrollView.frame.size.width).isactive = true

            imgView.setNeedsLayout()
            imgView.layoutIfNeeded()
        }
    }

这是输出:

如何通过循环swift 5

显示完美。现在,如果我将页眉向下滑动到屏幕上(因为它是可伸缩的页眉),则第二张图像也会与第一张图像一起显示,如下所示:

如何通过循环swift 5

其原因是因为图像视图没有trailingAnchor.constraint。所以我的问题是,当尚未创建下一个图像视图时,是否可以在循环内设置带有图像视图的尾锚?如果可以,怎么办?任何建议将不胜感激。预先感谢。

我的故事板:

如何通过循环swift 5

SAMPLE PROJECT LINK

cathylia 回答:如何通过循环swift 5

编辑

尽管我仍然建议为imageViews使用堆栈视图,但这不是问题。

查看示例项目后,您可以用一行代码来解决问题。

在循环中:

    for (index,item) in imgArray.enumerated() {
        let imgView = UIImageView()

        // add this line
        imgView.clipsToBounds = true

        // continue with what you had...
        imgView.contentMode = .scaleAspectFill
        // etc...
    }

编辑结束


我建议在滚动视图中放置一个UIStackView,然后将图像视图添加为排列的子视图。

这里是在“普通”视图中使用滚动视图的示例,但是它将直接转换为在表标题视图中使用滚动视图:

class ScrollHeaderTestViewController: UIViewController {

    @IBOutlet var theStackView: UIStackView!
    @IBOutlet var theScrollView: UIScrollView!

    override func viewDidLoad() {
        super.viewDidLoad()
        addPageController()
    }

    func addPageController() -> Void {

        let imgArray = ["AquariumBG","PaludariumBG","TerrariumBG"]

        imgArray.forEach { imgName in
            if let img = UIImage(named: imgName) {
                let v = UIImageView()
                v.translatesAutoresizingMaskIntoConstraints = false
                v.contentMode = .scaleAspectFill
                v.image = img
                theStackView.addArrangedSubview(v)
                v.widthAnchor.constraint(equalTo: theScrollView.frameLayoutGuide.widthAnchor).isActive = true
            }
        }

    }

}

这是在情节提要中的设置方式:

enter image description here

滚动视图被限制在顶部/前导/尾随,高度为150

堆栈视图被限制在滚动视图的“内容布局指南”的所有四个侧面,其高度等于滚动视图的“框架布局指南”的高度。宽度被限制为200(只是我选择的一个随机数,比视图窄),但是该约束具有Priority of 250,这使它可以在您添加排列的子视图时自动展开。

,
  

您可以将collectionView与分页一起使用为true。然后,您可以根据滚动的内容偏移量动态更改代码中的约束,以产生粘性效果。

                     or 

*在此代码中,缺少尾随约束并不是其背后的唯一原因。您可以给图像一个宽度约束。您应该将图像的前导约束赋予其前一个图像的尾随约束,最后一个图像将以其尾随作为容器视图

尝试一下

for (index,item) in imgArray.enumerated() {
            let imgView = UIImageView()
            imgView.contentMode = .scaleAspectFill
            imgView.image = UIImage(named: item)
            var leadingView  = scrollContentView
            //get the view previous view to it
            if index > 0 {
                leadingView = scrollContentView.subviews[index - 1]
            }
            scrollContentView.addSubview(imgView)
            imgView.translatesAutoresizingMaskIntoConstraints = false
            imgView.topAnchor.constraint(equalTo: scrollContentView.topAnchor).isActive = true
            imgView.bottomAnchor.constraint(equalTo: scrollContentView.bottomAnchor).isActive = true
            imgView.widthAnchor.constraint(equalToConstant: headerScrollView.frame.size.width).isActive = true
            imgView.leadingAnchor.constraint(equalTo: leadingView.trailingAnchor).isActive = true
            //if this is last image set the trailingAnchor
            if index == imgArray.count - 1 {
                imgView.trailingAnchor.constraint(equalTo: scrollContentView.trailingAnchor).isActive = true
            }
        }
本文链接:https://www.f2er.com/2992806.html

大家都在问