現在、BitmapImagesのObservableCollectionにバインドされたWrapGridがあります。私が望むのは、これらが1行に4項目、下に伸びて表示されることです。WrapGridがユーザー画面のサイズを超えて伸びたら、ユーザーが下にスクロールできるようにします。現在は機能していますが、スクロールバーは表示されず、ユーザーは下にスクロールできません。そのため、画面を超えて拡張すると、画像が切り取られて役に立たなくなります。
グリッドの定義方法が間違っているに違いないと思います。しかし、私の一生の間、何時間も検索した後、私が間違ったことをしたことを理解することはできません。
これが私のコードです:
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="140" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Button x:Name="backButton"
Click="GoBack"
IsEnabled="{Binding Frame.CanGoBack, ElementName=pageRoot}"
Style="{StaticResource BackButtonStyle}" />
<TextBlock x:Name="pageTitle"
Grid.Column="1"
Text="Image Gallery"
Style="{StaticResource PageHeaderTextStyle}" />
</Grid>
<Grid Grid.Row="1" Grid.Column="1">
<Grid Margin="120,0,0,0">
<Grid.RowDefinitions>
<RowDefinition Height="60" />
<RowDefinition Height="60" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
...
<ItemsControl Name="listOfImages" ItemsSource="{Binding Path=Images}" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="5" ScrollViewer.VerticalScrollBarVisibility="Visible">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapGrid Orientation="Horizontal" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="5" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Image Stretch="Fill" Width="200" Height="200" Source="{Binding}" Margin="10,10,10,0" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="5" />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Grid>
</Grid>