Friends pictures list

I'm developing a Windows Phone 7 app. I'm very new on it.

I've seen here a panorama control with some pictures (at panorama item Samples).

I want to do that but I don't know how.

How can I do that with a listbox and a DataItemTemplate? Or is there any other way to do that?

I will have and XML with a list of URLs. I will add as many images as urls I will have in XML.

But my problem is how c开发者_Go百科an I fill that kind of matrix?

If you don't understand anything, please tell me.

That particular sample is a handcrafted copy of the panorama control.

The easiest way to understand it is probably to download it and take a look - see the source code for that particular pictures section in the "samples" PanoramaItem in http://phone.codeplex.com/SourceControl/changeset/view/55041#820130 - you can see it is done using a ListBox sytled with their style PanoramaImageListBox:

The List Box:

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

The Style:

<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>

You can see this style uses their own class - MultiColumnPanel - see code at http://phone.codeplex.com/SourceControl/changeset/view/55041#820131