safeAreaLayoutGuide to my inputAccesoryView - ios

Question

So with the new iPhone X, some things in my app are in the wrong position. In the bottom of my app, i have an accesoryView, which is basically an UIView with a textfield and other elements. I saw something about safeAreaLayoutGuide in the new iPhone X, but i do not now how to implement in the accessoryView. So i'm trying to find a code to implement it in my app, so the safeArea does not bother me anymore.
This is the code for the inputAccesoryView
lazy var inputContainerView: UIView = {
let containerView = UIView()
containerView.frame = CGRect(x: 0, y: 0, width: self.view.frame.width, height: 50)
containerView.translatesAutoresizingMaskIntoConstraints = false
containerView.backgroundColor = UIColor.white
containerView.addSubview(self.inputTextField)
containerView.addSubview(self.swiche)
containerView.addSubview(self.separatorLineView)
containerView.addSubview(self.uploadImageView)
//x,y,w,h
self.inputTextField.leftAnchor.constraint(equalTo: self.swiche.rightAnchor, constant: 4).isActive = true
self.inputTextField.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true
self.inputTextField.rightAnchor.constraint(equalTo: self.uploadImageView.leftAnchor, constant: 4).isActive = true
self.inputTextField.heightAnchor.constraint(equalTo: containerView.heightAnchor).isActive = true
self.inputTextField.backgroundColor = UIColor.clear
//x,y,w,h
self.swiche.leftAnchor.constraint(equalTo: containerView.leftAnchor, constant: 4).isActive = true
self.swiche.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true
self.swiche.heightAnchor.constraint(equalToConstant: 30).isActive = true
self.swiche.widthAnchor.constraint(equalToConstant: 55).isActive = true
//x,y,w,h
self.uploadImageView.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true
self.uploadImageView.rightAnchor.constraint(equalTo: containerView.rightAnchor).isActive = true
self.uploadImageView.widthAnchor.constraint(equalToConstant: 47).isActive = true
self.uploadImageView.heightAnchor.constraint(equalToConstant: 47).isActive = true
//x,y,w,h
self.separatorLineView.leftAnchor.constraint(equalTo: containerView.leftAnchor).isActive = true
self.separatorLineView.topAnchor.constraint(equalTo: containerView.topAnchor).isActive = true
self.separatorLineView.widthAnchor.constraint(equalTo: containerView.widthAnchor).isActive = true
self.separatorLineView.heightAnchor.constraint(equalToConstant: 1).isActive = true
return containerView
}()
//MARK: AccesoryView
override var inputAccessoryView: UIView? {
get {
return inputContainerView
}
}
Thanks for the help!!!

Answer 1

Just what I thought, all you need to do is accessing safeAreaLayoutGuide class before pointing out the constraint. In your case, you need to change constraints like these:
self.inputTextField.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true
Into constraint like these:
self.inputTextField.centerYAnchor.constraint(equalTo: containerView.safeAreaLayoutGuide.centerYAnchor).isActive = true
Let me know how it goes.

Answer 2

ok, paste this code before lazy var
override func didMoveToWindow() {
super.didMoveToWindow()
if #available(iOS 11.0, *) {
if let window = self.window {
self.bottomAnchor.constraintLessThanOrEqualToSystemSpacingBelow(window.safeAreaLayoutGuide.bottomAnchor, multiplier: 1.0).isActive = true
}
}
}
now your view is up safeAreaLayoutGuide...but at the bottom you can see the tableview because there is no background (your view is up safeAreaLayoutGuide), for correct the problem I built a white uiview, presented it in inputTextField and set the constraint:
let dummyView = UIView()
dummyView.backgroundColor = .white
dummyView.translatesAutoresizingMaskIntoConstraints = false
Now set the constraint:
inputTextField.addSubview(dummyView)
dummyView.topAnchor.constraint(equalTo: inputTextField.bottomAnchor).isActive = true
dummyView.leftAnchor.constraint(equalTo: leftAnchor).isActive = true
dummyView.rightAnchor.constraint(equalTo: rightAnchor).isActive = true
dummyView.heightAnchor.constraint(equalToConstant: 50).isActive = true
This is the hack, but I think that's Xcode bug... I hope this help you...

Answer 3

I hope that for your code you simply add this bottom constraint for inputTextField and in other elements is needed, and set containerView CGRect frame height to 100:
self.inputTextField.bottomAnchor.constraint(equalTo: containerView.safeAreaLayoutGuide.bottomAnchor).isActive = true
and I suppose that you can delete:
self.inputTextField.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true