2014-01-08 74 views
2

我需要嵌套的JSON字符串反序列爲XAML反序列化嵌套的JSON C#和綁定到XAML的ListBox

的json

{ 
    "status":1, 
    "message":"sussess", 
    "Task_details":[ 
     { 
     "task_id":"237", 
     "created_f_id":"100001", 
     "task_description":"task description", 
     "due_date":"2014-01-08 04:59:30", 
     "alert":"2", 
     "status":"1", 
     "postedon":"2014-01-07 11:29:29", 
     "updatedon":"2014-01-07 11:29:29", 
     "comments":[ 
      { 
       "task_comment_id":"367", 
       "f_id":"100001588960161", 
       "comment":"sdfghhjfdsa", 
       "created_date":"2014-01-07 11:29:29", 
       "updated_date":"2014-01-07 11:29:29" 
      } 
     ], 
     "followers":[ 
      { 
       "f_id":"1000011" 
      }, 
      { 
       "f_id":"100004288170082" 
      }, 
      { 
       "f_id":"184685" 
      } 
     ] 
     }, 
     { 
     "task_id":"150", 
     "created_f_id":"184680", 
     "task_description":"testing", 
     "due_date":"2013-12-30 02:39:00", 
     "alert":"0", 
     "status":"1", 
     "postedon":"2013-12-30 09:10:22", 
     "updatedon":"2013-12-30 09:10:22", 
     "comments":[ 
      { 
       "task_comment_id":"205", 
       "f_id":"184385", 
       "comment":"comment test", 
       "created_date":"2013-12-30 09:10:22", 
       "updated_date":"2013-12-30 09:10:22" 
      } 
     ], 
     "followers":[ 
      { 
       "f_id":"1846806385" 
      }, 
      { 
       "f_id":"100565" 
      }, 
      { 
       "f_id":"100001561" 
      } 
     ] 
     } 
    ] 
} 

這個JSON數據,我需要在列表框, 和列表框中顯示用戶界面是這樣看圖片

enter image description here

進出口新的WP8開發,什麼是綁定THI的最佳途徑小號嵌套JSON數據列表框,在進出口面臨的問題如何綁定該跟蹤器列表圖片(下圖2,3成員,我需要顯示的圖像有比我需要顯示像3個圖像+ 4Member更多),以列表框提前

謝謝

回答

0

起初,你需要反序列化JSON字符串,你可以使用Json.NET - 如果你需要一個C#類模式,使用this。然後,您需要爲您的視圖(頁面)創建一個DataContext並在其中創建一個屬性以存儲反序列化的json對象。您的DataContext應該實現INotifyPropertyChanged接口。然後在XAML中創建ListBox並將其ItemsSource屬性綁定到DataContext中的屬性。下一步是創建一個ItemTemplate作爲DataTemplate樣式列表框的項目就像你一樣,然後看看他們喜歡。

爲了您的跟蹤器列表你只需要做的是相同的,但不是創建一個新DataContext只需使用您綁定的物品的屬性。

+0

是的,但我需要的代碼,因爲進出口新的發展的WP8到,面對綁定的概率關注列表圖片在Xaml – Srirama

0

如果你去http://json2csharp.com/並粘貼在那裏,你的JSON你會得到以下對象

public class Comment 
{ 
    public string task_comment_id { get; set; } 
    public string f_id { get; set; } 
    public string comment { get; set; } 
    public string created_date { get; set; } 
    public string updated_date { get; set; } 
} 

public class Follower 
{ 
    public string f_id { get; set; } 
} 

public class TaskDetail 
{ 
    public string task_id { get; set; } 
    public string created_f_id { get; set; } 
    public string task_description { get; set; } 
    public string due_date { get; set; } 
    public string alert { get; set; } 
    public string status { get; set; } 
    public string postedon { get; set; } 
    public string updatedon { get; set; } 
    public List<Comment> comments { get; set; } 
    public List<Follower> followers { get; set; } 
} 

public class RootObject 
{ 
    public int status { get; set; } 
    public string message { get; set; } 
    public List<TaskDetail> Task_details { get; set; } 
} 

所有這些類添加到您的項目。在後臺,你可以做這樣的事情

var jsonString = @"{ 
    "status":1, 
    "message":"sussess", 
    "Task_details":[ 
     { 
     "task_id":"237", 
     "created_f_id":"100001", 
     "task_description":"task description", 
     "due_date":"2014-01-08 04:59:30", 
     "alert":"2", 
     "status":"1", 
     "postedon":"2014-01-07 11:29:29", 
     "updatedon":"2014-01-07 11:29:29", 
     "comments":[ 
      { 
       "task_comment_id":"367", 
       "f_id":"100001588960161", 
       "comment":"sdfghhjfdsa", 
       "created_date":"2014-01-07 11:29:29", 
       "updated_date":"2014-01-07 11:29:29" 
      } 
     ], 
     "followers":[ 
      { 
       "f_id":"1000011" 
      }, 
      { 
       "f_id":"100004288170082" 
      }, 
      { 
       "f_id":"184685" 
      } 
     ] 
     }, 
     { 
     "task_id":"150", 
     "created_f_id":"184680", 
     "task_description":"testing", 
     "due_date":"2013-12-30 02:39:00", 
     "alert":"0", 
     "status":"1", 
     "postedon":"2013-12-30 09:10:22", 
     "updatedon":"2013-12-30 09:10:22", 
     "comments":[ 
      { 
       "task_comment_id":"205", 
       "f_id":"184385", 
       "comment":"comment test", 
       "created_date":"2013-12-30 09:10:22", 
       "updated_date":"2013-12-30 09:10:22" 
      } 
     ], 
     "followers":[ 
      { 
       "f_id":"1846806385" 
      }, 
      { 
       "f_id":"100565" 
      }, 
      { 
       "f_id":"100001561" 
      } 
     ] 
     } 
    ] 
}"; 

        var serializer = 
         new DataContractJsonSerializer(typeof (RootObject)); 
        var context = (RootObject) serializer.ReadObject(jsonString); 

myListBox.ItemSource = context.Task_details; 

這應該解決所有的問題。

+0

嗨,斯圖爾特感謝您的回覆,我知道這一點,我在我的代碼和IM做到這一點顯示說明數據和日期在列表框中,但我無法顯示追隨者,這意味着發佈此問題,如何綁定鮮花列表到此列表框 – Srirama

+0

追隨者應該在另一個列表框或其他頁面上。然後你可以做一些事情,如var myTaskDetailFollowers = context.Task_details.First(t => t.task_id == 3).Followers;然後myFollersListBox.ItemSource = myTaskDetailFollowers。 –

0

JOSN數據可以通過使用JSON.NetJSONORM進行管理。您可以通過jsonorm

得到它的NuGet XAML中獲取數據使用的數據模板後。這是一個例子。創建一個窗口並粘貼這個XAML。

<Window x:Class="DataTemplate.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="MainWindow" Height="350" Width="525"> 

<Window.Resources> 
    <DataTemplate x:Key="myTaskTemplate"> 
     <Grid Height="115" Width="456"> 
      <Grid.RowDefinitions> 
       <RowDefinition/> 
        <RowDefinition/> 
         <RowDefinition/> 
          <RowDefinition/> 
      </Grid.RowDefinitions> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition/> 
     </Grid.ColumnDefinitions> 

      <TextBlock Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="5" Foreground="#FF0079C3" FontSize="15" FontFamily="Segoe UI Semilight" IsHyphenationEnabled="True" 
      LineStackingStrategy="BlockLineHeight" TextAlignment="Left" TextWrapping="Wrap" Text="{Binding task_id}"/> 

      <TextBlock Grid.Row="1" Grid.Column="0" Foreground="#FF7F7F7F" FontSize="12" FontFamily="Segoe UI Semilight" 
      IsHyphenationEnabled="True" LineStackingStrategy="BlockLineHeight" Text="{Binding alert}" TextAlignment="Left"/> 

      <TextBlock Grid.Row="2" Grid.Column="0" Foreground="#FF7F7F7F" FontSize="12" FontFamily="Segoe UI Semilight" 
      IsHyphenationEnabled="True" LineStackingStrategy="BlockLineHeight" Text="{Binding task_description}" TextAlignment="Left"/> 

        <Path Grid.Row="3" Grid.Column="0" Data="F1M8,2C11.314,2 14,4.686 14,8 14,11.313 11.314,14 8,14 4.686,14 2,11.313 2,8 2,4.686 4.686,2 8,2z" 
       Fill="#FF85F088" HorizontalAlignment="Right" Grid.RowSpan="1" 
       Stretch="Uniform"/> 

        <Path Grid.Row="3" Grid.Column="0" Data="F1M8,2C11.314,2 14,4.686 14,8 14,11.313 11.314,14 8,14 4.686,14 2,11.313 2,8 2,4.686 4.686,2 8,2z" 
       Fill="#FF85F088" HorizontalAlignment="Right" Grid.RowSpan="1" 
       Stretch="Uniform" RenderTransformOrigin="-1.087,0.548" Margin="0,1,31,-1"/> 
        <Path Grid.Row="3" Grid.Column="0" Data="F1M8,2C11.314,2 14,4.686 14,8 14,11.313 11.314,14 8,14 4.686,14 2,11.313 2,8 2,4.686 4.686,2 8,2z" 
       Fill="#FF85F088" HorizontalAlignment="Right" Grid.RowSpan="1" 
       Stretch="Uniform" RenderTransformOrigin="-1.087,0.548" Margin="0,0,63,0"/> 

     </Grid> 


    </DataTemplate> 
</Window.Resources> 



    <ListBox Grid.Column="0" Grid.Row="1" 
     ItemsSource="{Binding Followers,IsAsync=True}" 
     ItemTemplate="{StaticResource myTaskTemplate}" ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
     HorizontalContentAlignment="Stretch" Margin="0,13,0,0"/> 
    <!----> 
     <!--"" --> 

按照DataContext的

using System.Text; 
using System.Threading.Tasks; 
using InSync.appseconnect.Helper; 
using ObjectDAL; 
using jsonorm; 


public class DataContext : ObservableObjectGeneric<DataContext> 
{ 

    private List<Task_details> _taskdetaillist; 

    public DataContext() 
    { 
     Followers = new Task_details().GetElementList("Task_details"); 
    } 


    public List<Task_details> Followers 
    { 
     get 
     { 
      return _taskdetaillist; 
     } 
     set 
     { 
      _taskdetaillist = value; 
      OnPropertyChanged("Followers"); 
     } 
    } 

} 

以下是ObjectDAL

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Threading.Tasks; 
using jsonorm; 

namespace ObjectDAL 
{ 
public class Comment 
{ 
    public string task_comment_id { get; set; } 
    public string f_id { get; set; } 
    public string comment { get; set; } 
    public string created_date { get; set; } 
    public string updated_date { get; set; } 
} 

public class Follower 
{ 
    public string f_id { get; set; } 
} 

public class Task_details : LocalStorage<Task_details> 
{ 
    public string task_id { get; set; } 
    public string created_f_id { get; set; } 
    public string task_description { get; set; } 
    public string due_date { get; set; } 
    public string alert { get; set; } 
    public string status { get; set; } 
    public string postedon { get; set; } 
    public string updatedon { get; set; } 
    public List<Comment> comments { get; set; } 
    public List<Follower> followers { get; set; } 
} 

public class TaskDetailList : LocalStorage<TaskDetailList> 
{ 
    public int status { get; set; } 
    public string message { get; set; } 
    public List<Task_details> Task_details { get; set; } 
} 

}