Как создать приложение метро с динамическим управлением изображениями

Question

Я пытаюсь получить информацию из документа XML, который показывает всю информацию о моих друзьях на xbox. Теперь я хочу отобразить аватар в элементе управления изображением, который создается динамически, но я не уверен, каким образом я мог бы отобразить это изображение в сетке моего приложения.

До сих пор я пытался создать динамический элемент управления с помощью тега игрока и добавить в него свой собственный текст. Это код до сих пор:

        string gamertag, avatarURL;
        foreach (XElement elm in doc.Descendants().Elements("Friends"))
        {

            gamertag = elm.Element("Gamertag").Value;
            avatarURL = elm.Element("AvatarLarge").Value;

            Image friendimage = new Image();
            friendimage.Name = gamertag.ToString() + "ImageControl";

            BitmapImage AccountPicbitmap = new BitmapImage();
            AccountPicbitmap.UriSource = new Uri(avatarURL);

            friendimage.Source = AccountPicbitmap;
            //Some code to display this control with the avatar image using the URL retrieved, I want to play these tiles side by side

        }

Любые предложения о том, как я мог это сделать? Заранее спасибо!

ОБНОВЛЕНИЕ: Я добавил этот элемент управления в свой XAML, но теперь у меня появляются странные исключения: System.Runtime.Remoting.RemotingException [7756] Процесс конструктора неожиданно завершился!

<ItemsControl HorizontalAlignment="Left" Height="100" VerticalAlignment="Top" Width="1249" Margin="55,484,0,0" ItemsSource="{Binding}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Image Source="{Binding avatarURL}" Name="{Binding GamerTag}"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>

</ItemsControl>

Теперь, когда я отлаживаю приложение, оно заходит в бесконечный цикл и также выдает исключение при инициализации.

public MainPage()
    {
        this.InitializeComponent();
    }

Answer 1

Это было бы проще сделать в xaml примерно так:

Сначала установите DataContext вашей страницы для вашей модели представления. Затем создайте свойство, которое представляет вашу коллекцию друзей как коллекцию объектов, которые GamerTag а также avatarURL, Используйте следующий xaml для отображения этой коллекции:

<ItemsControl ItemsSource="{Binding}">
    <ItemsControl.DataTemplate>
        <DataTemplate>
            <Image Source="{Binding avatarURL}" Name="{Binding GamerTag}"/>
        </DataTempate>
    </ItemsControlDataTempalte>
</ItemsControl>

Код должен быть примерно таким:

public class yourCodeThatGetsYourFriends : INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;

    public void GetFriends()
    {
        //get friends and put into friend objects defined below
        //create an ObservableCollection of them and assign it to the Friends (make sure its 'Friends' not 'friends") property
    }
    public ObservableCollection<friend> friends;
    public ObservableCollection<friend> Friends;
    {
        get
        {
            return friends;
        }
        set
        {
            friends = value;
            NotifyPropertyChanged("Friends");
        }
    }        

    private void NotifyPropertyChanged([CallerMemberName] String propertyName = "")
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }

}

public class friend : INotifyPropertyChanged
{        
    public event PropertyChangedEventHandler PropertyChanged;

    string url;
    public string avatarURL
    {
        get
        {
            return url;
        }
        set
        {
            url = value;
            NotifyPropertyChanaged("avatarURL");
        }
    }
    string tag;
    public string GamerTag
    {
        get
        {
            return tag;
        }
        set
        {
            tag= value;
            NotifyPropertyChanaged("GamerTag");
        }
    }

    private void NotifyPropertyChanged([CallerMemberName] String propertyName = "")
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }

}