StackLayout レイアウト Children複数設定についてメモしておきます。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
namespace StackLayout04
{
public partial class HomePage : ContentPage
{
public HomePage()
{
//iPhoneにおいて、ステータスバーとの重なりを防ぐためパディングを調整する
Padding = new Thickness(0, Device.OnPlatform(20, 0,
0), 0, 0);
// 縦並べ
StackLayout stackLayout = new
StackLayout
{
Spacing = 0,
// 縦並べ
VerticalOptions =
LayoutOptions.FillAndExpand,
Children = {
new Label
{
Text =
"Start 左",
FontSize =
32,
BackgroundColor = Color.Red,
HorizontalOptions = LayoutOptions.Start,
},
new Label
{
Text =
"中央",
FontSize =
32,
BackgroundColor = Color.Red,
HorizontalOptions = LayoutOptions.Center
},
new Label
{
Text =
"End 右",
FontSize =
32,
BackgroundColor = Color.Red,
HorizontalOptions = LayoutOptions.End
},
}
};
// 中心並べ
StackLayout stackLayoutCenter = new
StackLayout
{
Spacing = 0,
// 縦並び均等中央
VerticalOptions =
LayoutOptions.FillAndExpand,
Children = {
new Label
{
Text =
"↑↓縦並び均等中央",
FontSize =
32,
XAlign =
TextAlignment.Center,
BackgroundColor = Color.Red,
//
横並び中央
//HorizontalOptions = LayoutOptions.Center
},
}
};
// 横一列並べ
StackLayout stackLayoutHorizontal = new
StackLayout
{
Spacing = 0,
// 横一列並べ
Orientation =
StackOrientation.Horizontal,
Children = {
new Label
{
Text =
"Start 左",
FontSize =
32,
BackgroundColor = Color.Blue
},
new Label
{
Text =
"Center",
FontSize =
32,
BackgroundColor = Color.Blue,
HorizontalOptions = LayoutOptions.CenterAndExpand
},
new Label
{
Text =
"End 右",
FontSize =
32,
BackgroundColor = Color.Blue
},
}
};
// 横一列並べ
StackLayout stackLayoutHorizontal01 = new
StackLayout
{
Spacing = 15,
// 横一列並べ
Orientation =
StackOrientation.Horizontal,
Children = {
new Label
{
Text =
"Start 左",
FontSize =
22,
WidthRequest = 90,
XAlign =
TextAlignment.Center,
BackgroundColor = Color.Blue
},
new Label
{
Text =
"中央1",
FontSize =
22,
WidthRequest = 90,
XAlign =
TextAlignment.Center,
BackgroundColor = Color.Blue,
//HorizontalOptions = LayoutOptions.CenterAndExpand
},
new Label
{
Text =
"中央2",
FontSize =
22,
WidthRequest = 90,
XAlign =
TextAlignment.Center,
BackgroundColor = Color.Blue,
//HorizontalOptions = LayoutOptions.CenterAndExpand
},
new Label
{
Text =
"End 右",
FontSize =
22,
WidthRequest = 90,
XAlign =
TextAlignment.Center,
BackgroundColor = Color.Blue
},
}
};
this.Content = new StackLayout
{
Children =
{
// 上
縦並べ
stackLayout,
// 中心並べ
stackLayoutCenter,
// 下
横一列並べ
stackLayoutHorizontal,
// 下
横一列並べ
stackLayoutHorizontal01
}
};
}
}
}
コメントをお書きください