FluentLayout for Xamarin.iOS

FluentLayout provides a fluent API for defining Auto Layout constraints in Xamarin.iOS. Instead of manually creating NSLayoutConstraint objects, you can use extension methods on views to define relationships like being atop, below, or aligned with other views using margins.

View.AddConstraints(
  fNameLabel.AtTopOf(View, vMargin),
  fNameLabel.AtLeftOf(View, hMargin),
  fNameLabel.ToLeftOf(sNameLabel, hMargin),

  sNameLabel.WithSameTop(fNameLabel),
  sNameLabel.AtRightOf(View, hMargin),
  sNameLabel.WithSameWidth(fNameLabel),

  fNameField.WithSameWidth(fNameLabel),
  fNameField.WithSameLeft(fNameLabel),
  fNameField.Below(fNameLabel, vMargin),

  sNameField.WithSameLeft(sNameLabel),
  sNameField.WithSameWidth(sNameLabel),
  sNameField.WithSameTop(fNameField));

For laying out multiple subviews in a vertical stack, use the VerticalStackPanelConstraints helper. This method takes a Margins object and an array of subviews to arrange them vertically.

When using this helper, constraints are assigned predictable identifiers following the pattern: {containerId}-{viewId}-{constraintDescription}.

• containerId: The container's AccessibilityIdentifier (or VerticalStackPanel if not set).
• viewId: The subview's AccessibilityIdentifier (or the subview's index if not set).
• constraintDescription: A description of the constraint (e.g., Bottom, Top, Width).

View.AddConstraints(
  View.VerticalStackPanelConstraints(
    new Margins(20, 10, 20, 10, 5, 5),                                              
    View.Subviews));