如何在 UWP 中的滚动查看器中设置滚动查看器

Question

我想在滚动查看器中显示一个滚动查看器。父滚动查看器应垂直工作，子滚动查看器应水平和垂直工作。

我试图在父滚动查看器中添加整个网格，当我调整页面大小时父滚动查看器不工作，子滚动查看器是水平工作而不是垂直。

 <Grid>
     <VisualStateManager> ...
     <ScrollViewer  >
    <Grid HorizontalAlignment="Stretch" Height="1000" Margin="0,0,0,0" VerticalAlignment="Top">
         <Grid.ColumnDefinitions>
            <ColumnDefinition x:Name="COne" Width="59"/>
            <ColumnDefinition x:Name="CTwo" Width="31*"/>
            <ColumnDefinition x:Name="CThree" Width="44*"/>
            <ColumnDefinition x:Name="CFour" Width="53*"/>
            <ColumnDefinition x:Name="CFive" Width="116*"/>
            <ColumnDefinition x:Name="CSix" Width="40*"/>
            <ColumnDefinition x:Name="CSeven" Width="262*"/>
            <ColumnDefinition x:Name="CEight" Width="234*"/>
            <ColumnDefinition x:Name="Cnine" Width="350*"/>
             </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition x:Name="ROne" Height="45*"/>
            <RowDefinition x:Name="RTwo" Height="23*"/>
            <RowDefinition x:Name="RThree" Height="432*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

      <Border CornerRadius="5" extensions:Mouse.Cursor="Hand" BorderBrush="#E1E1E1" BorderThickness="1" Grid.ColumnSpan="8" Margin="7,18,31,395" Grid.Column="1" Grid.Row="2" >


            <ScrollViewer  x:Name="Gridscroller" HorizontalScrollBarVisibility="Auto"  VerticalScrollBarVisibility="Auto"    Grid.ColumnSpan="8"  Grid.Column="1" Grid.Row="2" >
                <Toolkit:DataGrid HorizontalAlignment="Stretch" VerticalAlignment="Stretch"  ScrollViewer.VerticalScrollBarVisibility="Visible" ScrollViewer.HorizontalScrollBarVisibility="Visible"   extensions:Mouse.Cursor="Hand"   Style="{StaticResource GridBackground}"   BorderBrush="Transparent"  BorderThickness="5"   AllowFocusOnInteraction="False" x:Name="UserListView"  SelectionMode="Single"     FontSize="16" RelativePanel.AlignLeftWithPanel="True" Grid.ColumnSpan="8" Grid.Column="1" Grid.Row="2" OrderChanged="UserListView_OrderChanged" Tapped="UserListView_Tapped" >
.
.
.
  </Toolkit:DataGrid>
            </ScrollViewer>

        </Border>

 <TextBlock FontFamily="{StaticResource inventorySemiBoldFont}" Foreground="#444444" FontSize="13" Visibility="Visible"  x:Name="SearchMessage" Grid.Column="3" HorizontalAlignment="Left" Margin="0,74,0,0" Grid.Row="2"  VerticalAlignment="Top" Grid.ColumnSpan="4" Width="391"/>


        <StackPanel HorizontalAlignment="Center"  Margin="0,486,32,0" Grid.Row="2" VerticalAlignment="Top"  Grid.ColumnSpan="7" Grid.Column="2"  />

</Grid>
 </ScrollViewer>
</Grid>

Answer 1

在ScrollViewer中，仅当内容width/height大于容器width/height时才滚动，但ScrollViewer的内部可视区域是无限的，所以如果您想让子 ScrollViewer 工作，您需要为其设置 width/height。

喜欢：

<ScrollViewer>
    <ScrollViewer width="500" HorizontalScrollBarVisibility="Auto" HorizontalScrollMode="Auto">
        <!-- Content here -->
    </ScrollViewer/>
</ScrollViewer>

此致。

如何在 UWP 中的滚动查看器中设置滚动查看器

How to set scroll-viewer inside scroll-viewer in UWP

xaml

win-universal-app

uwp-xaml