标签: visual-format-language

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

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

我一直在试图用在雨燕自动布局视觉格式语言,使用NSLayoutConstraint.constraintsWithVisualFormat.这是一些没有用的代码的例子,但据我所知,应该让类型检查器开心:

let foo:[AnyObject]! = NSLayoutConstraint.constraintsWithVisualFormat(
  format: "", options: 0, metrics: {}, views: {})

但是,这会触发编译器错误:

"无法转换表达式的类型'[AnyObject]!' 输入'String!'".

在我认为这是一个值得雷达的bug之前,我有什么明显的遗漏吗？即使没有显式转换变量名,也没有使用其他无偿的向下转换,这种情况就会发生as.我看不出任何理由为什么编译器会期望将其任何部分解析为a String!.

我想使用Apples可视化格式语言将视图约束到iOS 11中的新安全区域布局指南.但是,我得到一个例外:

- [NSLayoutYAxisAnchor nsli_superitem]:无法识别的选择器发送到实例0x1c447ed40

    //Make View Dictionary
    var views: [String: Any] = ["left": self.leftContainer]

    //Check swift version and add appropriate piece to the view dictionary
    if #available(iOS 11, *) {
        views["topGuide"] = self.view.safeAreaLayoutGuide.topAnchor
    }else{
        views["topGuide"] = self.topLayoutGuide
    }

    //Make the constraint using visual format language
    let leftVertical = NSLayoutConstraint.constraints(withVisualFormat: "V:[topGuide][left]|", options: [], metrics: nil, views: views)

    //Add the new constraint
    self.view.addConstraints(vertical)

我喜欢可视化格式语言的原因是因为在某些情况下你可以用更少的代码添加很多约束.

有任何想法吗？

我有一个UI元素(UISwitch实际上,但实际上并不重要),它将前导和尾随空间固定到Interface Builder中的superview.Xcode 6中的约束如下所示:

领先空间的约束是有效的.约束的值是42.0分.

这正是我想要的,因为对于不同的设备,我可以更改layoutMargins属性UIView并且约束将正常工作,以增加视图之间的边距.

现在我想在代码中添加另一个视图,该视图也会将前导和尾随空间固定到它的超级视图边距,因此相同的layoutMargins设置到superview将起作用.

我使用可视格式语言使用以下语法固定视图:

NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"|-42.0-[separatorView]-42.0-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(self.contentView, separatorView)];

[self.contentView addConstraints:constraints];
[self.contentView setNeedsUpdateConstraints];

这是有效的,但layoutMargins属性使用此约束无效,因此它显然不是固定到边距,而是直接固定到superview.

所以我的问题是:

如何使用可视化格式语言将UI元素空间固定到代码中？或者,如果不可能,如何使用constraintWithItem:attribute:relatedBy:toItem:attribute:multiplier:constant:API？

谢谢!

在我们的代码中很多地方，我不断看到这个......

containerView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-0-[view]-0-|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: ["view":childView]))
containerView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|-0-[view]-0-|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: ["view":childView]))

对我来说这似乎是多余的。我想知道是否有一种方法可以将这些格式组合成一个字符串；像这样的东西...

containerView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-0-[view]-0-|;V:|-0-[view]-0-|", options: NSLayoutFormatOptions(rawValue: 0), metrics: nil, views: ["view":childView]))

那么这样的事情可能吗？

我的视图可以在 iPhone 6 屏幕上正确显示，但需要在 iPhone 5 屏幕上滚动。我正在尝试更改一些自动布局约束，以消除在后者上滚动的需要。

这是尝试直观地解释我的情况：

前两张截图是 iPhone 6 和 iPhone 5 上的现有情况。第三张截图是我想要实现的目标（仅在 iPhone 5 上）。

我编写了以下自动布局约束，但我在这里遗漏了一些内容：

[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(>=25,<=50)-[blueView]-(>=25,<=50)-[redView]-5-|"
                                                             options:0
                                                             metrics:nil
                                                               views:nameMap]];

这里应该涉及拥抱和/或抗压吗？以什么方式？

编辑以显示更多我的实际代码：

[self addSubview:loginNSignupScrollView];
[self.loginNSignupScrollView addSubview:logoImageView];
[self.loginNSignupScrollView addSubview:horizo​​ntalScrollView];
[self.loginNSignupScrollView addSubview:appVersionLabel];
[self.horizo​​ntalScrollView addSubview:loginView];


[self addConstraints:[NSLayoutConstraintconstraintWithVisualFormat:@"V:|[loginNSignupScrollView]|"
                                                             选项：0
                                                             指标：无
                                                               视图:nameMap]];

[self addConstraints:[NSLayoutConstraintconstraintWithVisualFormat:@"V:|[loginView(==350)]"
                                                             选项：0
                                                             指标：无
                                                               视图:nameMap]];

[self addConstraints:[NSLayoutConstraint约束WithVisualFormat:@"V:|-(>=30,<=60)-[logoImageView(==35)]-(>=25,<=50)-[horizo​​ntalScrollView]-30-[应用程序版本标签]-5-|”
                                                             选项：0
                                                             指标：无
                                                               视图:nameMap]];

[self addConstraint：[NSLayoutConstraint约束WithItem：self.horizo​​ntalScrollView
                                                 属性：NSLayoutAttributeHeight
                                                 相关者：NSLayoutRelationEqual
                                                    目标项目：自己
                                                 属性：NSLayoutAttributeHeight
                                                乘数：0.0
                                                  常数：350]]；

我有3个标签,我在这张图片中互相放置:

但是现在它们被放置在左侧,我不希望它们被放置在水平中心.以下是水平放置的可视格式代码:

let horizontalConstraints = NSLayoutConstraint.constraintsWithVisualFormat(
            "H:|[label][label2][label3]|",
            options: [],
            metrics: nil,
            views: views)

无论我测试什么,我都无法让他们集中,任何想法？

如何UIView使用自动布局和Apple的可视格式语言设置谁的大小和位置的宽度和高度？

这是代码(view只是变量UIViewController):

// Create and add the view
var stageView = UIView()
stageView.setTranslatesAutoresizingMaskIntoConstraints(false) // Since I'm using Auto Layout I turn this off
view.addSubview(stageView)

// Create and add constraints to the containing view
let viewsDictionary = ["stageView":stageView]
let horizontalConstraints: NSArray = NSLayoutConstraint.constraintsWithVisualFormat("H:|-150-[stageView]-150-|", options: NSLayoutFormatOptions(0), metrics: nil, views: viewsDictionary)
let verticalConstraints: NSArray = NSLayoutConstraint.constraintsWithVisualFormat("V:|-100-[stageView]-150-|", options: NSLayoutFormatOptions.AlignAllCenterX, metrics: nil, views: viewsDictionary)
view.addConstraints(horizontalConstraints)
view.addConstraints(verticalConstraints)        
println("stageView.frame=\(stageView.frame)")

得到了:

stageView.frame=(0.0,0.0,0.0,0.0)

所以我试过了:

let fittingSize = stageView.systemLayoutSizeFittingSize(UILayoutFittingCompressedSize)
println("fittingSize=\(fittingSize)")

得到了:

fittingSize=(0.0,0.0)

我似乎无法找到一种方法来获得大小.我可以stageView …

这是在超级视图的中心以编程方式在 github set view 中的一个示例。

constraints = NSLayoutConstraint.constraintsWithVisualFormat(
      "H:[superview]-(<=1)-[label]",
      options: NSLayoutFormatOptions.AlignAllCenterY,
      metrics: nil,
      views: ["superview":view, "label":label])

我的问题是，虽然我用“|”替换了“[superview]”，就像苹果文档解释一样，我猜它们是相等的。实际上他们不是，而且它不会工作。

我的代码。

   constraints = NSLayoutConstraint.constraintsWithVisualFormat(
                    "H:|-(<=1)-[imageview]",
                    options: NSLayoutFormatOptions.AlignAllCenterY,
                    metrics: nil,
                    views: ["imageview":imageview])

有什么问题吗，或者 VFL 有错误？苹果文档在这里

请参阅以下代码:

def viewDidLoad
    super
    self.view.translatesAutoresizingMaskIntoConstraints = false
    self.view.backgroundColor = UIColor.whiteColor

    @start = UIButton.buttonWithType(UIButtonTypeRoundedRect).tap do |el|
      el.translatesAutoresizingMaskIntoConstraints = false          
      el.setTitle('Start', forState:UIControlStateNormal)
      el.addTarget(self, action:'toStartController', forControlEvents:UIControlEventTouchUpInside)
      self.view.addSubview(el)
    end

    self.layout_subviews
  end

def layout_subviews
    metrics = { 'space' => 8 }

    views_dict = { 
      'superview' => self.view, 
      'start' => @start
    }

    self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat('H:|-[start(100)]-|', 
                                                                    options: NSLayoutFormatAlignAllCenterX, 
                                                                    metrics: metrics, 
                                                                      views: views_dict))

    self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat('V:[start]-|', 
                                                                    options: NSLayoutFormatAlignAllBottom, 
                                                                    metrics: metrics, 
                                                                      views: views_dict))
  end

我遇到的问题是H:|-[start(100)]-|行不通的.我想要的是一个宽度为100的按钮,以X轴为中心,并以默认边距连接到屏幕底部.一旦我删除(100)这个工作,但按钮伸展到屏幕的宽度减去默认边距.当我指定自定义宽度时,我认为自动布局系统无法确定左边距和右边距应该是什么.我收到一个Unable to simultaneously satisfy constraints.错误.我想这与破折号有关H:|-[start(100)]-|,它需要有一个流体宽度来将start元素附加到superview,而不是默认边距.

有关如何解决这个问题的任何想法？

更新(感谢ghettopia): …

我有一个带有导航栏的视图控制器，我试图在导航栏正下方实现一个菜单栏，我有一个单独的类文件（UIView）。添加菜单栏后，我想在菜单栏视图的垂直中心而不是超级视图的垂直中心添加一个 UIImageView，并且高度与菜单栏视图相同。我正在使用可视化格式语言。我不太确定如何提及视图的名称以及如何约束图像的高度并将其放置在命名视图的中心。有人能帮我吗 ？

下面是代码片段...

//MenuBar.swift

class MenuBar: UIView {


override init(frame: CGRect) {

    super.init(frame: frame)
    print("created") 

    let imageLogo = UIImage(named: "Logo")
    let imageView = UIImageView(image: imageLogo)
    self.addSubview(imageView)
    self.addConstraintWithFormat("H:|[v0]|", views: imageView)
    self.addConstraintWithFormat("V:|[v0(100)]|", views: imageView)
    backgroundColor = UIColor.red
}

required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
}

// func 的 UIView 扩展 addConstraintWithFormat(- format:, views:)

extension UIView{
func addConstraintWithFormat(_ format : String, views : UIView...) {

    var viewsDictionary = [String : UIView]()

    for(index, view) in views.enumerated(){
        let key = …

甚至 Xcode 也提供了非常易于使用的故事板，通过它制作应用程序的 UI 非常容易。

但有时我们会遇到必须使用 CODE 来管理应用程序设计方面的情况。

我通常使用 Anchors 和 Constraints 通过代码来处理这些东西，但也有另一种方法，即“视觉格式语言”。使用任何一种方法之间真的有什么区别，或者它们是相同的，使用一种或另一种方法的优点或缺点是什么。