使用可视格式语言在其超级视图中居中视图

Question

我刚刚开始学习iOS的AutoLayout,并看了一下Visual Format Language.

这一切都很好,除了一件事:我只是无法在其超级视图中找到中心.
这可能与VFL有关,还是我需要自己手动创建约束？

Answer 1

目前,不,看起来不能仅使用VFL 将视图置于超视图中心.然而,使用单个VFL字符串和单个额外约束(每个轴)执行此操作并不困难:

VFL: "|-(>=20)-[view]-(>=20)-|"

[NSLayoutConstraint constraintWithItem:view
                             attribute:NSLayoutAttributeCenterX
                             relatedBy:NSLayoutRelationEqual
                                toItem:view.superview
                             attribute:NSLayoutAttributeCenterX
                            multiplier:1.f constant:0.f];

有人会认为你只能做到这一点(这是我在看到这个问题时最初的想法和尝试):

[NSLayoutConstraint constraintsWithVisualFormat:@"|-(>=20)-[view(==200)]-(>=20)-|"
                                 options: NSLayoutFormatAlignAllCenterX | NSLayoutFormatAlignAllCenterY
                                 metrics:nil
                                   views:@{@"view" : view}];

我尝试了上面的许多不同变体试图将它弯曲到我的意愿,但即使明确地为两个轴(H:|V:)明确地具有两个单独的VFL字符串,这似乎也不适用于superview .然后,我开始尝试,准确地隔离时的选项也得到应用的VFL.他们似乎并不适用于VFL的上海华盈,仅适用于(在某些情况下,令人失望的),它们在VFL字符串提到任何明确的意见.

我希望将来Apple增加了一些新的选项,让VFL选项考虑到superview,即使只在VFL中的superview之外只有一个显式视图时这样做.另一种解决方案可能是传递给VFL的另一种选择,例如:NSLayoutFormatOptionIncludeSuperview.

不用说,我学到了很多关于VFL试图回答这个问题的知识.

Answer 2

是的,可以使用Visual Format Language将视图置于其超视图中.垂直和水平.这是演示:

https://github.com/evgenyneu/center-vfl

Answer 3

我认为手动创建约束更好.

[superview addConstraint:
 [NSLayoutConstraint constraintWithItem:view
                              attribute:NSLayoutAttributeCenterX
                              relatedBy:NSLayoutRelationEqual
                                 toItem:superview
                              attribute:NSLayoutAttributeCenterX
                             multiplier:1
                               constant:0]];
[superview addConstraint:
 [NSLayoutConstraint constraintWithItem:view
                              attribute:NSLayoutAttributeCenterY
                              relatedBy:NSLayoutRelationEqual
                                 toItem:superview
                              attribute:NSLayoutAttributeCenterY
                             multiplier:1
                               constant:0]];

现在我们可以使用NSLayoutAnchor以编程方式定义AutoLayout:

(适用于iOS 9.0及更高版本)

view.centerXAnchor.constraint(equalTo: superview.centerXAnchor).isActive = true
view.centerYAnchor.constraint(equalTo: superview.centerYAnchor).isActive = true

我建议使用SnapKit,它是一个DSL,可以在iOS和macOS上轻松实现自动布局.

view.snp.makeConstraints({ $0.center.equalToSuperview() })

Answer 4

绝对有可能这样做:

[NSLayoutConstraint constraintsWithVisualFormat:@"H:[view]-(<=1)-[subview]"
                                        options:NSLayoutFormatAlignAllCenterY
                                        metrics:nil
                                          views:NSDictionaryOfVariableBindings(view, subview)];

从这里学到了这一点. 上面的代码显然是Y中心的子视图.

Swift3:

        NSLayoutConstraint.constraints(withVisualFormat: "H:[view]-(<=1)-[subview]",
                                       options: .alignAllCenterY,
                                                       metrics: nil,
                                                       views: ["view":self, "subview":_spinnerView])

Answer 5

添加以下代码,并将您的按钮放在屏幕中央.绝对可能.

[self.view addConstraints:[NSLayoutConstraint
                           constraintsWithVisualFormat:@"H:|-[button]-|"
                           options:NSLayoutFormatAlignAllCenterY
                           metrics:0
                           views:views]];

[self.view addConstraints:[NSLayoutConstraint
                           constraintsWithVisualFormat:@"V:|-[button]-|"
                           options:NSLayoutFormatAlignAllCenterX
                           metrics:0
                           views:views]];