0

現在GridView、ユーザーがスワイプできる画像のリストを表示するために を使用しています。リストの最後に近づくと、ObservableCollectionを実装する を使用して新しい画像が読み込まれISupportIncrementalLoadingます。

画像のサイズに合わせてセルのサイズを変更するにはどうすればよいですか? 画像は縦長の場合もあれば、横長の場合もあり、縦横比が不均一な場合もあります。ただし、GridViewすべてのセルが同じ幅であると主張します。

たとえば、次のようにすると:

<GridView
    x:Name="itemGridView"
    AutomationProperties.AutomationId="ItemsGridView"
    AutomationProperties.Name="Items"
    TabIndex="1"
    Grid.RowSpan="2"
    Padding="116,136,116,46"
    SelectionMode="None"
    DataFetchSize="10"
    IncrementalLoadingThreshold="5"
    ItemsSource="{Binding Source={StaticResource itemsViewSource}}"
    IncrementalLoadingTrigger="Edge"
    IsSwipeEnabled="false">
    <GridView.ItemTemplate>
        <DataTemplate>
            <Grid HorizontalAlignment="Left">
                <Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}">
                    <Image Source="{Binding Image}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>
                </Border>
                <StackPanel VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundThemeBrush}">
                    <TextBlock Text="{Binding Title}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextStyle}" Height="30" Margin="15,0,5,0"/>
                </StackPanel>
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
</GridView>

私はいつも最初の画像と同じ幅になってしまいます。画像の幅を設定しようとすると (画像の幅を返すデータバインドされたプロパティがあります)、一部の画像は幅が狭くなりますが、それらのセルは他のすべてと同じ幅のままです。

<Image Width="{Binding ImageWidth}" Source="{Binding Image}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>

階層内のアイテムの幅を設定しても役に立たないようです-これを極端にしてもまったく役に立ちません-たとえば

<DataTemplate>
    <Grid HorizontalAlignment="Left"  Width="{Binding ImageWidth}">
        <Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}" Width="{Binding ImageWidth}">
            <Image Width="{Binding ImageWidth}" Source="{Binding Image}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>
         </Border>
         <StackPanel VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundThemeBrush}">
             <TextBlock Text="{Binding Title}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextStyle}" Height="30" Margin="15,0,5,0"/>
         </StackPanel>
     </Grid>
</DataTemplate>
4

2 に答える 2

2

インクリメンタル ロードをサポートする 2 つの ItemsPanelTemplate-s があります: VirtualizingStackPanel と WrapGrid です。WrapGrid では、異なるアイテムのサイズは許可されません。VirtualizingStackPanel では、アイテムの可変サイズが許可されますが、アイテムは 1 つの行/列に表示されます。したがって、別のレイアウトが必要な場合は、VirtualizingPanel のカスタム実装が必要です。

しかし、私はあなたが何を望んでいるのか正確にはわかりません。グリッドが必要な場合は、行または列のすべてのアイテムが同じ高さまたは幅になります。仮想化 VariableSizedWrapGrid が必要ですか?

于 2012-12-06T17:18:17.307 に答える
0

VariableSizedWrapGridを見てください。

この xaml を GridView 宣言に追加してみてください。 

<GridView.ItemsPanel>
    <ItemsPanelTemplate>
        <VariableSizedWrapGrid />
    </ItemsPanelTemplate>
</GridView.ItemsPanel>
于 2012-12-06T05:15:00.600 に答える