Question

我希望在我的WrapPanel中添加ListBox，以便它的项目可以垂直和极大地包裹。我能够使用带有以下代码的Microsoft工具包在Windows Phone 8 Sliverlight中实现此目的;

Windows Phone 8

<ListBox x:Name="ListSection" ItemsSource="{Binding Section}" > 
    <ListBox.ItemsPanel>
       <ItemsPanelTemplate>
          <toolkit:WrapPanel Orientation="Horizontal" ></toolkit:WrapPanel>
       </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
<ListBox.ItemTemplate>
 <DataTemplate>
  <StackPanel Margin="20">
   <Image Source="{Binding ImagePath}" Width="80" Height="80"></Image>
   <TextBlock Style="{StaticResource PhoneTextBlockBase}"
                HorizontalAlignment="Center"
                Foreground="Black"
                Text="{Binding Header}"
                FontWeight="Bold"
                VerticalAlignment="Center" />
 </StackPanel>
</DataTemplate>

我理解UWP中没有的Microsoft工具包，我是否有可能在UWP中实现此类行为？

UWP无法正常工作

    <ListBox x:Name="ItemsListBox" ItemsSource="{Binding Section}">
      <ListBox.ItemsPanel>
      <ItemsPanelTemplate>
         <StackPanel HorizontalAlignment="Stretch"></StackPanel>
      </ItemsPanelTemplate>
      </ListBox.ItemsPanel>
      <ListBox.ItemTemplate>
      <DataTemplate>
       <StackPanel>
          <Image Source="{Binding ImagePath}" Width="80" Height="80"></Image>
          <TextBlock  HorizontalAlignment="Center"
                      Foreground="Black"
                      Text="{Binding Header}"
                      FontWeight="Bold"
                      VerticalAlignment="Center" />
       </StackPanel>
       </DataTemplate>
   </ListBox.ItemTemplate>
</ListBox>

谢谢！

Answer 1

您必须使用ListView和ItemsWrapGrid作为ItemsPanel

您可以使用示例

查看MSDN文档

https://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.controls.itemswrapgrid.aspx

此示例适用于GridView，但对于ListView

是相同的

<GridView>
<GridView.ItemsPanel> 
    <ItemsPanelTemplate>
        <ItemsWrapGrid Orientation="Horizontal"/>  
    </ItemsPanelTemplate> 
</GridView.ItemsPanel>

您可以使用属性Orientation垂直或水平设置项目。

Answer 2

项目WinRTXamlToolkit中有一个UWP工具箱的WrapPanel端口。

您可以从NuGet获取。

然后在Page添加此前缀：

xmlns:toolkit="using:WinRTXamlToolkit.Controls"

现在您可以像以前一样使用<toolkit:WrapPanel Orientation="Horizontal" ></toolkit:WrapPanel>了。

Answer 3

@ARH您需要创建一个继承面板类的自定义Panel类，并覆盖MeasureOverride和ArrangeOverride方法。请检查以下链接以供参考。 https://msdn.microsoft.com/en-us/library/windows/apps/mt228347.aspx http://www.visuallylocated.com/post/2015/02/20/Creating-a-WrapPanel-for-your-Windows-Runtime-apps.aspx

UWP中ListBox内的WrapPanel

3 个答案: