2016-05-18 5 views
1

APIを使用してJsonデータを取得しています。コレクションから取得したすべてのカードのすべての画像を表示したいのですが、画像URLはcard.imageUrlから取得されますが、画像ソースは通常の文字列を使用しません。私は、foreachループの内側card.imageUrl = String.Formatの(card.imageUrl)を書き込もうとしましたが、それはAPIから画像の一覧を取得し、リスト内のすべての画像を表示する

XAMLコードは動作しませんでした:MagicCardsList

 public static async Task PopulateMagicCardsAsync(ObservableCollection<Card> magicCards) 
    { 
     var cardDataWrapper = await GetCardDataWrapperAsync(); 

     var cards = cardDataWrapper.cards; 

     foreach (var card in cards) 
     { 
      if (card.Multiverseid.ToString() != null && card.Multiverseid.ToString() != "") 
      { 
       magicCards.Add(card); 
      } 
     } 
    } 
に追加

 <ListView Name="MasterListView" ItemsSource="{x:Bind MagicCards}"> 
     <ListView.ItemTemplate> 
      <DataTemplate x:DataType="data:Card"> 
       <StackPanel Orientation="Horizontal"> 
        <Image Source="{x:Bind ImageUrl}"/> 
        <TextBlock Margin="20,0,0,0" Text="{x:Bind Name}" Foreground="{x:Bind Colors[0]}" /> 
       </StackPanel> 
      </DataTemplate> 
     </ListView.ItemTemplate> 
    </ListView> 

メインページ

public sealed partial class MainPage : Page 
{ 
    public ObservableCollection<Card> MagicCards { get; set; } 
    public MainPage() 
    { 
     this.InitializeComponent(); 

     MagicCards = new ObservableCollection<Card>();  
    } 
    private async void Page_Loaded(object sender, RoutedEventArgs e) 
    { 
     MyProgressRing.IsActive = true; 
     MyProgressRing.Visibility = Visibility.Visible; 

     await MTGFacade.PopulateMagicCardsAsync(MagicCards); 

     MyProgressRing.IsActive = false; 
     MyProgressRing.Visibility = Visibility.Collapsed; 
    } 
} 

カードクラス

public class Card 
{ 
    [DataMember(Name = "imageUrl")] 
    public string ImageUrl { get; set; } 

EDIT:

http://i.imgur.com/yqQHdTp.png
+0

<Image Source="{x:Bind ImageUrl}"/> 

を変更するには、あなたの質問では、APIからの実際の応答を追加してくださいことはできますか? – vohrahul

+0

URLの例はありますか? –

+0

また、「card.imageUrlから画像URLを取得できますが、画像ソースは通常の文字列を使用しません」という意味を説明してください。あなたの期待される出力は何ですか?また、あなたが見る出力は何ですか?開発者のコ​​ンソールにある画像要素を調べ、有効な画像URLがあるかどうか確認しましたか? – vohrahul

答えて

1

x:Bindは、ソースの正確一致タイプを必要とし、プロパティをターゲットに、内蔵の自動型変換からBinding利点(ここでstringからImageSourceまで)間。

ので

<Image Source="{Binding ImageUrl}"/> 
関連する問題