WP 8.1 创建多列列表框

Question

我想问你如何创建具有 2 列的列表框。我有带图块的列表框，我想创建 2 列图块，就像这张图片一样。

XAML 列表框

 <ListBox ItemContainerStyle="{StaticResource TileListBoxItemStyle}" Margin="0,130.499,56.483,-61.008" Height="568.509" VerticalAlignment="Top" RenderTransformOrigin="0.5,0.5" UseLayoutRounding="True" HorizontalAlignment="Right" Width="311.852" Background="#CC020202" Tapped="ListBox_Tapped">
        <ListBox.RenderTransform>
            <CompositeTransform SkewY="0.505" TranslateY="-0.825"/>
        </ListBox.RenderTransform>
        <!-- set its ItemsPanel to be a WrapPanel -->
        <ListBox.ItemsPanel >
            <ItemsPanelTemplate >
                <StackPanel Orientation="Vertical"/>
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>
        <ListBoxItem>
            <Grid>
                <TextBlock Text="Messages" />
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">

                    <TextBlock Text="test" FontSize="22" Margin="4,0,0,8" />
                </StackPanel>
            </Grid>
        </ListBoxItem>
        <ListBoxItem/>
        <ListBoxItem/>
        <ListBoxItem/>
        <ListBoxItem/>
        <ListBoxItem/>
        <ListBoxItem/>
        <ListBoxItem/>
        <ListBoxItem/>


    </ListBox>

谢谢

Answer 1

您可以将 ListBox 的 ItemsPanel 设置为 WrapPanel。

Windows Runtime 没有自带 WrapPanel 实现，但是例如 WinRT Xaml Toolkit 有一个。

Answer 2

如果您正在为 widows 运行时编写，那么您还可以将 ListView 与 WrapGrid 一起使用。它可以看起来像这样的例子：

<ListView>
    <ListView.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapGrid MaximumRowsOrColumns="2" Orientation="Horizontal" HorizontalAlignment="Center"/>
        </ItemsPanelTemplate>
    </ListView.ItemsPanel>
    <ListView.ItemTemplate>
        <DataTemplate>
            <Grid Margin="20">
                <Rectangle Fill="Red" Width="100" Height="100"/>
                <TextBlock Text="{Binding}"/>
            </Grid>
        </DataTemplate>
    </ListView.ItemTemplate>
    <x:String>Item 1</x:String>
    <x:String>Item 2</x:String>
    <x:String>Item 3</x:String>
    <x:String>Item 4</x:String>
    <x:String>Item 5</x:String>
</ListView>

结果：

WP 8.1 创建多列列表框

WP 8.1 create Multi column lixtbox

.net

c#

windows-phone-8.1