如何在xamarin中创建这样的布局？

Question

我是Xamarin和iOS开发的新手.我有创建布局的问题,如下图所示.

http://cdn.vanillaforums.com/xamarin.vanillaforums.com/FileUpload/6f/7eb37b9abb0d8cdcef8d238d1a4b2f.png

我希望在顶部和底部有两个固定大小的视图,在中间有一个灵活的视图.我希望中间视图具有灵活性,因为我希望在3,5和4英寸屏幕上具有相同的布局.

你能告诉我一些如何实现这一目标的线索吗？

Answer 1

如果您不想支持旋转，您可以创建固定布局，因为屏幕尺寸在运行时不会改变。在这种情况下，只需将顶视图放置在顶部，将底视图放置在 View.Bounds.Height - requiredBottomViewHeight 处，中间视图的高度等于父视图减去底部和顶部高度之和。

如果您需要轮换，请使用：

• 自动调整大小蒙版
• 重写 LayoutSubviews()
• 或者自动布局。为了简化自动布局，Frank Krueger 制作了一个很棒的帮助器类，名为 EasyLayout。您可以在此处找到示例。

目前推荐的方法是使用自动布局和约束。然而，在这种简单的情况下，您可以安全地使用自动调整大小蒙版。下面的代码将生成您想要的布局，并且还支持旋转。您可以通过设置自动调整大小蒙版在 Storyboard Designer 或 Interface Builder 中生成相同的效果，如下所示。

public override void ViewDidLoad ()
        {
            var topView = new UIView {
                BackgroundColor = UIColor.Red,
                Frame = new RectangleF(0, 0, this.View.Bounds.Width, 50),
                AutoresizingMask = UIViewAutoresizing.FlexibleWidth
            };
            var bottomView = new UIView {
                BackgroundColor = UIColor.Blue,
                Frame = new RectangleF(0, this.View.Bounds.Height - 50, 320, 50),
                AutoresizingMask = UIViewAutoresizing.FlexibleTopMargin | UIViewAutoresizing.FlexibleWidth
            };
            var middleView = new UIView {
                Frame = new RectangleF(0, topView.Frame.Bottom, this.View.Bounds.Width, this.View.Bounds.Height - topView.Bounds.Height - bottomView.Bounds.Height),
                BackgroundColor = UIColor.Green,
                AutoresizingMask = UIViewAutoresizing.FlexibleHeight | UIViewAutoresizing.FlexibleWidth
            };
            this.View.AddSubviews (topView, middleView, bottomView);

}