UWP中DataTemplateSelector崩溃及屏幕旋转时ListView标签位置调整求助

我来帮你排查这个屏幕旋转时DataTemplateSelector崩溃的问题，结合UWP的最佳实践，给你几个可行的解决方案：

先分析可能的崩溃原因 #

你当前的写法存在几个风险点：

• 每次旋转都先把ItemTemplate设为null再重新实例化Selector，容易触发ListView的重复渲染，导致绑定上下文混乱或内存异常
• 新实例化的Selector可能没有正确加载模板资源（比如landscapeTemplate/PortraitTemplate未从XAML资源中正确获取）
• 可能遗漏了调用基类的OrientationChanged方法，导致系统方向处理逻辑异常

方案一：优化Selector的绑定方式（推荐） #

不要在代码里频繁实例化Selector，而是提前在XAML中声明并通过ViewModel属性自动切换模板：

1. 在XAML资源中声明Selector

<Page.Resources>
    <!-- 先定义你的横竖屏模板 -->
    <DataTemplate x:Key="landscapeTemplate">
        <!-- 横屏布局的Label结构 -->
    </DataTemplate>
    <DataTemplate x:Key="portraitTemplate">
        <!-- 竖屏布局的Label结构 -->
    </DataTemplate>

    <!-- 声明Selector并绑定ViewModel的IsLandscape属性 -->
    <local:OrientationDataTemplateSelector x:Key="OrientationSelector"
                                           LandscapeTemplate="{StaticResource landscapeTemplate}"
                                           PortraitTemplate="{StaticResource portraitTemplate}"
                                           IsLandscape="{Binding IsLandscape, Mode=OneWay}"/>
</Page.Resources>

2. ListView直接绑定这个Selector

<ListView x:Name="RdMyListView" ItemTemplate="{StaticResource OrientationSelector}"/>

3. 简化OrientationChanged逻辑
   只需要更新ViewModel的属性，不需要修改ItemTemplate：

protected override void OnOrientationChanged(OrientationChangedEventArgs e)
{
    base.OnOrientationChanged(e); // 必须调用基类方法
    viewModel.IsLandscape = e.NewOrientation == DisplayOrientations.Landscape;
}

4. 确保Selector正确实现逻辑
   你的OrientationDataTemplateSelector需要继承DataTemplateSelector并重写核心方法：

public class OrientationDataTemplateSelector : DataTemplateSelector
{
    public DataTemplate LandscapeTemplate { get; set; }
    public DataTemplate PortraitTemplate { get; set; }
    public bool IsLandscape { get; set; }

    protected override DataTemplate SelectTemplateCore(object item, DependencyObject container)
    {
        // 避免空引用，先判断模板是否存在
        if (IsLandscape && LandscapeTemplate != null)
            return LandscapeTemplate;
        else if (!IsLandscape && PortraitTemplate != null)
            return PortraitTemplate;
        
        return base.SelectTemplateCore(item, container);
    }
}

方案二：安全的代码切换模板方式 #

如果一定要在代码中实例化Selector，避免先设为null，并确保模板资源正确加载：

protected override void OnOrientationChanged(OrientationChangedEventArgs e)
{
    base.OnOrientationChanged(e);
    var isLandscape = e.NewOrientation == DisplayOrientations.Landscape;
    viewModel.IsLandscape = isLandscape;

    // 从资源中安全获取模板，避免空引用
    var landscapeTemplate = Resources["landscapeTemplate"] as DataTemplate;
    var portraitTemplate = Resources["portraitTemplate"] as DataTemplate;

    if (landscapeTemplate == null || portraitTemplate == null)
    {
        Debug.WriteLine("模板加载失败，请检查XAML资源定义");
        return;
    }

    // 直接赋值Selector，不要先设ItemTemplate为null
    RdMyListView.ItemTemplate = new OrientationDataTemplateSelector
    {
        LandscapeTemplate = landscapeTemplate,
        PortraitTemplate = portraitTemplate,
        IsLandscape = isLandscape
    };
}

方案三：用VisualStateManager处理布局（UWP官方推荐） #

其实UWP处理屏幕旋转的布局变化，更推荐用VisualStateManager，不需要切换DataTemplate，直接在同一个模板里调整控件位置：

1. 在ItemTemplate中定义VisualState

<DataTemplate x:Key="ItemTemplate">
    <Grid>
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="OrientationStates">
                <VisualState x:Name="Portrait">
                    <VisualState.Setters>
                        <Setter Target="Label1.(Grid.Row)" Value="0"/>
                        <Setter Target="Label1.(Grid.Column)" Value="0"/>
                        <Setter Target="Label2.(Grid.Row)" Value="1"/>
                        <Setter Target="Label2.(Grid.Column)" Value="0"/>
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="Landscape">
                    <VisualState.Setters>
                        <Setter Target="Label1.(Grid.Row)" Value="0"/>
                        <Setter Target="Label1.(Grid.Column)" Value="0"/>
                        <Setter Target="Label2.(Grid.Row)" Value="0"/>
                        <Setter Target="Label2.(Grid.Column)" Value="1"/>
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>

        <Label x:Name="Label1" Content="{Binding Text1}"/>
        <Label x:Name="Label2" Content="{Binding Text2}"/>
    </Grid>
</DataTemplate>

2. 在OrientationChanged中切换状态

protected override void OnOrientationChanged(OrientationChangedEventArgs e)
{
    base.OnOrientationChanged(e);
    var targetState = e.NewOrientation == DisplayOrientations.Landscape ? "Landscape" : "Portrait";

    // 遍历所有Item容器切换VisualState
    foreach (var item in RdMyListView.Items)
    {
        var container = RdMyListView.ContainerFromItem(item) as ListViewItem;
        if (container != null)
        {
            VisualStateManager.GoToState(container, targetState, true);
        }
    }
}

额外排查点 #

• 确保你的ViewModel的IsLandscape属性实现了INotifyPropertyChanged，否则绑定不会生效
• 检查SelectTemplateCore方法中是否有潜在的空引用（比如模板未赋值就返回）
• 避免在旋转时做过多的UI操作，尽量让布局变化由XAML自动处理

内容的提问来源于stack exchange，提问作者swift droid