2014-02-07 39 views
0

我有以下XAML代码:多列的StackPanel或替代

<StackPanel Background="White" Margin="267,207,0,44" Grid.ColumnSpan="2"> 
    <ScrollViewer Margin="30,30,0,30" Height="444"> 
     <ItemsControl Name="ListCountries"> 
     <ItemsControl.ItemsPanel> 
      <ItemsPanelTemplate> 
       <StackPanel Orientation="Horizontal" /> 
      </ItemsPanelTemplate> 
     </ItemsControl.ItemsPanel> 
     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <StackPanel Margin="0,0,10,0" Width="100"> 
        <TextBlock Text="{Binding Key}" Foreground="Red" /> 
        <ItemsControl ItemsSource="{Binding}"> 
        <ItemsControl.ItemTemplate> 
         <DataTemplate> 
          <StackPanel Margin="0,10,0,0"> 
           <TextBlock TextWrapping="Wrap" Text="{Binding title}" Foreground="Black" /> 
           <TextBlock TextWrapping="Wrap" Text="{Binding desc}" Foreground="Gray" /> 
          </StackPanel> 
         </DataTemplate> 
        </ItemsControl.ItemTemplate> 
        </ItemsControl> 
       </StackPanel> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
     </ItemsControl> 
    </ScrollViewer> 
</StackPanel> 

我设置的ItemsControl命名ListCountries的的ItemSource,用的IEnumerable>和它打印标题的列表,后面的列表OtherClass的对象。

我的问题是,填充的列有时比它们插入的Stackpanel的高度要大,我希望能够将我的内部列表拆分为列。

enter image description here ,你可以在图片中看到,比利时国家被现在我的所有国家都具有垂直滚动单列splited成2列 。

+0

有麻烦可视化你想要什么,你可以提供一个视觉?那么它应该是一块蛋糕。 –

+0

我编辑了我的帖子,希望它会更清晰一点 – Ric

+0

所以你想(比如)比利时的列表将其所有信息都放在同一列,这样总共有2列而不是4列? –

回答

0

您应该为此使用GridView。下面是一些代码从Grid应用程序在Visual Studio

<GridView 
     x:Name="itemGridView" 
     Grid.RowSpan="2" 
     Padding="116,137,40,46" 
     ItemsSource="{Binding Source={StaticResource groupedItemsViewSource}}" 
     SelectionMode="None" 
     Height="600"> 
     <GridView.ItemTemplate> 
      <DataTemplate> 
       <Grid HorizontalAlignment="Left" Width="200"> 
        <TextBlock Text="{Binding Description}" Foreground="{ThemeResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextBlockStyle}" Height="60" Margin="15,0,15,0"/>      
       </Grid> 
      </DataTemplate> 
     </GridView.ItemTemplate> 
     <GridView.GroupStyle> 
      <GroupStyle> 
       <GroupStyle.HeaderTemplate> 
        <DataTemplate> 
         <TextBlock Text="{Binding Title}" Style="{StaticResource SubheaderTextBlockStyle}" TextWrapping="NoWrap" /> 
        </DataTemplate> 
       </GroupStyle.HeaderTemplate> 
      </GroupStyle> 
     </GridView.GroupStyle> 
    </GridView> 

这里略作修改有一个什么这看起来像一个屏幕截图,有样本数据

enter image description here