第四章:滚动堆栈(4)

2350阅读 0评论2018-03-19 renxiao2003
分类:Android平台

展开选项
您可能注意到,HorizontalOptions和VerticalOptions属性是复数形式,就好像有多个选项一样。 这些属性通常设置为LayoutOptions结构的静态字段 - 另一个复数。
迄今为止的讨论集中在以下静态只读LayoutOptions字段,它们返回预定义的LayoutOptions值:
由View类默认建立的是LayoutOptions.Fill,这意味着视图会填充它的容器。
正如你所看到的,当Labelis是一个垂直StackLayout的子元素时,Label上的VerticalOptions设置并没有什么不同。 StackLayout本身将孩子的身高限制在他们需要的高度,所以孩子没有自由在该插槽内垂直移动。
准备好这个规则稍作修改!
LayoutOptions结构有四个尚未讨论的额外静态只读字段:

LayoutOptions还定义了两个名为Alignment和Expands的实例属性。 由以AndExpand结尾的静态字段返回的LayoutOptions的四个实例都将Expands属性设置为true。
此扩展属性仅由StackLayout识别。 这对于管理页面布局可能非常有用,但在第一次遇到时可能会造成混淆。 以下是Expandsto在垂直StackLayout中扮演角色的要求:
如果满足这些条件,则StackLayout将在VerticalOptions设置为Expands等于true的所有子项之间平均分配额外的垂直空间。 这些孩子中的每一个在StackLayout中的插槽都比正常的要大。 小孩如何占用该插槽取决于LayoutOptions值的对齐设置:开始,中央,结束或填充。
这里有一个名为VerticalOptionsDemo的程序,该程序使用反射来创建具有垂直StackLayout中所有可能的VerticalOptions设置的Label对象。 背景颜色和前景颜色交替出现,以便您可以看到每个标签占据多少空间。 该程序使用语言集成查询(LINQ)以更具视觉效果的方式对LayoutOptions结构的字段进行排序:

点击(此处)折叠或打开

  1. public class VerticalOptionsDemoPage : ContentPage
  2. {
  3.     public VerticalOptionsDemoPage()
  4.     {
  5.         Color[] colors = { Color.Yellow, Color.Blue };
  6.         int flipFlopper = 0;
  7.         // Create Labels sorted by LayoutAlignment property.
  8.         IEnumerable<Label> labels =
  9.             from field in typeof(LayoutOptions).GetRuntimeFields()
  10.             where field.IsPublic && field.IsStatic
  11.             orderby ((LayoutOptions)field.GetValue(null)).Alignment
  12.             select new Label
  13.             {
  14.                 Text = "VerticalOptions = " + field.Name,
  15.                 VerticalOptions = (LayoutOptions)field.GetValue(null),
  16.                 HorizontalTextAlignment = TextAlignment.Center,
  17.                 FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)),
  18.                 TextColor = colors[flipFlopper],
  19.                 BackgroundColor = colors[flipFlopper = 1 - flipFlopper]
  20.             };
  21.         // Transfer to StackLayout.
  22.         StackLayout stackLayout = new StackLayout();
  23.         foreach (Label label in labels)
  24.         {
  25.             stackLayout.Children.Add(label);
  26.         }
  27.         Padding = new Thickness(0, Device.OnPlatform(20, 0, 0), 0, 0);
  28.         Content = stackLayout;
  29.     }
  30. }
你可能想稍微研究一下结果:

在蓝色背景上带有黄色文本的标签视图是那些将VerticalOptions属性设置为LayoutOptions值而没有设置展开标志的视图。如果展开标志未在垂直StackLayout中的项目的LayoutOptions值上设置,则VerticalOptions设置将被忽略。正如你所看到的,标签只占用纵向StackLayout所需的垂直空间。
此StackLayout中的子级的总高度小于StackLayout的高度,因此StackLayout具有额外的空间。它包含四个将VerticalOptions属性设置为LayoutOptions值并使用扩展标志设置的四个子项,因此这四个子项中的这些额外空间是平均分配的。
在这四种情况下 - 在黄色背景上带有蓝色文本的标签视图 - LayoutOptions值的对齐属性指示子对象在包含额外空间的区域内的对齐方式。第一个 - VerticalOptions属性设置为LayoutOptions.StartAndExpand - 高于此额外空间。第二个(CenterAndExpand)位于额外空间的中间。第三个(EndAndExpand)低于额外空间。然而,在所有这三种情况下,标签只获得尽可能多的垂直空间,如背景颜色所示。剩下的空间属于StackLayout,它显示页面的背景颜色。
最后一个Label将其VerticalOptions属性设置为LayoutOptions.FillAndExpand。在这种情况下,标签会占用包含额外空间的整个插槽,如黄色背景的大面积所示。文本在这个领域的顶部;这是因为VerticalTextAlignment的默认设置是TextAlignment.Start。将其设置为其他内容以便在该区域内垂直放置文本。

LayoutOptions的Expands属性仅在视图是StackLayout的子项时才起作用。 在其他情况下,它被忽略。
上一篇:最近有其它事没更新博客,后续继续更新
下一篇:第四章:滚动堆栈(5)