[UWP]我的列表视图在splitview的一侧不滚动。 [英] [UWP] my list view in side the splitview is not scrolling.

问题描述

我在拆分视图中的列表视图不滚动。

my list view inside the split view is not scrolling.

<SplitView ScrollViewer.IsVerticalRailEnabled="True" BorderBrush="White" BorderThickness="1" x:Name="windowssplit1" DisplayMode="Overlay" Margin="40,-95,0,-200" Width="340" HorizontalAlignment="Left" x:FieldModifier="Public" Grid.RowSpan="2">
            <SplitView.Pane>
                <!--<Grid removed="Gray" ScrollViewer.VerticalScrollMode="Enabled" ScrollViewer.IsVerticalScrollChainingEnabled="True">-->
                    <StackPanel removed="Gray" BorderBrush="White" BorderThickness="1" ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.IsVerticalScrollChainingEnabled="True" Margin="0,49,0,-162">
                    <TextBlock Text="All Ages" Margin="20,10,0,10" Foreground="White" FontSize="20" />
                    <Border BorderThickness="0.4" BorderBrush="White" Margin="20,0,0,10" Width="280" HorizontalAlignment="Left"/>
                    <ListView x:Name="filterlist1" Margin="10,0,0,0" ScrollViewer.VerticalScrollMode="Enabled" ScrollViewer.IsVerticalRailEnabled="True" SelectionChanged="filterlist_SelectionChanged">
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <TextBlock FontSize="18" Margin="0,10,0,0" Foreground="White" Text="{Binding CategoryName}"/>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>
                <!--</Grid>-->
                </StackPanel>
            </SplitView.Pane>
        </SplitView>

 <SplitView x:Name="PhoneSplitView" Margin="0,50,0,0" DisplayMode="Overlay" Width="250" HorizontalAlignment="Left" x:FieldModifier="Public" Grid.ColumnSpan="2" Grid.RowSpan="2">
            <SplitView.Pane>
                <!--<Grid removed="Gray">-->
                <StackPanel removed="Gray" ScrollViewer.VerticalScrollMode="Enabled">
                    <TextBlock Text="Refine" x:Name="refine" Margin="10,0,0,10" Foreground="White"/>
                    <Border BorderThickness="0.4" x:Name="border1" BorderBrush="White" Margin="10,0,0,0" Width="200" HorizontalAlignment="Left"/>
                    <TextBlock Text="Sort By :" Margin="10,15,0,0" Foreground="White" FontSize="13" FontWeight="Light" />
                    <ListView x:Name="sortbylist" SelectionChanged="sortbylist_SelectionChanged">
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <TextBlock Foreground="White" x:Name="dsasd" Text="{Binding SortName}"/>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>

                    <Border BorderThickness="0.4" x:Name="border2" BorderBrush="White" Margin="10,10,0,0" Width="200" HorizontalAlignment="Left"/>
                    <TextBlock Text="Filter :" Margin="10,15,0,0" x:Name="refine1" Foreground="White" FontSize="13" FontWeight="Light" />
                    <ListView x:Name="filterlist" SelectionChanged="filterlist_SelectionChanged" ScrollViewer.IsVerticalRailEnabled="True">
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <TextBlock Foreground="White" Text="{Binding CategoryName}"/>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>

                    <Border BorderThickness="0.4" x:Name="border3" BorderBrush="White" Margin="10,10,0,0" Width="280" HorizontalAlignment="Left"/>
                    <TextBlock x:Name="langlist2" Text="Language" Margin="10,15,0,0" Foreground="White" FontSize="13" FontWeight="Light"/>
                    <ListView x:Name="langlist" ScrollViewer.VerticalScrollMode="Enabled" ScrollViewer.IsVerticalRailEnabled="True" SelectionChanged="langlist1_SelectionChanged">
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <TextBlock Foreground="White" Text="{Binding SortName}"/>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>
                <!--</Grid>-->
                </StackPanel>
            </SplitView.Pane>
        </SplitView>

Bolded Code中的列表视图必须滚动如何完成此操作，帮助我....

如何使列表滚动。



参考图片： Image1



Image2



我的尝试：



通过一些参考，我尝试通过删除Splitview.Pane中的Stack Panel并将其替换为Grid，但它没有帮助我。

The List View present in the Bolded Code must Scroll how this can be done, Help me....
How to make the List scroll.

Reference Image : Image1

Image2

What I have tried:

By some refrence i tried by removing Stack Panel in the Splitview.Pane and replaced it with Grid, but it not helped me.

推荐答案

I已修改Code Snip，如下所示，Plac在SplitView.Pane中修改了ScrollViewer并修改了边距值。



Windows 10 PC应用程序代码

I had modified the Code Snip as below, Placed a ScrollViewer inside the SplitView.Pane and Modified the Margin values.

Code for Windows 10 PC App

<splitview borderbrush="White" borderthickness="1" x:name="windowssplit1" displaymode="Overlay" margin="310,95,0,100" x:fieldmodifier="Public" grid.rowspan="2" xmlns:x="#unknown">
            <splitview.pane>
                <scrollviewer x:name="scrol2" isverticalrailenabled="True">
                    <stackpanel background="Gray" borderbrush="White" borderthickness="1">
                        <textblock text="All genere" margin="20,10,0,10" foreground="White" fontsize="20" />
                        <border borderthickness="0.4" borderbrush="White" margin="20,0,0,10" width="280" horizontalalignment="Left" />
                        <listview x:name="filterlist1" margin="10,-10,0,0" selectionchanged="filterlist_SelectionChanged">
<listview.itemtemplate>
<datatemplate>
 <textblock fontsize="18" margin="0,5,0,0" foreground="White" text="{Binding CategoryName}" />
 </datatemplate>
</listview.itemtemplate>
                        </listview>
                    </stackpanel>
                </scrollviewer>
            </splitview.pane>
        </splitview>

Code for Windows 10 Phone App

Code for Windows 10 Phone App

<splitview x:name="PhoneSplitView" margin="0,50,0,0" displaymode="Overlay" width="250" scrollviewer.verticalscrollmode="Enabled" scrollviewer.isverticalrailenabled="True" horizontalalignment="Left" x:fieldmodifier="Public" grid.columnspan="2" grid.rowspan="2" xmlns:x="#unknown">
            <splitview.pane>
                <scrollviewer x:name="scrol1" isverticalrailenabled="True">
                    <!--<Grid Background="Gray">-->
                    <stackpanel background="Gray" scrollviewer.verticalscrollmode="Enabled">

                        <border borderthickness="0.4" x:name="border3" borderbrush="White" margin="10,10,0,0" width="280" horizontalalignment="Left" />
                        <textblock x:name="langlist2" text="Language" margin="10,15,0,0" foreground="White" fontsize="13" fontweight="Light" />
                        <listview x:name="langlist" height="Auto" width="Auto" selectionchanged="langlist1_SelectionChanged">
                            <listview.itemtemplate>
                                <datatemplate>
                                    <textblock foreground="White" text="{Binding SortName}" />
                                </datatemplate>
                            </listview.itemtemplate>
                        </listview>

                        <textblock text="Refine" x:name="refine" margin="10,0,0,10" foreground="White" />
                        <border borderthickness="0.4" x:name="border1" borderbrush="White" margin="10,0,0,0" width="200" horizontalalignment="Left" />
                        <textblock text="Sort By :" margin="10,15,0,0" foreground="White" fontsize="13" fontweight="Light" />
                        <listview x:name="sortbylist" selectionchanged="sortbylist_SelectionChanged" scrollviewer.isverticalrailenabled="True" scrollviewer.verticalscrollmode="Enabled" height="Auto" width="Auto">
                            <listview.itemtemplate>
                                <datatemplate>
                                    <textblock foreground="White" x:name="dsasd" text="{Binding SortName}" />
                                </datatemplate>
                            </listview.itemtemplate>
                        </listview>

                        <border borderthickness="0.4" x:name="border2" borderbrush="White" margin="10,10,0,0" width="200" horizontalalignment="Left" />
                        <textblock text="Filter :" margin="10,15,0,0" x:name="refine1" foreground="White" fontsize="13" fontweight="Light" />
                        <listview x:name="filterlist" selectionchanged="filterlist_SelectionChanged" scrollviewer.isverticalrailenabled="True" scrollviewer.verticalscrollmode="Enabled" height="Auto" width="Auto">
                            <listview.itemtemplate>
                                <datatemplate>
                                    <textblock foreground="White" text="{Binding CategoryName}" />
                                </datatemplate>
                            </listview.itemtemplate>
                        </listview>
                    </stackpanel>
                </scrollviewer>
            </splitview.pane>
        </splitview>

This accomplished my work, and all the lists in Splitview are scrolling.

This accomplished my work, and all the lists in Splitview are scrolling.

这篇关于[UWP]我的列表视图在splitview的一侧不滚动。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！