GridView中图像的水平列表

时间:2016-02-26 06:59:57

标签: xaml windows-phone-8.1

我是Windows手机开发的新手,我需要水平滚动列出水平方式的图像。我尝试使用以下代码

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
    <GridView Name="display" ItemsSource="{Binding}" Foreground="#FFE6D52E">
        <GridView.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsWrapGrid Orientation="Horizontal" MaximumRowsOrColumns="3"/>
            </ItemsPanelTemplate>
        </GridView.ItemsPanel>
        <GridView.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal" Margin="10">
                    <Image Source="{Binding Image}" Width="300" Height="300"/>
                </StackPanel>
            </DataTemplate>
        </GridView.ItemTemplate>
    </GridView>
</Grid>

但它垂直显示为附加enter image description here

但我需要将其显示如下

enter image description here

请指导我实现预期

提前致谢

1 个答案:

答案 0 :(得分:2)

首先,将OrientationHorizontalHorizontal更改为Vertical。 第二步,启用ScrollViewer.VerticalScrollMode

<GridView Name="display"
          VerticalAlignment="Top"
          ScrollViewer.HorizontalScrollBarVisibility="Auto"
          ScrollViewer.VerticalScrollBarVisibility="Disabled"
          ScrollViewer.HorizontalScrollMode="Enabled"
          ScrollViewer.VerticalScrollMode="Disabled"
          Foreground="#FFE6D52E">
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid Orientation="Vertical"
                           MaximumRowsOrColumns="3"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
    <GridView.ItemTemplate>
        <DataTemplate>
            <Grid Margin="10">
                <Image Source="{Binding }" 
                       HorizontalAlignment="Center"
                       Stretch="Uniform"
                       Width="30" 
                       Height="30"/>
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
</GridView>