如何使用Xamarin iOS Fluent Layout在中心对齐子视图？

Question

我的代码是这样的：

var nameTextField = new UITextField(); 
var passwordTextField = new UITextField(); 
var loginButton = new UIButton(); 

//Bindings with MvvmCross... 

Add(nameTextField); 
Add(passwordTextField); 
Add(loginButton); 

View.SubviewsDoNotTranslateAutoresizingMaskIntoConstraints(); 

View.AddConstraints(
    nameTextField.AtTopOf(View, 10), 
    nameTextField.AtLeftOf(View, 10), 
    nameTextField.AtRightOf(View, 10), 
    passwordTextField.Below(nameTextField, 10), 
    passwordTextField.WithSameLeft(nameTextField), 
    passwordTextField.WithSameRight(nameTextField), 
    loginButton.Below(passwordTextField, 30), 
    loginButton.WithSameLeft(passwordTextField), 
    loginButton.WithSameRight(passwordTextField) 
); 

随着“nameTextField.AtTopOf（图10），显示上方屏幕上的形式但现在，我需要垂直对齐的所有控件（姓名，密码和按钮）在视图中。

我怎样才能做到这一点？

我已经尝试了所有控件的页边距来概括的高度，并使用.WithCenterY（查看）.Minus（值），但我认为这不是最好的方法，特别是当我有很多控件时。

谢谢。

Answer 1

首先，创建一个子视图添加所有表单控件：

var formView = new UIView(); 
formView.AddSubviews(nameTextField, passwordTextField, loginButton); 

为formView视图内的那些元素创建约束：

formView.SubviewsDoNotTranslateAutoresizingMaskIntoConstraints(); 

formView.AddConstraints(
    nameTextField.AtTopOf(formView, 10), 
    nameTextField.AtLeftOf(formView, 10), 
    nameTextField.AtRightOf(formView, 10), 
    passwordTextField.Below(nameTextField, 10), 
    passwordTextField.WithSameLeft(nameTextField), 
    passwordTextField.WithSameRight(nameTextField), 
    loginButton.Below(passwordTextField, 30), 
    loginButton.WithSameLeft(passwordTextField), 
    loginButton.WithSameRight(passwordTextField) 
); 

创建约束来在屏幕中心formView：

View.SubviewsDoNotTranslateAutoresizingMaskIntoConstraints(); 

View.AddConstraints(
    formView.WidthOf(View), 
    formView.WithSameCenterY(View); 
    ... 
); 

我没有测试任何此代码，所以它可能在某些时候是错误的，但你的想法......