以编程方式使用 AutoLayout 和 UIScrollView答案

【问题标题】：Using AutoLayout and UIScrollView programmatically以编程方式使用 AutoLayout 和 UIScrollView
【发布时间】：2019-11-14 14:21:21
【问题描述】：

我正在尝试在此处复制此问题的答案：Xamarin iOS: Auto Layout within scroll view?，但不使用界面生成器。代码很简单，我有_scrollView，它的背景颜色为绿色。然后我有_contentView，它的背景颜色为红色。我将_contentView 添加到_scrollView，并将_scrollView 添加到ViewController 中的查看。当我运行它时，我得到的只是绿色控制器，红色的控制器永远不会出现在其中。

public async override void ViewDidLoad()
{
    base.ViewDidLoad();

    //ui
    View.BackgroundColor = UIColor.White;

    //views
    _scrollView = new UIScrollView();
    _scrollView.BackgroundColor = UIColor.Green;
    _scrollView.TranslatesAutoresizingMaskIntoConstraints = false;

    _contentView = new UIView();
    _contentView.TranslatesAutoresizingMaskIntoConstraints = false;
    _contentView.BackgroundColor = UIColor.Red;

    var label = new UILabel();
    label.TranslatesAutoresizingMaskIntoConstraints = false;
    label.Text = "Text";

    _contentView.AddSubview(label);

    _scrollView.AddSubview(_contentView);

    View.AddSubviews(new UIView[] { _scrollView });

    _scrollView.TopAnchor.ConstraintEqualTo(View.TopAnchor, 100).Active = true;
    _scrollView.LeftAnchor.ConstraintEqualTo(View.LeftAnchor, 20).Active = true;
    _scrollView.RightAnchor.ConstraintEqualTo(View.RightAnchor, -20).Active = true;
    _scrollView.BottomAnchor.ConstraintEqualTo(View.BottomAnchor, -100).Active = true;

    _contentView.TopAnchor.ConstraintEqualTo(_contentView.Superview.TopAnchor).Active = true;
    _contentView.RightAnchor.ConstraintEqualTo(_contentView.Superview.RightAnchor).Active = true;
    _contentView.LeftAnchor.ConstraintEqualTo(_contentView.Superview.LeftAnchor).Active = true;
    _contentView.BottomAnchor.ConstraintEqualTo(_contentView.Superview.BottomAnchor).Active = true;
    _contentView.WidthAnchor.ConstraintEqualTo(_contentView.Superview.WidthAnchor).Active = true;

    label.TopAnchor.ConstraintEqualTo(label.Superview.TopAnchor, 100).Active = true;
    label.BottomAnchor.ConstraintEqualTo(label.Superview.BottomAnchor, 100).Active = true;
    label.LeftAnchor.ConstraintEqualTo(label.Superview.LeftAnchor, 100).Active = true;
    label.RightAnchor.ConstraintEqualTo(label.Superview.RightAnchor, 100).Active = true;
}

【问题讨论】：

标签： c# xamarin xamarin.ios

【解决方案1】：

您需要将_contentView 的宽度限制为View 而不是_scrollView。更改此约束：

_contentView.WidthAnchor.ConstraintEqualTo(_contentView.Superview.WidthAnchor).Active = true;

对于这个：

_contentView.WidthAnchor.ConstraintEqualTo(View.WidthAnchor).Active = true;

除此之外，我强烈建议您使用帮助程序库以编程方式使用 AutoLayout。查看FluentLayout

【讨论】：

我做了一个快速测试，但没有成功。但我想出了别的办法。当您指定 _contentView 内任何视图的高度，并指定 _contentView 内最后一个视图的 BottomAnchor 时，它会神奇地起作用。看起来它需要最后一个子视图，并从 BottomAnchor 计算 _contentView 的高度。我将用它创建一个示例游戏，看看我是否可以让你的建议发挥作用，并可能把它放在 GitHub 上，因为它很痛苦几个小时，它可能会在未来帮助某人。
是的，确实如此。您的 _contentView 没有任何内在高度，您必须通过对其子项指定约束来让它知道。设置 _contentView 宽度等于视图宽度的技巧是让滚动视图仅垂直滚动。如果您需要滚动视图来水平滚动，那么您可以绑定 _contentView.Height 而不是 _contentView.Width
这个示例应用程序应该可以帮助您构建约束。它使用 FluentLayout 但很容易翻译 github.com/MvvmCross/MvvmCross-Samples/blob/master/…

【解决方案2】：

我能够使其工作的唯一方法是将 BottomAnchor 添加到 ContentView 中的最后一个 UIView。我创建了一个带有演示代码here

的 GitHub 存储库

【讨论】：