以编程方式在swift中添加完整大小的视图

时间:2016-09-19 15:43:25

标签: ios swift

我正在使用iMessage应用程序,并以编程方式添加了一个视图。但是,我似乎无法确定正确的约束,以使其始终保持正确的大小。例如,如果我将扩展名留给另一个并返回到该视图,则视图向下移动几百px。我认为这与.isActive有关。我的目标是让视图自动调整大小以保持正确的大小或占用完整的可用高度和宽度。

func createBrowser() {
    let controller = MSStickerBrowserViewController(stickerSize: .small)
    addChildViewController(controller)
    view.addSubview(controller.view)

    controller.view.translatesAutoresizingMaskIntoConstraints = false
    controller.stickerBrowserView.backgroundColor = UIColor.blue
    controller.stickerBrowserView.dataSource = self

    view.topAnchor.constraint(equalTo: controller.view.topAnchor).isActive = true
    view.bottomAnchor.constraint(equalTo: controller.view.bottomAnchor).isActive = true
    view.leftAnchor.constraint(equalTo: controller.view.leftAnchor).isActive = true
    view.rightAnchor.constraint(equalTo: controller.view.rightAnchor).isActive = true
    view.centerXAnchor.constraint(equalTo: controller.view.centerXAnchor).isActive = true
    view.centerYAnchor.constraint(equalTo: controller.view.centerYAnchor).isActive = true
}

屏幕截图:https://d17oy1vhnax1f7.cloudfront.net/items/1F2B0s3v0s1k3E2L0Z07/Screen%20Shot%202016-09-19%20at%2011.42.51%20AM.png

2 个答案:

答案 0 :(得分:0)

更好地解释我把以下内容放在一起的事情。这演示了两种修复子视图布局的方法。使用约束时,我更喜欢将约束创建为数组并一次性激活它们,正如您将在createredSquareWithConstraints的代码中看到的那样。约束只是将一个视图的特征与另一个视图的特征相关联的线性方程。例如,在“伪代码”中,我的数组中的第一个约束可以写成:

“将子视图的前边距设置为容器视图前导边距的1倍加上常量0。”

(这就是为什么我之前感到困惑,因为它看起来好像你是根据其子视图的特征设置包含视图的约束。)

虽然使用布局约束仍然完全有效,但我认为目前首选的方法是覆盖viewWillTransitionToSize()委托方法,该方法只是要求您在给定包含视图的大小的情况下指定框架的内容。视图控制器的子视图应该是。因此,我也包含了一个实现,创建一个带有初始帧的黄色方块,然后在调用viewWillTransitionToSize时修改该方框。我个人发现使用布局约束时不那么繁琐。

如果你躺在按钮上并旋转屏幕,你会发现任何一种方法都能达到同样的效果。 [NB我将一个正方形标记为受约束而一个不受约束,但实际上它们当然都受到约束,只是以不同的方式。我想补充一点,这显然不是你在实践中做的事情 - 你应该选择一种方法并坚持下去,否则你的代码就会到处都是!]。

希望有所帮助!

import UIKit

class ViewController: UIViewController {

    var constrainedredSquare : UIView!
    var unconstrainedRedSquare : UIView!
    var methodOneButton : UIButton!
    var methodTwoButton : UIButton!

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        self.view.backgroundColor = UIColor.blue

        func getButton(name: String) -> UIButton {
            let button : UIButton = UIButton()
            button.backgroundColor = UIColor.white
            button.layer.cornerRadius = 3
            button.clipsToBounds = true
            button.setTitle(name, for: UIControlState.normal)
            button.setTitleColor(UIColor.black, for: UIControlState.normal)
            return button
        }

        self.methodOneButton = getButton(name: "Red - Constraints")
        self.methodTwoButton = getButton(name: "Yellow - viewWillTransitionToSize")

        self.methodOneButton.addTarget(self, action: #selector(self.createRedSquareWithConstraints), for: .touchUpInside)
        self.methodTwoButton.addTarget(self, action: #selector(self.createYellowSquareWithoutConstraints), for: .touchUpInside)
        self.methodOneButton.frame = CGRect(origin: CGPoint(x: 200, y: 100), size: CGSize(width: 300, height: 300))
        self.methodTwoButton.frame = CGRect(origin: CGPoint(x: self.view.frame.width - 500, y: 100), size: CGSize(width: 300, height: 300))
        self.view.addSubview(self.methodOneButton)
        self.view.addSubview(self.methodTwoButton)

    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
        if let _ = self.unconstrainedRedSquare {
            self.unconstrainedRedSquare.frame = CGRect(origin: CGPoint.zero, size: size)
        }
        self.methodOneButton.frame = CGRect(origin: CGPoint(x: 200, y: 100), size: CGSize(width: 300, height: 300))
        self.methodTwoButton.frame = CGRect(origin: CGPoint(x: size.width - 500, y: 100), size: CGSize(width: 300, height: 300))
    }


    func createYellowSquareWithoutConstraints() {
        if let _ = self.unconstrainedRedSquare {
            self.unconstrainedRedSquare.removeFromSuperview()
        }
        else
        {
            if let _ = constrainedredSquare {
                self.constrainedredSquare.removeFromSuperview()
            }
            self.unconstrainedRedSquare = UIView()
            self.unconstrainedRedSquare.backgroundColor = UIColor.yellow
            self.unconstrainedRedSquare.frame = CGRect(origin: CGPoint.zero, size: self.view.frame.size)
            self.view.addSubview(self.unconstrainedRedSquare)

            self.view.bringSubview(toFront: self.methodOneButton)
            self.view.bringSubview(toFront: self.methodTwoButton)
        }

    }

    func createRedSquareWithConstraints() {
        if let _ = self.constrainedredSquare {
            self.constrainedredSquare.removeFromSuperview()
        }
        else
        {
            if let _ = self.unconstrainedRedSquare {
                self.unconstrainedRedSquare.removeFromSuperview()
            }
            let redSquare : UIView = UIView()
            redSquare.backgroundColor = UIColor.red

            self.view.addSubview(redSquare)

            self.view.bringSubview(toFront: self.methodOneButton)
            self.view.bringSubview(toFront: self.methodTwoButton)

            let rsConstraints : [NSLayoutConstraint] = [NSLayoutConstraint(item: redSquare, attribute: NSLayoutAttribute.leading, relatedBy: NSLayoutRelation.equal, toItem: self.view, attribute: NSLayoutAttribute.leading, multiplier: 1.0, constant: 0),
                                                 NSLayoutConstraint(item: redSquare, attribute: NSLayoutAttribute.trailing, relatedBy: NSLayoutRelation.equal, toItem: self.view, attribute: NSLayoutAttribute.trailing, multiplier: 1.0, constant: 0),
                                                 NSLayoutConstraint(item: redSquare, attribute: NSLayoutAttribute.top, relatedBy: NSLayoutRelation.equal, toItem: self.view, attribute: NSLayoutAttribute.top, multiplier: 1.0, constant: 0),
                                                 NSLayoutConstraint(item: redSquare, attribute: NSLayoutAttribute.bottom, relatedBy: NSLayoutRelation.equal, toItem: self.view, attribute: NSLayoutAttribute.bottom, multiplier: 1.0, constant: 0),
                                                 NSLayoutConstraint(item: redSquare, attribute: NSLayoutAttribute.width, relatedBy: NSLayoutRelation.equal, toItem: self.view, attribute: NSLayoutAttribute.width, multiplier: 1.0, constant: 0),
                                                 NSLayoutConstraint(item: redSquare, attribute: NSLayoutAttribute.height, relatedBy: NSLayoutRelation.equal, toItem: self.view, attribute: NSLayoutAttribute.height, multiplier: 1.0, constant: 0)]
            redSquare.translatesAutoresizingMaskIntoConstraints = false
            NSLayoutConstraint.activate(rsConstraints)
        }
    }
}

答案 1 :(得分:0)

您可以将我的扩展程序用于UIView。它允许在任何一侧添加额外的填充(仅在您需要时):

public extension UIView {
    typealias ConstraintsTupleStretched = (top:NSLayoutConstraint, bottom:NSLayoutConstraint, leading:NSLayoutConstraint, trailing:NSLayoutConstraint)
    func addSubviewStretched(subview:UIView?, insets: UIEdgeInsets = UIEdgeInsets() ) -> ConstraintsTupleStretched? {
        guard let subview = subview else {
            return nil
        }

        subview.translatesAutoresizingMaskIntoConstraints = false
        addSubview(subview)

        let constraintLeading = NSLayoutConstraint(item: subview,
                                                   attribute: .Left,
                                                   relatedBy: .Equal,
                                                   toItem: self,
                                                   attribute: .Left,
                                                   multiplier: 1,
                                                   constant: insets.left)
        addConstraint(constraintLeading)

        let constraintTrailing = NSLayoutConstraint(item: self,
                                                    attribute: .Right,
                                                    relatedBy: .Equal,
                                                    toItem: subview,
                                                    attribute: .Right,
                                                    multiplier: 1,
                                                    constant: insets.right)
        addConstraint(constraintTrailing)

        let constraintTop = NSLayoutConstraint(item: subview,
                                               attribute: .Top,
                                               relatedBy: .Equal,
                                               toItem: self,
                                               attribute: .Top,
                                               multiplier: 1,
                                               constant: insets.top)
        addConstraint(constraintTop)

        let constraintBottom = NSLayoutConstraint(item: self,
                                                  attribute: .Bottom,
                                                  relatedBy: .Equal,
                                                  toItem: subview,
                                                  attribute: .Bottom,
                                                  multiplier: 1,
                                                  constant: insets.bottom)
        addConstraint(constraintBottom)
        return (constraintTop, constraintBottom, constraintLeading, constraintTrailing)
    }

}

用法:

view.addSubviewStretched(tableView)

let BorderedBackgroundInset = UIEdgeInsets(top: 1, left: 1, bottom: 1, right: 1)
view?.addSubviewStretched(calendar.view, insets: BorderedBackgroundInset)