Question

你好开发人员！我正在开发一个Windows Phone 7应用程序，我无法弄清楚我认为对于经验丰富的人来说这是一个简单的问题。假设我有一个由两个元素组成的布局：一个ListBox（填充了大量项目）和一个TextBlock（向用户提供一些基本指令）。

当设备处于纵向方向时，我希望这些是一个在另一个之上，当设备方向更改为横向时，我希望它们彼此相邻。

对于纵向方向，我使用的是网格布局管理器，因为它可以让我像这样定义行的高度...第0行Height="2*"，第1行Height="*"

Listbox位于第0行，TextBlock位于第1行。现在，真正简洁的是将RowDefinition简单地更改为ColumnDefinition并将列表框/文本块重新分配给网格的列设备切换到横向时的行数。

但这只是我的想法。我不知道如何优雅地完成这项工作。也许有更好的方法吗？或者这可能是正确的方法，并且有一些方法可以用于此目的吗？

感谢您的建议！

Answer 1

默认纵向配置如何： -

<Grid>
   <Grid.RowDefinitions>
       <RowDefinition Height="2*" />
       <RowDefinition Height="*" />
   </Grid.RowDefintions>
   <Grid.ColumnDefinitions>
       <ColumnDefinition Width="2*" />
       <ColumnDefinition Width="*" />
   </Grid.ColumnDefinitions>

   <ListBox x:Name="ItemList" Grid.ColumnSpan="2" />
   <TextBlock x:Name="Instructions" Grid.Row="1" Grid.ColumnSpan="2">
      Content
   </TextBlock>

然后在OrientationChanged事件中使用： -

if ((e.Orientation & PageOrientation.Portrait) == PageOrientation.Portrait)
{
     Grid.SetRow(ItemList, 0);
     Grid.SetRowSpan(ItemList, 1);
     Grid.SetColumn(ItemList, 0);
     Grid.SetColumnSpan(ItemList, 2);

     Grid.SetRow(Instructions, 1);
     Grid.SetRowSpan(Instructions, 1);
     Grid.SetColumn(Instructions, 0);
     Grid.SetColumnSpan(Instructions, 2);
}
else
{
     Grid.SetRow(ItemList, 0);
     Grid.SetRowSpan(ItemList, 2);
     Grid.SetColumn(ItemList, 0);
     Grid.SetColumnSpan(ItemList, 1);

     Grid.SetRow(Instructions, 0);
     Grid.SetRowSpan(Instructions, 2);
     Grid.SetColumn(Instructions, 1);
     Grid.SetColumnSpan(Instructions, 1);
}

Answer 2

对于方向，Visual State Manager工作得最好。

在Blend中，定义两个状态，将它们命名为“port”和“land”。
将“设备”控制面板放在“混合”工作区上。
通过切换方向并相应地设计每个布局来记录布局。
在方向更改事件中，请使用以下代码：

代码：

private void PhoneApplicationPage_OrientationChanged
(object sender, OrientationChangedEventArgs e)
{
   VisualStateManager
    .GoToState(this, e.Orientation.ToString().Substring(0, 4), true);
}

Answer 3

我在msdn博客中发现了一篇很好的文章，它以一种相当简单的方式处理这种布局转换，并解释了其他方法：

http://blogs.msdn.com/b/ptorr/archive/2010/03/27/strategies-for-dealing-with-orientation-changes.aspx

为什么我之前没遇到过这个？ :-)快乐的编码！

Windows Phone 7应用程序 - 方向更改

3 个答案: