iOS Swift 接力使力之玩 Open DataALAMOFIRE 、 COCOAPODS 、 JSON 、 OPEN DATA 之程式運用

學習主題• 社群成立目的簡介• 自我介紹與哈啦• 功力複習• 程式實作 (Swift)

• 問題與交流

個人簡介諸葛魔斌工作室：諸葛魔斌科技創作室學歷：高應大 --- 工管系 ( 非資訊科系 )E-Mail ： chugermobin@gmail.com官方網站： http://twcts.comFacebook ： https://goo.gl/volM7Z粉絲團 ： https://goo.gl/LI08wh社群 ： https://goo.gl/kjCsz1Line (id) ： http://goo.gl/ayGW7dLine@ ： http://goo.gl/pQHjWHLine Bot ： http://goo.gl/ljdxfVPlay 商店： http://goo.gl/CkVdsdApp Store ： http://apple.co/1Qehd64專長： VB(VBA) 、 C# 、 Java(Android) 、 Swift(iOS) 、 PHP 、 Python 、 Conrona 、 Golang 、 HTML/CSS 、 MySQL 、 FreeBSD 、 Server 架設、 CAD 、 ……

楊政斌

Open Data & JSON

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

Open Data ：指的是一種經過挑選與許可的資料，這些資料不受著作權、專利權，以及其他管理機制所限制，可以開放給社會公眾，任何人都可以自由出版使用，不論是要拿來出版或是做其他的運用都不加以限制。

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

XML：可延伸標記式語言（英語： Extensible Markup Language ，簡稱：XML），是一種標記式語言。標記指電腦所能理解的資訊符號，通過此種標記，電腦之間可以處理包含各種資訊的文章等。如何定義這些標記，既可以選擇國際通用的標記式語言，比如 HTML，也可以使用像 XML 這樣由相關人士自由決定的標記式語言，這就是語言的可延伸性。 XML 是從標準通用標記式語言（ SGML ）中簡化修改出來的。它主要用到的有可延伸標記式語言、可延伸樣式語言（ XSL ）、 XBRL和 XPath等。

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用JSON（ JavaScript Object Notation ）是一種由道格拉斯·克羅克福特構想設計、輕量級的資料交換語言，以文字為基礎，且易於讓人閱讀。儘管JSON 是 Javascript的一個子集，但 JSON 是獨立於語言的文字格式，並且採用了類似於 C語言家族的一些習慣。

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

JSON 用於描述資料結構，有以下形式存在。•物件（ object ）：一個物件以「 { 」開始，並以「 } 」結束。一個物件包含一系列非排序的名稱／值對，每個名稱／值對之間使用「 , 」分割。•名稱／值（ collection ）：名稱和值之間使用「：」隔開，一般的形式是：{name:value} 一個名稱是一個字串； 一個值可以是一個字串，一個數值，一個物件，一個布林值，一個有序列表，或者一個 null 值。•值的有序列表（ Array ）：一個或者多個值用「 , 」分割後，使用「 [ 」，「 ] 」括起來就形成了這樣的列表，形如：[collection, collection] •字串：以 "" 括起來的一串字元。•數值：一系列 0-9 的數字組合，可以為負數或者小數。還可以用「 e 」或者「 E 」表示為指數形式。•布林值：表示為 true 或者 false 。

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

{ "firstName": "John", "lastName": "Smith", "sex": "male", "age": 25, "address": { "streetAddress": "21 2nd Street", "city": "New York", "state": "NY", "postalCode": "10021" }, "phoneNumber": [ { "type": "home", "number": "212 555-1234" }, { "type": "fax", "number": "646 555-4567" } ] }

[ { "text":"This is the text","color":"dark_red","bold":"true","strikethough":"true","clickEvent": {"action":"open_url","value":"zh.wikipedia.org"}, "hoverEvent": {"action":"show_text","value": {"extra":"something"} } }, { "translate":"item.dirt.name","color":"blue","italic":"true" } ]

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

Alamofire 的安装與配置第一種方法（ 1 ）從 GitHub 上下載最新的代碼： https://github.com/Alamofire/Alamofire（ 2 ）將下載下來的程式包中 Alamofire.xcodeproj 拖曳至你的專案中（ 3 ） Show the Project navigator -> General -> Embedded Binaries ，把 iOS 版的 framework添加進來： Alamofire.framework（ 4 ）重啟專案第二種方法（ 1 ） brew install ruby（ 2 ） sudo gem install cocoapods（ 3 ） cd 到你的專案所在位置。輸入下列的命令： pod init（ 4 ） CocoaPods 會製作一個 Podfile ，這是 Cocoapods 每次在更新專案的 Pods （亦即不同的相依性套件）時都會檢視的檔案。之後，修改 Podfile 並加入 Alamofire (vim Podfile) ：（ 5 ）輸入下列指令以便安裝 Cocoapods ： pod install（ 6 ）關閉 Xcode（ 7 ）開啟 Finder 視窗，然後選取 Cocoapods 所產生的副檔名為 yourproject.xcworkspace 的檔案。（ 8 ）打開 ViewController.swift ，讓我們開始寫點程式吧。

第一種方法

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

將下載下來的程式包中 Alamofire.xcodeproj 拖曳至你的專案中

Show the Project navigator -> General -> Embedded Binaries ，把 iOS 版的 framework添加進來： Alamofire.framework

重啟專案

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

拖曳 TableView至佈局中

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

http 網站安全權限設定(https 不需設定 )

import UIKitimport Alamofire

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource { @IBOutlet weak var tableView: UITableView! //TableView 元件宣告 var jsonArray:NSMutableArray? //Json 陣列宣告 var newArray: Array<String> = [] // 陣列宣告 override func viewDidLoad() { super.viewDidLoad() // Do any additional setup after loading the view, typically from a nib. tableView.delegate = self // 表格代理指定 tableView.dataSource = self // 資料來源指定

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

// 使用 Alamofire 取得網站資料的 Rrquest Alamofire.request(.GET, "http://data.kaohsiung.gov.tw/Opendata/DownLoad.aspx?Type=2&CaseNo1=AV&CaseNo2=1&FileType=1&Lang=C&FolderType=") .responseJSON { response in print(response.request) // 原始的 URL 要求 print(response.response) // URL 回應 print(response.data) // 伺服器資料 print(response.result) // 回應的序列化結果 if let JSON = response.result.value { // 取得網頁回傳值放入 JSON self.jsonArray = JSON as? NSMutableArray // 存入 JSON 陣列 for item in self.jsonArray! { // 從陣列中逐一取值 if let name = item["Name"], myName = name as? String {// 取得某欄位值 print(myName) // 印出查看 self.newArray.append(myName) // 將值放入陣列變數 } } self.tableView.reloadData() // 表格重載 } } }

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() // Dispose of any resources that can be recreated. }

func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return self.newArray.count // 回傳陣列長度 } func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCellWithIdentifier("Cell", forIndexPath: indexPath) as UITableViewCell cell.textLabel?.text = self.newArray[indexPath.row] 顯示欄位值 ( 從陣列中 ) return cell }}

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

執行結果

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

第二種方法

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

啟動終端機，輸入 brew install ruby 安裝 Ruby接著輸入 sudo gem install cocoapods 安裝 cocoapodscd 到你的專案所在位置。輸入 pod init

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

CocoaPods 會製作一個 Podfile ，這是 Cocoapods 每次在更新專案的 Pods （亦即不同的相依性套件）時都會檢視的檔案。之後，修改 Podfile 並加入 Alamofire (vim Podfile)

輸入 pod install 以便安裝 Alamofire

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

開啟 Finder 視窗，然後選取 Cocoapods 所產生的副檔名為 yourproject.xcworkspace 的檔案。

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

拖曳 TableViewController至佈局中

新增 UITableViewController.swift和 TableViewCell.swift

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

建立連結

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

建立連結拖曳三個 Label

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

建立連結

宣告 Label 元件

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

http 網站安全權限設定(https 不需設定 )

import UIKit

class dataTableViewCell: UITableViewCell { @IBOutlet weak var lblName: UILabel! //Label 元件宣告 @IBOutlet weak var lblTel: UILabel! //Label 元件宣告 @IBOutlet weak var lblAddress: UILabel! //Label 元件宣告 override func awakeFromNib() { super.awakeFromNib() // Initialization code }

override func setSelected(selected: Bool, animated: Bool) { super.setSelected(selected, animated: animated)

// Configure the view for the selected state }}

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

import UIKitimport Alamofire

class dataTableViewController: UITableViewController { var jsonArray:NSMutableArray? //Json 陣列宣告 var nameArray: Array<String> = [] //Name 陣列變數宣告 var telArray: Array<String> = [] //Tel 陣列變數宣告 var addressArray: Array<String> = [] //Address 陣列變數宣告 override func viewDidLoad() { super.viewDidLoad()

// Uncomment the following line to preserve selection between presentations // self.clearsSelectionOnViewWillAppear = false

// Uncomment the following line to display an Edit button in the navigation bar for this view controller. // self.navigationItem.rightBarButtonItem = self.editButtonItem()

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

tableView.delegate = self // 表格代理指定 tableView.dataSource = self // 資料來源指定 Alamofire.request(.GET, "http://data.kaohsiung.gov.tw/Opendata/DownLoad.aspx?Type=2&CaseNo1=AV&CaseNo2=1&FileType=1&Lang=C&FolderType=") .responseJSON { response in print(response.request) // 原始的 URL 要求 print(response.response) // URL 回應 print(response.data) // 伺服器資料 print(response.result) // 回應的序列化結果 if let JSON = response.result.value { // 取得網頁回傳值放入 JSON self.jsonArray = JSON as? NSMutableArray // 存入 JSON 陣列

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

for item in self.jsonArray! { // 從陣列中逐一取值 if let name = item["Name"], myName = name as? String {// 取得 Name 欄位值 print(myName) // 印出查看 self.nameArray.append(myName) // 將值放入 Name 陣列變數 let tel = item["Tel"], myTel = tel as? String // 取得 Tel 欄位值 print(myTel) // 印出查看 self.telArray.append(myTel!) // 將值放入 Tel 陣列變數 let address = item["Add"], myAddress = address as? String print(myAddress) // 印出查看 self.addressArray.append(myAddress!) // 將值放入 Address 陣列變數 } } self.tableView.reloadData() // 表格重載 } } }

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int { // #warning Incomplete implementation, return the number of rows //return 0 return self.nameArray.count // 回傳陣列長度 } override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell { let cellIdentifer = "Cell" let cell = tableView.dequeueReusableCellWithIdentifier(cellIdentifer , forIndexPath: indexPath) as! dataTableViewCell cell.lblName?.text = self.nameArray[indexPath.row] // 顯示 Name 欄位值( 從 Name 陣列中 ) cell.lblTel?.text = self.telArray[indexPath.row] // 顯示 Tel 欄位值 ( 從 Tel 陣列中 ) cell.lblAddress?.text = self.addressArray[indexPath.row] // 顯示 Address 欄位值 ( 從 Address 陣列中 ) return cell }}

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

執行結果

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

結論： 1. 安裝 Ruby 、 cocoapods 、 Alamofire

2. 表格元件 /佈局使用3. Alamofire 網站資料取得

6. 學習階段，務必一字一字『抄』，切勿『複製貼上』7. 大膽嘗試，好奇無罪8. 不怕失敗，學習除錯9. 勇於分享

4. JSON 解析， Array/Object

5. JSON Array 取出資料存入一般陣列

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

Alamofire 、 Cocoapods 、 JSON 、 Open Data 之程式運用

第六、七次聚會學習課程Android App 接力使力之玩 Open Data iOS Swift  & FireBase 玩上雲端囉

學習不能中斷，卡關不要氣餒，讓我們的熱血繼續揮撒在程式的樂趣吧 !!帶著你的筆電，和我們一起享受 Coding Fun註：我們學習的是多系統，所以筆電最好是 Macbook哦 !日期： 8/24(星期三 ) 18:30～ 21:30 Android App 接力使力之玩 Open Data 8/31(星期三 ) 18:30～ 21:30 iOS Swift  & FireBase 玩上雲端囉地點：高雄市前鎮區一心二路 157 號 10樓之 4 （微盛科技）捷運三多商圈站 4 號出口，步行約 10 分鐘歡迎踴躍報名，也歡迎高手協助指導費用： 0 元 (珍惜學習資源 )