グリッド上でScrollviewerが動作しない

Question

こんにちは私はWindows 10でUWPを学習しています。グリッドをスクロールする必要があります。

<Grid> 

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

     <!-- Header --> 
     <Rectangle Grid.Row="0" Grid.ColumnSpan="3"/> 
     <TextBlock Grid.Column="1" Name="CurrentDateText" /> 


      <Button Name="NextButton" Grid.Column="2" Content="&gt;" 
        HorizontalAlignment="Right" Margin="20" 
        Click="NextButton_Click_1"/> 

          <ScrollViewer x:Name="Scroll" VerticalAlignment="Top" Grid.Row="1" VerticalScrollBarVisibility="Hidden"> 
       <Grid Grid.ColumnSpan="3" Name="Grid2"> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="auto"/> 
         <ColumnDefinition Width="*" /> 
         <ColumnDefinition Width="*" /> 
         <ColumnDefinition Width="*" /> 
         <ColumnDefinition Width="*" /> 
         <ColumnDefinition Width="*" /> 
         <ColumnDefinition Width="*" /> 
         <ColumnDefinition Width="*" /> 
        </Grid.ColumnDefinitions> 
       </Grid> 
      </ScrollViewer> 

     </Grid> 

の最初の部分：コードの2番目の部分で

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

     <CommandBar VerticalAlignment="Top" Grid.Row="0"> 
      <CommandBar.Content> 
       <TextBlock Name="CurrentDateText" Margin="10,10,0,0" HorizontalAlignment="Left" VerticalAlignment="Bottom" FontSize="22" FontStretch="ExtraExpanded"/> 
      </CommandBar.Content> 
      <CommandBar.PrimaryCommands> 
       <AppBarButton Name="button1" Icon="Forward" Label="button" Click="NextButton_Click_1"/> 
      </CommandBar.PrimaryCommands> 
     </CommandBar> 

      <Grid Grid.Row="1" Grid.ColumnSpan="3" Name="Grid1"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="60"/> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
      </Grid.ColumnDefinitions> 
     </Grid> 

       <ScrollViewer x:Name="Scroll" Grid.Row="2" VerticalAlignment="Top" VerticalScrollBarVisibility="Auto" VerticalScrollMode="Enabled"> 
      <Grid Grid.ColumnSpan="3" Name="Grid2"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="60"/> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
       <ColumnDefinition Width="*" /> 
      </Grid.ColumnDefinitions> 
     </Grid> 
     </ScrollViewer> 
    </Grid> 

： 彼らはコードを2枚持っている非常によく似ています、私の意図は、grid2にスクロールする最初のコードの一部でありますコードが動作しない、2番目の動作します。 何が間違っているのか理解できません。なぜ最初に動作しないのか理解できません。 ありがとう

Answer 1

これは初心者のためのよくある間違いであり、あなたはそれについて悪く感じるべきではありません。スクロールビューアについて覚えておくべきことは、高さと幅を持たなければならないということです。時々あなたは高さと幅を設定します。ときには、高さと幅をコンテナのサイズで設定することもできます。右？この時

ルック：そのサンプルで

<ScrollViewer> 
    <Grid Height="1000" /> 
</ScrollViewer> 

それも存在しないように、スクロールビューアが作用するであろう。どうして？それは高さと幅がないためです。その場合のコンテンツと同じサイズになります。それは基本的にあなたが見ているものです。この時

ルック：

<ScrollViewer Height="100"> 
    <Grid Height="1000" /> 
</ScrollViewer> 

これはうまく垂直方向にスクロールだろうが、それは水平方向にスクロールすることはありません。なぜ見えますか？それは幅がないからです。時にはこれが完璧なシナリオです。しかし、それは開発者をガードすることができるもう一つのものです。この時

ルック：

<StackPanel> 
    <ScrollViewer> 
     <Grid Height="1000" /> 
    </ScrollViewer> 
<StackPanel> 

これは、多くの開発者をキャッチする別のシナリオです。どうして？スタックパネルの高さは無限大です。高さと幅は基本的にコンテナによって継承されるので、スクロールビューアは、既に無限のサイズに成長することができるので、スクロールする理由は決してありません。この時

ルック：

<Grid> 
    <ScrollViewer> 
     <Grid Height="1000" /> 
    </ScrollViewer> 
<Grid> 

パーフェクト。スクロールビューアの高さと幅は、コンテナの高さと幅、グリッドによって継承されるため、スクロールビューアは必要なようにスクロールします。また、グリッドがウィンドウのサイズに制約されるため、あなたは素晴らしい形になっています。

グリッドの動作をスタックパネルに入れることで、グリッドの動作を損なう可能性があります。あなたが何をしているのか分からない限り、それをしないでください。 XAMLを初めてお使いの方は、Microsoft Virtual Academyでthis free courseをお楽しみいただけます。

これが役立ちます。

運が良かった！