ListView xaml uwp 中缺少垂直滚动

Question

我是UWP的新手，需要使用SplitView做一个导航抽屉，所以我的基本布局结构如下。问题是我没有列表项的垂直滚动，也许我错过了一些参数，我们将不胜感激。

 <SplitView
    x:Name="MySplitView"
    DisplayMode="CompactOverlay"
    IsPaneOpen="True"
    CompactPaneLength="50"
    OpenPaneLength="280">

    <!--navigation drawer-->
    <SplitView.Pane>
        <StackPanel
            Background="Gray">

            <StackPanel>

                <ListView
                    x:Name="DrawerListOptions"
                    SelectionChanged="MySelectionChanged"
                    SelectionMode="Single"
                    ScrollViewer.VerticalScrollBarVisibility="Auto">

                    <ListView.ItemTemplate>
                        <DataTemplate>

                                    <TextBlock
                                        Text="{Binding Title}"
                                        FontSize="18"
                                        Margin="5,0,0,0" />


                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>

            </StackPanel>

        </StackPanel>

    </SplitView.Pane>

    <!--page stuff-->
    <SplitView.Content>
         <!--page code-->
    </SplitView.Content>

</SplitView>

Answer 1

首先，将StackPanel改为Grid

    <SplitView x:Name="MySplitView"
               PaneBackground="Gray"
               DisplayMode="CompactOverlay"
               IsPaneOpen="True"
               CompactPaneLength="50"
               OpenPaneLength="280">

        <!--navigation drawer-->
        <SplitView.Pane>
            <Grid>
                <ListView x:Name="DrawerListOptions"
                            SelectionChanged="MySelectionChanged"
                            SelectionMode="Single"
                            ScrollViewer.VerticalScrollBarVisibility="Auto">
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding Title}"
                                           FontSize="18"
                                           Margin="5,0,0,0" />
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>
            </Grid>

        </SplitView.Pane>

        <!--page stuff-->
        <SplitView.Content>
            <!--page code-->
        </SplitView.Content>

    </SplitView>

如果这没有帮助，请尝试设置 ScrollViewer.VerticalScrollBarVisibility="Visible"

更新

如果您想在 ListView 上方放置一些元素，请使用 Grid.RowDefinitions

        <SplitView.Pane>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>

                <StackPanel>
                    <!--Other elements-->
                </StackPanel>

                <ListView x:Name="DrawerListOptions"
                          Grid.Row="1"
                          SelectionChanged="MySelectionChanged"
                          SelectionMode="Single"
                          ScrollViewer.VerticalScrollBarVisibility="Visible">
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding Title}"
                                           FontSize="18"
                                           Margin="5,0,0,0" />
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>
            </Grid>

        </SplitView.Pane>

工作原理：

Answer 2

StackPanel 已经有一个滚动查看器。只需在 listView 中设置高度，滚动条就会出现。没有高度列表视图不理解它在屏幕上的位置。这样你就不需要使用网格。它对我有用！

ListView xaml uwp 中缺少垂直滚动

missing vertical scroll within ListView xaml uwp

xaml

win-universal-app