如何在 UWP 中调整 NavigationView 和 SplitView 的大小

问题描述

我想让用户在我的 UWP 应用中调整 NavigationView 的大小。找不到任何资源，我如何才能做到这一点。

我看到一些应用程序具有“可调整大小的 splitView”，但对于 SplitView，我也看不到任何此类默认设置的调整大小属性。

请帮忙。 提前致谢

解决方法

没有这样的属性可以调整SplitView和NavigationView的大小，需要自定义布局来实现类似的效果。您可以使用 Slider control 并将 SplitView 的 OpenPaneLength 属性绑定到 Slider.Value 来执行此操作。请参考以下代码。

     <Grid>

       <SplitView Name="CoreSplitView"          
            DisplayMode="Inline"
            IsPaneOpen="True"
            OpenPaneLength="{Binding Value,ElementName=MasterSlider,Mode=OneWay}">
            <SplitView.Pane>
                <Grid Name="PaneGrid" Background="Gray">
                    <Slider Name="MasterSlider"
                        MinWidth="480"
                        VerticalAlignment="Stretch"
                       Maximum="480"
                        Minimum="10"
                        Opacity="0"
                        Value="150" 
                           />
                    <StackPanel Name="PaneStackPanel" 
                     Margin="0,10,0" Background="LightGray">
                        <TextBlock TextWrapping="Wrap" Text="Use a slider when you want your users to be able to set defined,contiguous values (such as volume or brightness) or a range of discrete values (such as screen resolution settings).A slider is a good choice when you know that users think of the value as a relative quantity" />
                    </StackPanel>
                </Grid>
            </SplitView.Pane>
            <Grid Name="ContentGrid" Background="LightSteelBlue">
            </Grid>
        </SplitView>
</Grid>

直接位于滑块下方的 StackPanel 就像是滑块的盖子。注意 StackPanel 有 Margin="0,0"，这意味着与右墙的距离为 10px，这允许滑块区域显示为用于拖动窗格的灰色条带，同样是 10px是任意的，但它必须匹配滑块的最小值。