You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多
文档控制台
免费开始使用

使用NavigationView/SplitView时,能否开发适配不同Windows 10版本的UWP应用?

如何开发适配不同Windows 10版本的UWP应用(NavigationView vs SplitView)

当然可以!UWP天生就支持跨版本适配,你完全可以让应用在Windows 10 Build 16299及以上版本用NavigationView,在更低版本上自动 fallback 到SplitView,同时保证用户体验的一致性。下面是具体的实现方案:


1. 用XAML的版本自适应布局

你可以通过ApiInformationTrigger结合VisualStateManager,让XAML自动根据系统版本切换显示的控件:

<Grid>
    <!-- 低版本默认显示SplitView -->
    <SplitView x:Name="MainSplitView" 
               IsPaneOpen="True" 
               DisplayMode="CompactInline"
               PaneBackground="{ThemeResource SystemControlBackgroundChromeMediumLowBrush}">
        <SplitView.Pane>
            <StackPanel Margin="10">
                <Button Content="首页" Style="{StaticResource NavigationViewItemButtonStyle}" Click="HomeButton_Click"/>
                <Button Content="我的收藏" Style="{StaticResource NavigationViewItemButtonStyle}" Click="FavoritesButton_Click"/>
                <Button Content="设置" Style="{StaticResource NavigationViewItemButtonStyle}" Click="SettingsButton_Click"/>
            </StackPanel>
        </SplitView.Pane>
        <Frame x:Name="ContentFrame"/>
    </SplitView>

    <!-- 高版本显示NavigationView -->
    <NavigationView x:Name="MainNavView" 
                    Visibility="Collapsed"
                    MenuItemsSource="{x:Bind NavMenuItems}"
                    PaneDisplayMode="Left">
        <Frame x:Name="NavContentFrame"/>
    </NavigationView>

    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup>
            <VisualState x:Name="SupportsNavigationView">
                <VisualState.StateTriggers>
                    <!-- 检测NavigationView控件是否存在(对应Build 16299+) -->
                    <ApiInformationTrigger Name="Windows.UI.Xaml.Controls.NavigationView" Version="1.0"/>
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Target="MainSplitView.Visibility" Value="Collapsed"/>
                    <Setter Target="MainNavView.Visibility" Value="Visible"/>
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
</Grid>

2. 后台代码的版本兼容处理

在C#代码里,你需要用ApiInformation类判断当前系统是否支持NavigationView,然后分别初始化控件的逻辑,避免在低版本上调用不存在的API:

private ObservableCollection<NavigationViewItem> NavMenuItems { get; set; }

protected override void OnNavigatedTo(NavigationEventArgs e)
{
    base.OnNavigatedTo(e);

    if (ApiInformation.IsTypePresent("Windows.UI.Xaml.Controls.NavigationView"))
    {
        // 初始化NavigationView的菜单和事件
        NavMenuItems = new ObservableCollection<NavigationViewItem>
        {
            new NavigationViewItem { Content = "首页", Icon = new SymbolIcon(Symbol.Home) },
            new NavigationViewItem { Content = "我的收藏", Icon = new SymbolIcon(Symbol.Favorite) },
            new NavigationViewItem { Content = "设置", Icon = new SymbolIcon(Symbol.Settings) }
        };
        MainNavView.ItemInvoked += MainNavView_ItemInvoked;
    }
    else
    {
        // 处理SplitView的逻辑
        MainSplitView.PaneClosed += MainSplitView_PaneClosed;
    }
}

// NavigationView的导航逻辑
private void MainNavView_ItemInvoked(NavigationView sender, NavigationViewItemInvokedEventArgs args)
{
    var selectedItem = args.InvokedItem.ToString();
    NavContentFrame.Navigate(GetPageType(selectedItem));
}

// SplitView的导航逻辑
private void HomeButton_Click(object sender, RoutedEventArgs e)
{
    ContentFrame.Navigate(typeof(HomePage));
    MainSplitView.IsPaneOpen = false;
}

// 辅助方法:根据菜单项获取对应的页面类型
private Type GetPageType(string itemName)
{
    return itemName switch
    {
        "首页" => typeof(HomePage),
        "我的收藏" => typeof(FavoritesPage),
        "设置" => typeof(SettingsPage),
        _ => typeof(HomePage)
    };
}

3. 配置应用的版本范围

在你的Package.appxmanifest里,一定要正确设置应用的最低版本目标版本

  • 最低版本:选择你想要支持的最早Windows 10版本(比如Build 15063,即Creators Update)
  • 目标版本:选择Build 16299或更高版本(即Fall Creators Update)

这样系统会根据用户的Windows版本,自动适配应用的运行环境。


一些额外的注意事项

  • 测试验证:一定要在不同版本的Windows 10模拟器或实体设备上测试,确保两种控件的导航逻辑和UI表现一致
  • 复用业务逻辑:尽量把导航、数据处理等核心逻辑放在ViewModel里,让SplitViewNavigationView共用同一套逻辑,减少代码冗余
  • 避免调用未支持的API:如果NavigationView有一些低版本没有的特性(比如SettingsItem),一定要用ApiInformation检查后再调用,否则会导致应用崩溃

内容的提问来源于stack exchange,提问作者Mohamad Kahfie

火山引擎 最新活动