布局控件之StackLayout
<StackLayout BackgroundColor="#A8A8A8">
<Label Text="布局1"/>
</StackLayout>
//嵌套StackLayout_1
var stackLayout_1 = new StackLayout() { BackgroundColor = Color.FromHex("#A8A8A8") };
stackLayout_1.Children.Add(new Label() { Text = "C#编写布局1" });
stackLayout.Children.Add(stackLayout_1);
Xamarin.Forms 的布局方向
<StackLayout>
<StackLayout Orientation="Horizontal" BackgroundColor="#A8A8A8">
<Label Text="水平"/>
<Label Text="水平"/>
<Label Text="水平"/>
</StackLayout>
<StackLayout Orientation="Vertical" BackgroundColor="#A8A8A8">
<Label Text="垂直"/>
<Label Text="垂直"/>
<Label Text="垂直"/>
</StackLayout>
//设置以水平方式布局
var stackLayout_1 = new StackLayout()
{
Orientation = StackOrientation.Horizontal,
BackgroundColor = Color.FromHex("#A8A8A8")
};
stackLayout_1.Children.Add(new Label() { Text = "水平" });
stackLayout_1.Children.Add(new Label() { Text = "水平" });
stackLayout_1.Children.Add(new Label() { Text = "水平" });
//设置以垂直方式布局
var stackLayout_2 = new StackLayout()
{
Orientation = StackOrientation.Vertical,
BackgroundColor = Color.FromHex("#A8A8A8")
};
stackLayout_2.Children.Add(new Label() { Text = "垂直" });
stackLayout_2.Children.Add(new Label() { Text = "垂直" });
stackLayout_2.Children.Add(new Label() { Text = "垂直" });
布局控件之Grid
Grid.RowDefinitions属性将Grid控件分行,属性值为RowDefinition标签,每一个RowDefinition标签将该Grid对象分为一行;
Grid.ColumnDefinitions属性将Grid控件分列,属性值为ColumnDefinition标签,每一个ColumnDefinition标签将该Grid对象分为一列;
三行三列
<Grid x:Name="LayoutRoot" Background="Blue">
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Button Grid.Column="0" Grid.Row="0" Content=" 0 , 0"></Button>
<Button Grid.Column="1" Grid.Row="1" Content=" 1 , 1"></Button>
<Button Grid.Column="2" Grid.Row="2" Content=" 2 , 2"></Button>
</Grid>
跨行跨列
<StackLayout BackgroundColor="#91e2f4" Grid.Row="0" Grid.Column="1" Grid.ColumnSpan="2">
<Label Text="第0行1列,跨2列"/>
</StackLayout>
<StackLayout BackgroundColor="#91e2f4" Grid.Row="3" Grid.Column="2" Grid.RowSpan="2">
<Label Text="第3行2列,跨2行"/>
</StackLayout>