WP7 Создание пользовательского интерфейса (.xaml) из списка (.cs)

Question

Я разработчик .Net и новичок в разработке WP7. Я пытаюсь создать свой интерфейс в зависимости от количества элементов в списке. Мои товары - это агентства с именем, адресом, 2 телефонными номерами и одним изображением.

В моем файле .cs:

Agence agence1 = new Agence();
agence1.Name = "Name1";
agence1.Adress = " Adress1";
agence1.Telephone = "Tel1";
agence1.Telephone2 = "Tel01";
agence1.Region = "Region1";   
agence1.Source=newBitmapImage(newUri(@"/App/Images/call.jpg",UriKind.Relative));

listAgences.Add(agence1);

В моем файле xaml для каждого агента:

                   <Grid x:Name="Agence1" Background="Transparent">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="50"/>
                        <RowDefinition Height="50"/>
                        <RowDefinition Height="50"/>
                        <RowDefinition Height="50"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="150"/>
                        <ColumnDefinition Width="280"/>
                        <ColumnDefinition Width="50"/>
                    </Grid.ColumnDefinitions>

                    <StackPanel Grid.Row="0" Grid.Column="0">
                        <TextBlock Height="30"  HorizontalAlignment="Center" Name="textBlock1" Text="{Binding listAgences[0].Nom}" VerticalAlignment="Top" FontSize="18" Foreground="Black" FontWeight="Bold" />
                    </StackPanel>

                    <StackPanel Grid.Row="1" Grid.Column="1">
                        <TextBlock Height="30"  HorizontalAlignment="Center" Name="textBlock5" Text="..." VerticalAlignment="Top" FontSize="15" Foreground="Black" />
                    </StackPanel>

                    <StackPanel Grid.Row="1" Grid.Column="0">
                        <TextBlock Height="30"  HorizontalAlignment="Center" Name="textBlock2" Text="Adresse" VerticalAlignment="Top" FontSize="18" Foreground="Black"  />
                    </StackPanel>

                    <StackPanel Grid.Row="2" Grid.Column="0">
                        <TextBlock Height="30"  HorizontalAlignment="Center" Name="textBlock3" Text="Téléphone :" VerticalAlignment="Top" FontSize="18" Foreground="Black"  />
                    </StackPanel>

                    <StackPanel Grid.Row="2" Grid.Column="1">
                        <TextBlock Height="50"  HorizontalAlignment="Center" Name="textBlock6" Text="..." VerticalAlignment="Bottom" FontSize="15" Foreground="Black" Width="279" Padding="10,15,0,0"/>
                    </StackPanel>

                    <StackPanel Grid.Row="2" Grid.Column="2" Height="50" VerticalAlignment="Bottom" Margin="0">
                        <Image Height="30"  Name="image1"  HorizontalAlignment="Center"  Source="/App;component/Images/call.png" Margin="0,10,0,0"  />
                    </StackPanel>

                    <StackPanel Grid.Row="4" Grid.Column="0">
                        <TextBlock Height="30"  HorizontalAlignment="Center" Name="textBlock4" Text="Telephone 2 :" VerticalAlignment="Top" FontSize="18" Foreground="Black"  />
                    </StackPanel>

                    <StackPanel Grid.Row="3" Grid.Column="1">
                        <TextBlock Height="50"  HorizontalAlignment="Center" Name="textBlock7" Text="..." VerticalAlignment="Bottom" FontSize="15" Foreground="Black" Width="279" Padding="10,15,0,0"/>
                    </StackPanel>                       
                </Grid>

В данный момент в мой список добавлены 4 закодированных агента. Так что в моем файле xaml у меня есть четыре раза код выше в xaml. Вскоре я воспользуюсь веб-сервисом, чтобы получить агентства. То, что я хочу, это иметь только один раз код выше и сделать что-то вроде этого:

В шаблоне MVC я бы сделал для меню нечто подобное на моей странице aspx:

   <ul>
   <% foreach (var agence in listAgences) { %> <li><%: agence.Name %></li> <% } %>
    ... building the UI
   </ul>

Я не хочу, чтобы меню в моем приложении для телефона было просто быстрым примером. Я не знаю, как это сделать в WPF / xaml. Могу ли я сделать это в файле xaml или мне нужно встроить интерфейс в файл .cs, например: this.add (Grid); this.Add (StackPanel); ...

Спасибо за вашу помощь.

Answer 1

Во-первых, WP7 использует Silverlight, а не WPF.

В вашем XAML вы помещаете все свои текстовые блоки в отдельные стековые панели. Почему?
Кроме того, выделенные номера строк не соответствуют определениям строк, и вы устанавливаете высоту для элементов без необходимости.

Когда вы говорите "в шаблоне MVC" ... вы показываете пример с использованием HTML. Я предполагаю, что вы имеете в виду, когда вы используете ASP.NET MVC (на основе синтаксиса и встроенного кода). Ваш пример не имеет ничего общего с фактическим шаблоном MVC.

Чтобы попытаться решить вашу проблему, которая сводится к отображению списка объектов, взгляните на то, что создается по умолчанию при создании нового «приложения с привязкой к данным». Вместо использования ItemViewModel вы должны использовать Agence. Затем посмотрите на DataTemplate в MainPage.xaml, чтобы увидеть, как вы можете настроить отображение содержимого вашего объекта.