Question

我需要一个列表框来根据页面方向显示不同的信息，所以开始查找并找到这个answer，按如下方式实现：

在资源部分定义了DataTemplates：

    <DataTemplate x:Key="LandscapeTemplate">
        <StackPanel Orientation="Horizontal">
            <TextBlock Name="txtNombre" Text="{Binding Path=nombre}" TextWrapping="Wrap" Padding="0,10,0,0" FontSize="28" VerticalAlignment="Bottom"></TextBlock>
            <TextBlock Name="txtSep" Text=" - " TextWrapping="Wrap" Padding="0,10,0,0" FontSize="22" VerticalAlignment="Bottom"></TextBlock>
            <TextBlock Name="txtFecha" Text="{Binding Path=fecha_hora}" TextWrapping="Wrap" Padding="0,10,0,0" FontSize="22" VerticalAlignment="Bottom"></TextBlock>
        </StackPanel>
    </DataTemplate>
    <DataTemplate x:Key="PortraitTemplate">
        <StackPanel Orientation="Horizontal">
            <TextBlock Name="txtNombre" Text="{Binding Path=nombre}" TextWrapping="Wrap" Padding="0,10,0,0" FontSize="28" VerticalAlignment="Bottom"></TextBlock>
        </StackPanel>
    </DataTemplate>

然后使用VisualStateManager，如下所示：

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="OrientationStates">
        <VisualState x:Name="Landscape">
            <Storyboard>
                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="lista" 
                                                       Storyboard.TargetProperty="ItemTemplate">
                    <DiscreteObjectKeyFrame KeyTime="0" 
                                            Value="{StaticResource LandscapeTemplate}"/>
                </ObjectAnimationUsingKeyFrames>
            </Storyboard>
        </VisualState>
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

我的应用程序的默认方向是Portrait，所以我最初将PortraitTemplate分配给我的列表框

<ListBox x:Name="lista" 
                 SelectionChanged="ListBox_SelectionChanged" 
                 ItemTemplate="{StaticResource PortraitTemplate}">
        </ListBox>

然后在测试结果时，模板不会改变。我想知道我错过了什么？或者我还需要添加什么来进行模板更改

提前致谢。

添加个人信息：还尝试使用此info

来实现我的目标

Answer 1

最终有效：

在应用程序页面构造函数中（在本例中为MainPage）：

            this.OrientationChanged += new EventHandler<OrientationChangedEventArgs>(MainPage_OrientationChanged);

并添加处理程序方法：

void MainPage_OrientationChanged(object sender, OrientationChangedEventArgs e)
    {
        if ((e.Orientation & PageOrientation.Landscape) > 0)
        {
            VisualStateManager.GoToState(this, "Landscape", true);
            lista.ItemTemplate = LandscapeTemplate();
            lista.ItemsSource = null;
            List<StrTutoria> eventos = generarLista(asistiendo);
            this.lista.ItemsSource = eventos;
        }
        else
        {
            VisualStateManager.GoToState(this, "Portrait", true);
            // Here goes code for portrait state
        }
    }

LandscapeTemplate（）实现：

private DataTemplate LandscapeTemplate()
    {
        string xaml =
            @"<DataTemplate
                    xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation""
                    xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml"">
                    <StackPanel Orientation=""Horizontal"">
                        <TextBlock Name=""txtNombre"" Text=""{Binding Path=nombre}"" TextWrapping=""Wrap"" Padding=""0,10,0,0"" FontSize=""28"" VerticalAlignment=""Bottom""></TextBlock>
                        <TextBlock Name=""txtSep"" Text="" - "" TextWrapping=""Wrap"" Padding=""0,10,0,0"" FontSize=""22"" VerticalAlignment=""Bottom""></TextBlock>
                        <TextBlock Name=""txtFecha"" Text=""{Binding Path=fecha_hora}"" TextWrapping=""Wrap"" Padding=""0,10,0,0"" FontSize=""22"" VerticalAlignment=""Bottom""></TextBlock>
                    </StackPanel>
                </DataTemplate>";
        DataTemplate dt = (DataTemplate)XamlReader.Load(xaml);
        return dt;
    }

解决方案的最后部分可用here

DataTemplate取决于页面方向而不改变WP7

1 个答案: