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

时间:2019-08-02 09:36:18

标签: xaml win-universal-app uwp-xaml

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

当我调整父滚动查看器无法正常工作的页面大小并且子滚动查看器处于水平工作而不是垂直工作的页面大小时,我试图在父滚动查看器中添加整个网格。

 <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>

1 个答案:

答案 0 :(得分:1)

ScrollViewer中,仅当内容的宽度/高度大于容器的宽度/高度时滚动,而ScrollViewer的内部可视区域是无限的,因此如果您希望子级ScrollViewer可以滚动工作,您需要为其设置宽度/高度。

喜欢:

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

最诚挚的问候。

相关问题