[英]UITextField inside UIStackView Spacing Issue on width constraint
I have a vertical UIStackView
which has various of UITextFields
(Now It is only 4) inside it. 我有一个垂直的
UIStackView
,里面有各种UITextFields
(现在只有4个)。 When I give spacing to UIStackView, I gave below error; 当我给UIStackView间隔时,我给出了以下错误;
"<NSLayoutConstraint:0x1c4286720 H:|-(0)-[UIStackView:0x104d3e6f0](LTR) (active, names: '|':Hello.OtpInputView:0x104d3c5b0 )>", "<NSLayoutConstraint:0x1c4286770 UIStackView:0x104d3e6f0.right == Hello.OtpInputView:0x104d3c5b0.right (active)>", "<NSLayoutConstraint:0x1c4286860 '_UITemporaryLayoutWidth' Hello.OtpInputView:0x104d3c5b0.width == 0 (active)>", "<NSLayoutConstraint:0x1c4286e50 'UISV-canvas-connection' UIStackView:0x104d3e6f0.leading == Hello.CustomOtpTextField:0x10588d600.leading (active)>", "<NSLayoutConstraint:0x1c4286ea0 'UISV-canvas-connection' H:[Hello.CustomOtpTextField:0x105082600]-(0)-| (active, names: '|':UIStackView:0x104d3e6f0 )>", "<NSLayoutConstraint:0x1c4286f40 'UISV-fill-equally' Hello.CustomOtpTextField:0x105024600.width == Hello.CustomOtpTextField:0x10588d600.width (active)>", "<NSLayoutConstraint:0x1c4287030 'UISV-fill-equally' Hello.CustomOtpTextField:0x105077a00.width == Hello.CustomOtpTextField:0x10588d600.width (active)>", "<NSLayoutConstraint:0x1c42871c0 'UISV-fill-equally' Hello.CustomOtpTextField:0x105082600.width == Hello.CustomOtpTextField:0x10588d600.width (active)>", "<NSLayoutConstraint:0x1c4286ef0 'UISV-spacing' H:[Hello.CustomOtpTextField:0x10588d600]-(10)-[Hello.CustomOtpTextField:0x105024600] (active)>", "<NSLayoutConstraint:0x1c4286fe0 'UISV-spacing' H:[Hello.CustomOtpTextField:0x105024600]-(10)-[Hello.CustomOtpTextField:0x105077a00] (active)>", "<NSLayoutConstraint:0x1c42870d0 'UISV-spacing' H:[Hello.CustomOtpTextField:0x105077a00]-(10)-[Hello.CustomOtpTextField:0x105082600] (active)>"
)
)
Will attempt to recover by breaking constraint
将尝试通过打破约束来恢复
How I declare StackView: 我如何声明StackView:
stackView.translatesAutoresizingMaskIntoConstraints = false
stackView.axis = .horizontal
stackView.distribution = .fillEqually
stackView.spacing = 10
//textFields is just an array of UITextFields
textFields.enumerated().forEach { (index,field) in
field.textColor = UIColor.darkGray
field.font = Font.sourceSansRegular?.withSize(46)
field.keyboardType = .numberPad
field.delegate = self
field.translatesAutoresizingMaskIntoConstraints = false
field.tag = index
field.textAlignment = .center
field.myDelegate = self
field.sizeToFit()
stackView.addArrangedSubview(field)
field.widthAnchor.constraint(equalTo: stackView.widthAnchor, multiplier: (CGFloat(0 / textFields.count)),constant: CGFloat(10 * (textFields.count - 1))).isActive = true
}
self.addSubview(stackView)
stackView.anchor(self.topAnchor, left: self.leftAnchor, bottom: self.bottomAnchor, right: self.rightAnchor, topConstant: 0, leftConstant: 0, bottomConstant: 0, rightConstant: 0, widthConstant: 0, heightConstant: 0)
What I want Is that for example UIStackView
has 110pt width and 10 space then UITextFields
should has 20pt ((20 * 4) + (3 * 10) which is 110). 我想要的是例如
UIStackView
具有110pt的宽度和10个空间,然后UITextFields
应该具有20pt((20 * 4)+(3 * 10),即110)。 Therefore, all UITextFields
should has same width (Fill Equally) 因此,所有
UITextFields
应该具有相同的宽度(均等填充)
How can I achieve this? 我该如何实现?
EDIT: I think I need to specify at least one width for one TextField so I added 编辑:我想我需要为一个TextField指定至少一种宽度,所以我添加了
field.widthAnchor.constraint(equalTo: stackView.widthAnchor, multiplier: (CGFloat(0 / textFields.count)),constant: CGFloat(10 * (textFields.count - 1))).isActive = true
However this also give break error. 但是,这也会产生中断错误。
EDIT2: This stack view is in a custom UIView and I'm giving anchors inside EDIT2:此堆栈视图位于自定义UIView中,我在其中提供锚点
override init(frame: CGRect) {
super.init(frame: frame)
//Where I gave all anchors
setupUI()
}
Also How I initialize this custom UIView 还有我如何初始化此自定义UIView
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
self.view.backgroundColor = UIColor.white
self.view.addSubview(otpField)
otpField.anchor(self.view.topAnchor, left: self.view.leftAnchor, bottom: nil, right: self.view.rightAnchor, topConstant: 40, leftConstant: 40, bottomConstant: 0, rightConstant: 40, widthConstant: 0, heightConstant: 60)
}
What I want to achieve in a picture: 我要在图片中实现的目标:
You just need to add a single constraint for height if you already set the stackView.distribution = .fillEqually
add a constraint to any of your textFiled like this 如果已经设置了
stackView.distribution = .fillEqually
, stackView.distribution = .fillEqually
需要添加一个高度限制,就可以像这样向所有stackView.distribution = .fillEqually
添加限制
let height = NSLayoutConstraint(item: textField1, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .height, multiplier: 1.0, constant: 40.0)
textField1.addConstraint = height
By doing this way All of your textfield will be of height 40 and the total size will depend on the number of item and spacing given for ie Height = 40
, Space = 10
Then Total height will be (Height * Number of textfields) + (Space * (number of textfield - 1))
通过这种方式,您所有的文本字段的高度将为40,总大小将取决于项的数量和间距,即
Height = 40
, Space = 10
则总高度将为(Height * Number of textfields) + (Space * (number of textfield - 1))
NOTE : Concept is same for vertical and horizontal stackview you need to play with height and width.
注意:垂直和水平堆栈视图的概念相同,您需要使用高度和宽度来播放。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.