自适应列表视图帮助（Windows 通用应用程序）

Question

下面是我的 xaml 代码，它定义了 ListView。输出是系列产品。但问题是产品一个接一个对齐。

我想要一个输出一个接一个垂直对齐。

<ListView x:Name="list" Margin="0,0,0,0" SelectionChanged="list_SelectionChanged" VerticalAlignment="Top">
    <ListView.Resources>
        <DataTemplate x:Key="myCell">
            <Border BorderBrush="Gray"  BorderThickness="0,0,0,0" >
                <Grid Margin="0" x:Name="tryadpative"   >
                    <Grid.RowDefinitions>
                        <RowDefinition Height="8*" />
                        <RowDefinition Height="1*" />
                        <RowDefinition Height="1*" />
                    </Grid.RowDefinitions>

                    <Image x:Name="prodimg" Width="auto" Source="{Binding prodimg}" Grid.Row="0"></Image>
                    <TextBlock x:Name="productcode"  TextWrapping="Wrap"  Text="{Binding productcode}" HorizontalAlignment="Center" Width="auto" FontSize="12" Grid.Row="1" Foreground="Gray"/>
                    <TextBlock x:Name="productname" FontSize="14" HorizontalAlignment="Center" VerticalAlignment="Bottom" Foreground="Gray" Grid.Row="0"  Text="{Binding productname}" />
                    <TextBlock x:Name="productmindec"  TextWrapping="Wrap" HorizontalAlignment="Center"  Text="{Binding productmindec}" Width="auto" FontSize="14"  Grid.Row="2" Foreground="Gray"/>

                    <!--<Image x:Name="prodimg" Width="auto" Source="{Binding prodimg}" Grid.Row="0"></Image>
                    <TextBlock x:Name="productcode"  TextWrapping="Wrap"  Text="{Binding productcode}"  Width="auto" FontSize="12"  Foreground="Gray"/>
                    <TextBlock x:Name="productname" FontSize="14"  Foreground="Gray"   Text="{Binding productname}" />
                    <TextBlock x:Name="productmindec"  TextWrapping="Wrap"   Text="{Binding productmindec}" Width="auto" FontSize="14"   Foreground="Gray"/>-->                                                                                 

                </Grid>
            </Border>
        </DataTemplate>
    </ListView.Resources>

    <!--<ListView.ItemContainerStyle>
        <Style TargetType="ListViewItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
        </Style>
    </ListView.ItemContainerStyle>-->

    <ListView.ItemTemplate>
        <StaticResource ResourceKey="myCell"/>
    </ListView.ItemTemplate>

</ListView>

Answer 1

ItemsStackPanel can be used only as the ItemsPanel of an ItemsControl that displays more than one item at a time. It can't be used with an ItemsControl that displays only one item at a time, such as a ComboBox or FlipView. ItemsStackPanel is the default ItemsPanel for ListView.

By default, the ItemsStackPanel stacks items vertically from top to bottom. You can set the Orientation property to Horizontal to stack items from left to right.

有关详细信息，请参阅 ItemsStackPanel。

我们应该可以将 Horizontal 设置为 ItemsStackPanel 的 Orientation。

例如：

<ListView.ItemsPanel>
    <ItemsPanelTemplate>
        <ItemsStackPanel Orientation="Horizontal" >
        </ItemsStackPanel>
    </ItemsPanelTemplate>
</ListView.ItemsPanel>

顺便说一句，如果你想水平滚动 ListView，你应该能够将 Visible 设置为 ScrollViewer.HorizontalScrollBarVisibility 并将 Enabled 设置为 ScrollViewer.HorizontalScrollMode ListView.

例如：

<ListView x:Name="list"
          Margin="0,0,0,0" 
          SelectionChanged="list_SelectionChanged" 
          VerticalAlignment="Top"  
          SelectionMode="Single" 
          ScrollViewer.HorizontalScrollBarVisibility="Visible"
          ScrollViewer.HorizontalScrollMode="Enabled">
</ListView>

自适应列表视图帮助（Windows 通用应用程序）

Adaptive List View Help (Windows Universal App)

windows

xaml

win-universal-app