AbsoluteLayout和XAML
如您所见,您可以使用Children集合中可用的Add方法之一或通过静态方法调用设置附加属性,在代码中定位和确定AbsoluteLayout的子项的大小。
但是,你如何在XAML中设置AbsoluteLayout子项的位置和大小?
涉及一种非常特殊的语法。 这个语法由早期Abso?luteDemo程序的XAML版本说明,名为AbsoluteXamlDemo:
-
<ContentPage xmlns=""
-
xmlns:x=""
-
x:Class="AbsoluteXamlDemo.AbsoluteXamlDemoPage">
-
<AbsoluteLayout Padding="50">
-
<BoxView Color="Accent"
-
AbsoluteLayout.LayoutBounds="0, 10, 200, 5" />
-
<BoxView Color="Accent"
-
AbsoluteLayout.LayoutBounds="0, 20, 200, 5" />
-
<BoxView Color="Accent"
-
AbsoluteLayout.LayoutBounds="10, 0, 5, 65" />
-
<BoxView Color="Accent"
-
AbsoluteLayout.LayoutBounds="20, 0, 5, 65" />
-
<Label Text="Stylish Header"
-
FontSize="24"
-
AbsoluteLayout.LayoutBounds="30, 25, AutoSize, AutoSize" />
-
<Label AbsoluteLayout.LayoutBounds="0, 80, AutoSize, AutoSize">
-
<Label.FormattedText>
-
<FormattedString>
-
<Span Text="Although " />
-
<Span Text="AbsoluteLayout"
-
FontAttributes="Italic" />
-
<Span Text=
-
" is usually employed for purposes other
-
than the display of text using " />
-
<Span Text="Label"
-
FontAttributes="Italic" />
-
<Span Text=
-
", obviously it can be used in that way.
-
The text continues to wrap nicely
-
within the bounds of the container
-
and any padding that might be applied." />
-
</FormattedString>
-
</Label.FormattedText>
-
</Label>
-
</AbsoluteLayout>
-
</ContentPage>
代码隐藏文件仅包含InitializeComponent调用。
这是第一个BoxView:
-
<BoxView Color="Accent"
-
AbsoluteLayout.LayoutBounds="0, 10, 200, 5" />
在XAML中,附加的可绑定属性表示为由类名(Ab?soluteLayout)和以句点分隔的属性名(LayoutBounds)组成的属性。 每当您看到这样的属性时,它始终是一个附加的可绑定属性。 这是该属性语法的唯一应用。
总之,类名和属性名的组合仅在三个特定上下文中出现在XAML中:如果它们显示为元素,则它们是属性元素。 如果它们显示为属性,则它们是附加的可绑定属性。 并且类名和属性名的唯一其他上下文是对x:Static标记扩展的定义。
AbsoluteLayout.LayoutBounds属性通常设置为由逗号分隔的四个数字。 您还可以将AbsoluteLayout.LayoutBounds表示为属性元素:
-
<BoxView Color="Accent">
-
<AbsoluteLayout.LayoutBounds>
-
0, 10, 200, 5
-
</AbsoluteLayout.LayoutBounds>
-
</BoxView>
这四个数字由BoundsTypeConverter而不是RectangleTypeConverter解析,因为BoundsTypeConverter允许对宽度和高度部分使用AutoSize。 您可以在AbsoluteXamlDemo XAML文件中看到AutoSize参数:
-
<Label Text="Stylish Header"
-
FontSize="24"
-
AbsoluteLayout.LayoutBounds="30, 25, AutoSize, AutoSize" />
-
Or you can leave them out:
-
<Label Text="Stylish Header"
-
FontSize="24"
-
AbsoluteLayout.LayoutBounds="30, 25" />
您在XAML中指定的附加可绑定属性的奇怪之处在于它们并不存在! AbsoluteLayout中没有名为LayoutBounds的字段,属性或方法。有一个名为LayoutBoundsProperty的BindableProperty类型的公共静态只读字段,并且有名为SetLayoutBounds和GetLayoutBounds的公共静态方法,但没有任何名为LayoutBounds的方法。 XAML解析器将语法识别为引用附加的可绑定属性,然后在AbsoluteLayout类中查找LayoutBoundsProperty。从那里,它可以使用该BindableProperty对象和BoundsTypeConverter中的值在目标视图上调用SetValue。
Chessboard系列程序似乎不太可能在XAML中复制,因为该文件需要32个BoxView实例而没有循环的好处。但是,ChessboardXaml程序显示了如何以隐式样式指定BoxView的两个属性,包括AbsoluteLayout.LayoutFlags附加的可绑定属性:
-
<ContentPage xmlns=""
-
xmlns:x=""
-
x:Class="ChessboardXaml.ChessboardXamlPage">
-
<ContentPage.Padding>
-
<OnPlatform x:TypeArguments="Thickness"
-
iOS="5, 25, 5, 5"
-
Android="5"
-
WinPhone="5" />
-
</ContentPage.Padding>
-
<ContentPage.Resources>
-
<ResourceDictionary>
-
<Style TargetType="BoxView">
-
<Setter Property="Color" Value="#004000" />
-
<Setter Property="AbsoluteLayout.LayoutFlags" Value="All" />
-
</Style>
-
</ResourceDictionary>
-
</ContentPage.Resources>
-
<ContentView SizeChanged="OnContentViewSizeChanged">
-
<AbsoluteLayout x:Name="absoluteLayout"
-
BackgroundColor="#F0DC82"
-
VerticalOptions="Center"
-
HorizontalOptions="Center">
-
<BoxView AbsoluteLayout.LayoutBounds="0.00, 0.00, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.29, 0.00, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.57, 0.00, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.86, 0.00, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.14, 0.14, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.43, 0.14, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.71, 0.14, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="1.00, 0.14, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.00, 0.29, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.29, 0.29, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.57, 0.29, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.86, 0.29, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.14, 0.43, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.43, 0.43, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.71, 0.43, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="1.00, 0.43, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.00, 0.57, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.29, 0.57, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.57, 0.57, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.86, 0.57, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.14, 0.71, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.43, 0.71, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.71, 0.71, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="1.00, 0.71, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.00, 0.86, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.29, 0.86, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.57, 0.86, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.86, 0.86, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.14, 1.00, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.43, 1.00, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="0.71, 1.00, 0.125, 0.125" />
-
<BoxView AbsoluteLayout.LayoutBounds="1.00, 1.00, 0.125, 0.125" />
-
</AbsoluteLayout>
-
</ContentView>
-
</ContentPage>
是的,它是很多单独的BoxView元素,但你不能争论文件的清洁度。 代码隐藏文件只是调整宽高比:
-
public partial class ChessboardXamlPage : ContentPage
-
{
-
public ChessboardXamlPage()
-
{
-
InitializeComponent();
-
}
-
void OnContentViewSizeChanged(object sender, EventArgs args)
-
{
-
ContentView contentView = (ContentView)sender;
-
double boardSize = Math.Min(contentView.Width, contentView.Height);
-
absoluteLayout.WidthRequest = boardSize;
-
absoluteLayout.HeightRequest = boardSize;
-
}
-
}
阅读(3650) | 评论(0) | 转发(0) |