Xamarin ContentPage 和/或 XAML 页面的初学者帮助答案

【问题标题】：Beginner help for Xamarin ContentPage and or XAML PageXamarin ContentPage 和/或 XAML 页面的初学者帮助
【发布时间】：2015-03-18 13:53:02
【问题描述】：

我刚刚开始试用 Xamarin，我正在尝试调查它是如何工作的。

我想创建一个具有以下要求的三行简单页面：

第一行应固定在顶部，并且将包含具有固定宽度和高度的图像（例如 264x70）
第二行应该包含简单的文本。此行应垂直扩展以占用所有可用空间
第三行应锚定底部并包含两个垂直堆叠并水平居中的按钮。

我曾尝试使用执行以下代码的代码直接创建此页面：

public SamplePage() {
    this.Padding = new Thickness( 10, Device.OnPlatform( 20, 0, 0 ), 10, 0 );
    var homeLogo = new Image() { 
        Aspect = Aspect.AspectFit
    };
    homeLogo.Source = ImageSource.FromFile( "HomeLogo.png" );
    var btn1 = new Button() {
        Text = "first button"
    };
    var btn2 = new Button() {
        Text = "second button"
    };
    this.Content = new StackLayout {
        VerticalOptions = LayoutOptions.Center,
        HorizontalOptions = LayoutOptions.Center,
        Orientation = StackOrientation.Vertical,
        Children = {
            homeLogo,
            new Label { 
                VerticalOptions = LayoutOptions.FillAndExpand,
                Text = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas in dolor maximus, molestie elit quis, condimentum ipsum." 
            },
            btn1,
            btn2
        }
    };
}

我在 Visual Studio 中使用 Xamarin，并使用 Portabe 类库创建了一个 Xamarin Forms 项目。有没有可以让我开始学习如何创建 UI 的设计师？

【问题讨论】：

没有可视化设计器，但您可以使用 XAML 来创建您的页面。在这里查看：developer.xamarin.com/guides/cross-platform/xamarin-forms/…
您遇到的实际问题是什么？您已经告诉我们您想要什么，并展示了您正在做什么，但没有描述实际问题，或者展示了不正确的结果。
我认为你最好使用网格视图或表格视图，因为你有精确的水平和垂直位置来放置控件

标签： c# xamarin xamarin.forms

【解决方案1】：

试试下面这个。我认为您错过了这样一个事实，即内部容器能够扩展父容器也应该具有相同的属性集来扩展。

this.Content = new StackLayout {
        VerticalOptions = LayoutOptions.CenterAndExpand,
        HorizontalOptions = LayoutOptions.Center,
        Orientation = StackOrientation.Vertical,
        Children = {
            homeLogo,
            new Label { 
                VerticalOptions = LayoutOptions.CenterAndExpand,
                Text = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas in dolor maximus, molestie elit quis, condimentum ipsum." 
            },
            btn1,
            btn2
        }
    };

【讨论】：