2015-01-17 2 views
1

Я хотел бы спросить вас, как создать список с двумя столбцами. У меня есть список с плитками, и я хочу создать 2 столбца плиток, подобных этому изображению.WP 8.1 create Multi column lixtbox

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

Благодаря

ответ

1

Если вы пишите для вдовы, то вы также можете использовать 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

0

Вы можете установить ItemsPanel в ListBox к WrapPanel.

Windows Runtime не приносит собственной реализации WrapPanel, но, например, имеет WinRT Xaml Toolkit.