移除WinUI 3中NavigationView内容区域间隙(无需使用Style)
一、通过覆盖系统资源调整内容区域内边距
无需自定义完整Style,直接覆盖WinUI 3内置资源即可修改NavigationView内容区域的内边距,核心涉及两个系统资源:
NavigationViewContentMargin:控制**宽屏视图(导航菜单展开状态)**下内容区域的内边距,默认值为24,24,24,24NavigationViewCompactPaneContentMargin:控制**窄屏视图(汉堡菜单未展开状态)**下内容区域的内边距,默认值为48,24,24,24
你可以在App.xaml(全局生效)或页面的Resources(仅当前页面生效)中覆盖这些资源,示例如下:
<!-- 全局生效:在App.xaml的Application.Resources中添加 --> <Application.Resources> <!-- 移除所有内边距 --> <Thickness x:Key="NavigationViewContentMargin">0</Thickness> <Thickness x:Key="NavigationViewCompactPaneContentMargin">0</Thickness> <!-- 也可自定义内边距,比如仅保留上下边距 --> <!-- <Thickness x:Key="NavigationViewContentMargin">24,0,24,0</Thickness> --> </Application.Resources>
二、移除返回按钮后的窄视图对齐修复
当你通过IsBackButtonVisible="Collapsed"隐藏返回按钮后,窄视图下内容区域左侧会残留原本为返回按钮预留的空间,导致对齐偏移。解决方法是调整NavigationViewCompactPaneContentMargin的左侧值:
默认48的左内边距是为返回按钮预留的宽度,隐藏返回按钮后,将左值改为0(或与宽屏视图内边距保持一致)即可让内容正确对齐。
示例(页面级资源):
<Page.Resources> <Thickness x:Key="NavigationViewCompactPaneContentMargin">0,24,24,24</Thickness> </Page.Resources> <NavigationView IsBackButtonVisible="Collapsed"> <!-- 你的内容区域 --> </NavigationView>
内容的提问来源于stack exchange,提问作者Maximus
相关产品推荐
相关产品推荐

