記錄一下:
App Inventor學習記錄206,從統一發票中獎號碼,拆解 xml資料記錄
這次範例的完成品如下。
照順序,從讀取資料,到一層一層的往下拆,一直到讀取到特別獎、特獎、頭獎、增開六獎。
畫面編排的部份如下。
要讀取網頁資料,最重要的就是要拉 Web網路元件進來。
除此之外,就是按鈕、標籤、清單顯示器、清單選擇器,詳情請見最下方提供的 aia檔。
這次要讀取的資料是這裡。
這個是統一發票對獎的顯示的網頁,網址如下。
https://invoice.etax.nat.gov.tw/
很明顯,這個上面這個網頁不是 xml的格式……,我們實際上要讀取的網頁是這一個。
同樣是財政部提供的統一發票的 rss訂閱頻道。
網址:https://www.etax.nat.gov.tw/etwmain/site/rss
我們在最下方的統一發票上,按滑鼠右鍵複製網址,就可以取得我們這次網址
https://invoice.etax.nat.gov.tw/invoice.xml
這個才是我們這次要拆解的資料網址。
全部的程式方塊如下。
第 1部份的程式方塊記錄如下。
我照每一層取得的資料來命名變數。
第 2部份的程式方塊記錄。
按鈕 1(原始資料)按鈕按下的時候。
call web 1.get呼叫網路元件去取得資料。要取得的網址資料,https://invoice.etax.nat.gov.tw/invoice.xml這一串,已經有先在填在畫面編排的網路元件的屬性框裡頭了。
set listpicker1.elements from string,把清單選擇器的元件,設定成是字串的組合。
因為我們用的是 elements from string,所以這裡的 description,link,title,就會被讀取成清單。
第 3部份的程式方塊記錄。
當網路元件取得資料之後,把變數_取得的原始資料,設成 get response content。然後顯示在 label 1.text上。程式的資料請大家下載 aia後實際執行測試一下。
第 4部份的程式方塊記錄。
由於我們的網頁是 xml的格式,所以這裡我們把變數_改 xml的資料設定成,用 call web 1.xml text decode方塊去轉換原始資料,轉換後的內容會經過排序,會變的比較好拆。
這裡也請大家實際下載 aia檔測試。接下來的部份都要這樣做,我就不再重覆了。
在往下一步拆解 xml資料之前,先來看一下這張網頁原始碼的截圖。
xml的格式就是這樣的一個型態。
以這個例子來說:
第 1層是 rss標籤
第 2層是 channel標籤
第 3層依序是 title標籤、link標籤、description標籤,item標籤,item標籤……很多 item標籤。
第 4層下的每一個 item標籤,也就是第 4層中,也有title標籤、link標籤、description標籤。
我們就是一路的往下拆,去找到我們要的資料。
第 5部份的程式方塊記錄。
我們先抓出第一層的資料。
這裡我們要用 look up in pairs的清單單塊,去抓出 rss標籤內的資料。
key參數,放的就是標籤 rss
pairs參數,放變數_改 xml後的資料。
not found參數,放 not found,指的是沒找到 rss的對應值的話,就回傳 not found這個文字。
第 6部份的程式方塊記錄。
接下來要抓第 2層的資料。
同樣用 look up in pairs的清單單塊,去抓出 channel標籤內的資料。
key參數,放的就是標籤 channel
pairs參數,放變數_rss標籤內的資料。
第 7部份的程式方塊記錄。
接下來要抓第 3層的資料。
同樣用 look up in pairs的清單單塊,去抓出 item標籤內的資料。
key參數,放的就是標籤 item。
pairs參數,放變數_channel標籤內的資料。
抓第 3層這個 item標籤內的資料的時候,有一點比較不同,因為第 3層中,有 2個以上的 item標籤。look up in pairs方塊就會自動的把資料建成一個清單。清單中的第 1個項次就是第 1個 item標籤下的資料。第 2個項次就是第 2個 item下的資料,以此類推。
也因為我們的變數_item標籤內的資料經過 look up in pairs後,已經變成清單,所以就可以用清單顯示器來顯示它。
第 8部份的程式方塊記錄。
按鈕按下的時候,call listpicker1.open,呼叫打開清單選擇器的程式。
這裡有把清單選擇器的可見性設定成隱藏,所以在畫面上不會看到清單選擇器的按鈕,但是還是可以呼叫清單選擇器打開的程式使用,這是比下拉式選擇 spinner好用的地方。
第 9部份的程式方塊記錄。
當清單選擇器選擇之後,我們就把 look up in pairs方塊中的 key參數,設定成 listpicker.selection清單選擇器的選中項。
我們在第 2部份的時候,有把清單選擇器的 elements元件,設定成 description,link,title這三個。這也是第 3層 item標籤下的三個標籤。
pairs參數這裡,用 selection item清單方塊,選擇清單_item標籤內的資料的第 1項。
假設,我們在清單選擇器中選擇了 description,這一項,這個按鈕按下之後,就會去抓第 3層裡,description標籤下的資料,顯示在 label 1.text這裡。
我盡力了……大家還是用 aia測試吧!
第 10部份的程式方塊記錄。
這部份就是把第 3層 item標籤下,所有 description標籤下的資料,加到清單中,並顯示在清單顯示器上。
第 11部份的程式方塊記錄。
跟第 10部份相同,只是改抓 link標籤的資料。
第 12部份的程式方塊記錄。
抓 title資料。
第 10、11、12部份,抓的都是第 3層 item標籤下的標籤資料。
第 13部份的程式方塊記錄。
這部份是要抓出特別獎的文字跟號碼。
用 starts at text找出 piece參數中特別獎這三個字,在清單_item下_全部的description標籤資料的清單中第 1項的資料內的第幾個字元。
然後,再用 segment方塊,去抓出特別獎的號碼。
第 14部份程式方塊記錄。
跟第 13部份一樣,只抓的東西改成頭獎。
第 15部份的程式方塊記錄。
跟 13、14相同,只是改抓特獎。
第 16部份程式方塊記錄。
跟 13、14、15部份相同,只是改抓增開六獎。
補充一下,增往六獎的獎項在這一期的獎項中沒有這個獎項。
我當初在寫的時候,沒有想到這個可能性,所以這裡還得再修改。
好的,全部的程式方塊都簡單說明過了,建議大家試著做一次,就會用的越來越熟。
但如果不想要重新拉程式方塊,或要需要範例 aia檔的話,請前往第 2頁哦!