WP 8.1创建多列列表框

时间:2015-01-17 23:45:06

标签: c# .net windows-phone-8.1

我想问你如何创建包含2列的列表框。我有瓦片列表框,我想创建2列瓷砖,如图像。

XAML ListBox

 <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>

enter image description here

由于

2 个答案:

答案 0 :(得分:1)

如果您正在编写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>

结果:

listandwrapgrid

答案 1 :(得分:0)

您可以将ListBox的ItemsPanel设置为 WrapPanel

Windows运行时没有带来自己的WrapPanel实现,但是WinRT Xaml Toolkit有一个实例。