如何在MVVM模型中管理tile usercontrols（具有listbox綁定）？

Question

//這是用戶控件的代碼

<ListBox Name="OvernightAverageListBox" ItemsSource="{Binding Path=OvernightAverageCollections}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" > 
<ListBox.ItemTemplate> 
     <DataTemplate> 
      <StackPanel Name="items" Background="{Binding BackColor}" Height="200" Width="200"> 
       <TextBlock Height="46" HorizontalAlignment="Left" Margin="26,10,0,0" Name="currentRate" Text="{Binding Current_rate}" VerticalAlignment="Top" FontSize="36" /> 
       <TextBlock Height="22" HorizontalAlignment="Left" Margin="26,20,0,0" Name="rate_difference" Text="{Binding RateChange_Value}" VerticalAlignment="Top" FontSize="20" /> 
       <TextBlock Height="30" HorizontalAlignment="Left" Margin="26,30,0,0" Name="productName" Text="{Binding Product_name}" VerticalAlignment="Top" FontSize="24" /> 
      </StackPanel> 
     </DataTemplate> 
    </ListBox.ItemTemplate> 

//在視圖

<controls:PanoramaItem Header="Overnight Average" Tap="RateTile_Tap"> 
      <Grid x:Name="overnightAverage"> 
      <views:OvernightAverageTileControl x:Name="eventsView">  </views:OvernightAverageTileControl> 
      </Grid> 
     </controls:PanoramaItem> 
</ListBox> 

這是綁定代碼現在acoording我的代碼的瓷磚來了垂直意味着每個瓦片在一個連續服用。 但我希望它們來水平和垂直意味着每行中兩個瓷磚。 plz分享你的建議我是新的xaml設計。

第一張圖片顯示了我得到的掃管笏。

第二個圖像是我想要的笏。

謝謝:)

Answer 1

我已經成功地在工具箱使用WrapPanel十月2011. http://www.windowsphonegeek.com/upload/articles/WrapPanelDemo.zip

Answer 2

您可以通過一個Grid更換的StackPanel在你的DataTemplate：的

<DataTemplate> 
    <Grid Name="items" Background="{Binding BackColor}" Height="200" Width="200"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition/> 
      <ColumnDefinition/> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition/> 
      <RowDefinition/> 
     </Grid.RowDefinitions> 
     <TextBlock Grid.Column="0" Grid.Row="0" Text="{Binding Current_rate}" ... /> 
     <TextBlock Grid.Column="1" Grid.Row="0" Text="{Binding RateChange_Value}" ... /> 
     <TextBlock Grid.Column="0" Grid.Row="1" Text="{Binding Product_name}" ... /> 
    </Grid> 
</DataTemplate> 

你也可以指定絕對或相對寬度通過設置ColumnDefinition.Width和來確定行和列的高度屬性。