windows-phone-7 - 好友图片列表

Question

我正在开发一个 Windows Phone 7 应用程序。我对此很陌生。

我在这里看到了带有一些图片的全景控件（在全景项目示例中）。

我想这样做，但我不知道怎么做。

如何使用列表框和 DataItemTemplate 做到这一点？或者有没有其他方法可以做到这一点？

我将拥有一个带有 URL 列表的 XML。我将添加与我在 XML 中的 url 一样多的图像。

但我的问题是如何填充那种矩阵？

如果你有什么不明白的，请告诉我。

Answer 1

该特定示例是全景控件的手工副本。

理解它的最简单方法可能是下载并查看 - 请参阅http://phone.codeplex.com/SourceControl/changeset/view/55041#中“示例”PanoramaItem 中特定图片部分的源代码820130 - 您可以看到它是使用带有其样式的 ListBox 完成的PanoramaImageListBox：

列表框：

 <ListBox x:Name="listBox2"
                         HorizontalAlignment="Left"
                         Width="600"
                         ItemsSource="{Binding Source={StaticResource PicturesLoader}, Path=Pictures}"
                         Style="{StaticResource PanoramaImageListBox}"
                         SelectionChanged="listBox_SelectionChanged"/>

样式：

<Style x:Key="PanoramaImageListBox" TargetType="ListBox">
            <Setter Property="ItemsPanel">
                <Setter.Value>
                    <ItemsPanelTemplate>
                        <my:MultiColumnsPanel Columns="3"
                            HorizontalAlignment="Left"
                            VerticalAlignment="Top"/>
                    </ItemsPanelTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="ItemContainerStyle">
                <Setter.Value>
                    <Style TargetType="ListBoxItem">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="ListBoxItem">
                                    <Image Width="185" Margin="0,0,12,12"
                                           Source="{Binding Bitmap}"/>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </Setter.Value>
            </Setter>
        </Style>

您可以看到这种样式使用了他们自己的类 - MultiColumnPanel - 请参阅http://phone.codeplex.com/SourceControl/changeset/view/55041#820131处的代码