使用视觉格式语言的 UIButtons 之间的等间距
Posted
技术标签:
【中文标题】使用视觉格式语言的 UIButtons 之间的等间距【英文标题】:Equal spacing between UIButtons using visual format language 【发布时间】:2015-10-15 20:05:38 【问题描述】:我有一堆 UIButtons 我想在容器视图中均匀地间隔,现在我有这个间距限制:
someView.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|-(>=0)-[M]-(>=0)-[T]-(>=0)-[W]-(>=0)-[ T]-(>=0)-[F]-(>=0)-[S]-(>=0)-[S]-(>=0)-|",选项:NSLayoutFormatOptions.AlignAllCenterY,指标:无,视图:buttonsArray))
但是这使得按钮看起来像这样:
问题是我想要的间距是这样计算的:
间距 = (someView.frame.width - (someView.frame.height * 0.6) * 7) / 8
someView.frame.height * 0.6
是按钮的边长。我不知道该怎么办。
【问题讨论】:
到底是什么问题?你想有一个恒定的空间还是不能有像 10 , 12, 20 固定数字这样的间距。你真的需要计算吗? 这不可能完全像你描述的那样。一些约束不能用可视格式语言创建,必须使用更详细的初始化器NSLayoutConstraint
或使用NSLayoutAnchor
创建。要创建多个相同宽度的空白空间,您还需要调查UILayoutGuide
。
【参考方案1】:
这是一个简单的代码,它确实在视图中准确地分配按钮之间的空间,我希望这将帮助您了解您的用例,
let containerView = UIView(frame: CGRect.zero)
containerView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(containerView)
let M = UIButton(type: .System)
M.translatesAutoresizingMaskIntoConstraints = false
M.backgroundColor = UIColor.lightGrayColor()
M.setTitle("M", forState: .Normal)
containerView.addSubview(M)
let T = UIButton(type: .System)
T.translatesAutoresizingMaskIntoConstraints = false
T.setTitle("T", forState: .Normal)
T.backgroundColor = UIColor.lightGrayColor()
containerView.addSubview(T)
let W = UIButton(type: .System)
W.translatesAutoresizingMaskIntoConstraints = false
W.setTitle("W", forState: .Normal)
W.backgroundColor = UIColor.lightGrayColor()
containerView.addSubview(W)
let Th = UIButton(type: .System)
Th.translatesAutoresizingMaskIntoConstraints = false
Th.setTitle("T", forState: .Normal)
Th.backgroundColor = UIColor.lightGrayColor()
containerView.addSubview(Th)
let F = UIButton(type: .System)
F.translatesAutoresizingMaskIntoConstraints = false
F.setTitle("F", forState: .Normal)
F.backgroundColor = UIColor.lightGrayColor()
containerView.addSubview(F)
let S = UIButton(type: .System)
S.translatesAutoresizingMaskIntoConstraints = false
S.setTitle("S", forState: .Normal)
S.backgroundColor = UIColor.lightGrayColor()
containerView.addSubview(S)
let Su = UIButton(type: .System)
Su.translatesAutoresizingMaskIntoConstraints = false
Su.setTitle("Su", forState: .Normal)
Su.backgroundColor = UIColor.lightGrayColor()
containerView.addSubview(Su)
let views = [
"M": M,
"T": T,
"W": W,
"Th":Th,
"F": F,
"S": S,
"Su": Su
]
let horizontalSpacing = 20
let cornerMargin = 30
let metrics = [
"horizontalSpacing": horizontalSpacing,
"cornerMargin": cornerMargin
]
views.values.forEach view in
view.clipsToBounds = true
view.layer.cornerRadius = 10
let verticalCenter = NSLayoutConstraint(item: containerView, attribute: .CenterY, relatedBy: .Equal, toItem: view, attribute: .CenterY, multiplier: 1.0, constant: 0)
let horizontalCenter = NSLayoutConstraint(item: containerView, attribute: .CenterX, relatedBy: .Equal, toItem: view, attribute: .CenterX, multiplier: 1.0, constant: 0)
view.addConstraint(verticalCenter)
view.addConstraint(horizontalCenter)
let horizontalFormat = "H:|-(==cornerMargin)-[M]-horizontalSpacing-[T]-horizontalSpacing-[W]-horizontalSpacing-[Th]-horizontalSpacing-[F]-horizontalSpacing-[S]-horizontalSpacing-[Su]-(==cornerMargin)-|"
let horizontalConstraints = NSLayoutConstraint.constraintsWithVisualFormat(horizontalFormat, options: .AlignAllCenterY, metrics: metrics, views: views)
view.addConstraints(horizontalConstraints)
let verticalFormat = "V:|-[M]-|"
let verticalConstraints = NSLayoutConstraint.constraintsWithVisualFormat(verticalFormat, options: .AlignAllCenterY, metrics: metrics, views: views)
view.addConstraints(verticalConstraints)
结果如下,
【讨论】:
以上是关于使用视觉格式语言的 UIButtons 之间的等间距的主要内容,如果未能解决你的问题,请参考以下文章
使用视觉格式化语言在代码中自动布局 UIViewController