0

在 WP8 上，我想在这样的页面上显示一个列表：

在此处输入图像描述

我知道我可以使用 WP8.1 和 VariableSizedWrapGrid 控件轻松做到这一点。但我需要让它在 WP8.0 上工作。所以我尝试了 Kinnara 的工具包：https ://www.nuget.org/packages/WPtoolkit.Kinnara/ 其中包含一个 VariableSizedWrapGrid。

我可以做我想要的显示（见屏幕截图），但我不能在 LongListSelector 或 ListBox 中使用它作为 ItemPanelTemplate。

这是我尝试过的代码（它的灵感来自一种适用于 Windows 8 的方法，但不幸的是它似乎不适用于 WP8）以及这篇博文：http: //mtaulty.com/CommunityServer/blogs /mike_taultys_blog/archive/2012/09/14/windows-8-xaml-and-displaying-multiple-sized-items.aspx。

           <local:SpecificListBox x:Name="LB_Wings" ItemTemplate="{StaticResource IT_Wings}" >
                <local:SpecificListBox.ItemsPanel>
                    <ItemsPanelTemplate>
                        <toolkit:VariableSizedWrapGrid ItemWidth="100" ItemHeight="100" MaximumRowsOrColumns="4"></toolkit:VariableSizedWrapGrid>
                    </ItemsPanelTemplate>
                </local:SpecificListBox.ItemsPanel>
                <local:SpecificListBox.ItemContainerStyle>
                    <Style TargetType="ListBoxItem">
                    <Setter Property="toolkit:VariableSizedWrapGrid.RowSpan"   Value="{Binding ItemSize}" />
                        <Setter Property="toolkit:VariableSizedWrapGrid.ColumnSpan"  Value="{Binding ItemSize}" />
                    </Style>
                </local:SpecificListBox.ItemContainerStyle>
            </local:SpecificListBox>

数据模板：

  <DataTemplate x:Key="IT_Wings">          
            <Grid Margin="0,0,12,12" >
                <Image Source="{Binding BI_List}" Stretch="UniformToFill" </Image>
            </Grid>
    </DataTemplate>

SpecificListBox 只是一个继承 ListBox 并覆盖 PrepareContainerForItemOverride 方法的类：

class SpecificListBox : ListBox
{
    public SpecificListBox() { }
    protected override void PrepareContainerForItemOverride(System.Windows.DependencyObject element, object item)
    {    
        dynamic lateBoundItem = item;

        int sizeFactor = (int)lateBoundItem.ItemSize;

        element.SetValue(VariableSizedWrapGrid.ColumnSpanProperty, sizeFactor);
        element.SetValue(VariableSizedWrapGrid.RowSpanProperty, sizeFactor);  
        base.PrepareContainerForItemOverride(element, item);
    }
}

现在在后面的代码中，我只是用一个项目列表（具有 ItemSize 属性）填充 LB_Wings ：

LB_Wings.ItemsSource = listOfItems; //a list of items that have the ItemSize property.

不幸的是，我在初始化页面时收到错误：“无法创建类型的实例：SpecificListBox”。

我想我已经接近解决方案了。谁能帮我做这种显示（这在 WP8 上看起来很自然）但是使用 ListBox 和 ItemPanelTemplate 吗？

非常感谢

4

1 回答 1

2

您所要做的就是使 SpecificListBox 成为一个公共类。:)

public class SpecificListBox : ListBox

编辑

此外，您不需要 SpecificListBox 的 ItemContainerStyle 中的绑定。我用 Horizo​​ntal/VerticalContentAlignment = Stretch 更改了它们，因为我觉得这样看起来更好。如果没有这个，DataTemplate 中的控件不会占据该项目的所有位置。这是更改后的 xaml：

<local:SpecificListBox x:Name="LB_Wings" ItemTemplate="{StaticResource IT_Wings}" >
    <local:SpecificListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <toolkit:VariableSizedWrapGrid ItemWidth="100" ItemHeight="100" MaximumRowsOrColumns="4"></toolkit:VariableSizedWrapGrid>
        </ItemsPanelTemplate>
    </local:SpecificListBox.ItemsPanel>
    <local:SpecificListBox.ItemContainerStyle>
        <Style TargetType="ListBoxItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            <Setter Property="VerticalContentAlignment" Value="Stretch" />
        </Style>
    </local:SpecificListBox.ItemContainerStyle>
</local:SpecificListBox>
于 2014-05-22T10:42:25.947 回答