[開發] OpenDate之Json解析及讀取教學

[Severine (賽非茵)]

又來洗文章了~~~  (／‵Д′)／~ ╧╧

沒有啦 看著H大的Json教學讓我也想來寫一篇「懶人包」,原本想附在上篇文章的下面,
又怕混在一起會讓人不好搜尋就乾脆動筆寫一篇小教學,也算是自己的筆記

工具 : H大的JSON文章內有講到物件與陣列的關係,但是看到密密麻麻的JSON檔,
       誰還看得下去呀!  還好前陣子我同學友情推薦了兩個實用的網站可以幫助我來
       分析和宣告.

       分析: http://www.jsoneditoronline.org/
             只要把又臭又長的JSON字串丟進去就會幫你乖乖排好,瞬間看懂哪些是陣列
             、哪些是字串,再也不用煩惱囉!

             ex:  {"help":"","success": true, "result":["resource_id","hello"]}

             網站分析 object{3} <-三物件 
                         ├ help : ""
                         ├ success : true
                         └ result [2] <- 兩陣列
                              ├ resource_id
                              └ hello

       宣告: http://json2csharp.com/
             只要把url或是你的JSON string丟入,就會幫你立馬宣告所需的 class

             ex: 丟入 http://ppt.cc/SVOZ 會產生

             public class RootObject
             {
               public string SiteId { get; set; }
               public string SiteName { get; set; }
               public string County { get; set; }
               ....
             }

程式碼 : 有了工具以後,該怎麼讀取JSON裡面的資料呢? 取得物件的部分有點麻煩,
         我最怕麻煩,所以我就不示範了..... ﹨(╯▽╰)∕

         喂~~這樣好像不太對?

         只好勉強簡單寫個取得陣列資料的方法~也就是剛剛做的東西剪下貼上的..
         大學生都會這一招 (被毆


         目標:我想取得氣象局的雨量資料,但是為了示(ㄊㄡ)範(ㄌㄢˇ)所以精簡到
              只取得監測站的名稱資料.

              http://ppt.cc/Uo9T

         UI:  1.先拉個button到XAML
              2.再拉個TextBlock,命名 x:name=output
              3.在button點兩下,帶入程式碼部分

         Code:


         public class RootObject //從分析網站取得
         {
            public string SiteId { get; set; }
            public string SiteName { get; set; }
            public string County { get; set; }
         }

         private async void Start_Click(object sender, RoutedEventArgs e)
         {
            string jsonStr = "http://ppt.cc/Uo9T" //可帶入你要的url

            //取得JSON字串
            HttpClient client = new HttpClient();
            HttpResponseMessage response = await client.GetAsync(jsonStr);
            response.EnsureSuccessStatusCode();
            string responseUri = await response.Content.ReadAsStringAsync();

            //取得的JSON是陣列就可以直接讀入JArray
            JArray dataArray = JArray.Parse(responseUri);

            //宣告暫存字串
            string temp = "";

            //巡覽dataArray內的所有物件
            foreach (JObject obj_results in dataArray)
            {
                //取得SiteName
                temp += obj_results["SiteName"].ToString();
            }

            //輸出到XAML
            output.Text = temp;

         }

         //這樣就完成囉,有夠懶惰的一點都不想多打字!

--
教學結束惹,有沒有一種有看沒有懂的感覺呀?  ╮(﹀_﹀")╭

看不懂沒關係~可以私下問我
我會告訴你MSDN的論壇網址 http://social.msdn.microsoft.com
這樣你就可以問其他大大,不用來問我了!

--
參考資料

      1 m 6 2/06 hoyunxian    □ [開發] 在WP8上讀取XML/JSON的方法(1)
      2 m   2/06 hoyunxian    □ [開發] 在WP8上讀取XML/JSON的方法(2)
      3 m 8 2/06 hoyunxian    □ [開發] 在WP8上讀取XML/JSON的方法(3)
●    4 m   4/02 hoyunxian    □ [開發] 在WP8上讀取XML/JSON的方法(補充)

      還有很多網頁,有興趣深入研究的人請自己找唷~~

參考資料2

      快速入門：從服務讀取資料 (使用 C#/VB/C++ 和 XAML 的 Windows 市集應用程式)
      http://msdn.microsoft.com/zh-tw/library/windows/apps/xaml/dn439314.aspx
      簡介:您可以使用 Visual Studio 的「中樞」、「格線」或「分割」專案範本更有
      效地建立應用程式，以顯示來自任何服務、資料庫或其他資料來源的資料。這些範
      本共用的資料模型可將資訊組織成項目和群組；如果您依照該模型來組織資料，就
      能夠更輕鬆地將功能新增至您的應用程式。


      如何自訂 Visual Studio 範本資料
      (使用 C#/VB/C++ 和 XAML 的 Windows 執行階段應用程式)
      http://msdn.microsoft.com/zh-tw/library/windows/apps/xaml/jj655409.aspx
      簡介:[中樞]、[格線]、[分割] 及 [樞紐] 專案的頁面中已經顯示資料。這是因為
      這些範本包含顯示這些資料的檔案、程式碼及 XAML 標記。 修改這些檔案來顯示您
      的資料，會比使用空白頁面從頭開始新增來得容易。

--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 59.120.142.132
※ 文章網址: http://www.ptt.cc/bbs/WindowsPhone/M.1401441075.A.D65.html
※ 編輯: Severine (59.120.142.132), 05/30/2014 17:20:47
推 superwave:哦哦哦哦這生class的工具超好用的啊
→ superwave:每次手動打這些都覺得好浪費時間..
有了這些工具就方便許多囉~~

推 felaray:我以前也耍蠢用手刻..累死了..還很容易搞錯..
 UCCU ~(￣▽￣)

推 hungys:我都從VS2013直接貼耶... 還以為是內建的，還是因為我有裝W
→ hungys:ebEssentials plugin!?
→ hungys:Edit>Paste Special>Paste JSON As Classes
還有這招呀~?
※ 編輯: Severine (59.120.142.132), 05/30/2014 19:01:57
推 hungys:我用很久了，只是忘記是不是內建的xD 不然就是裝WebEssenti
→ hungys:als 超方便~
請問有沒有 universal app 的教學呀? 看的一個頭兩個大~~
還在搞懂WP8/WIN8兩個專案 和 Shared 專案之間的關聯~~頭痛!
※ 編輯: Severine (59.120.142.132), 05/30/2014 19:37:17
推 qoo456alex:Shared project 可以想成是一般的 程式庫專案
→ qoo456alex:只是裡面多了可以增加view的功能，我通常只寫class
推 qoo456alex:這樣就可以達到MVVM的美妙之處了
推 hungys:推MVVM+1, 雖然我應該不是100%的MVVM...XD
推 songla1204:推
→ Severine:美妙..嗎? 還沒領略到那種意境 現在是被荼毒中>.<