Firebase+Swift — Upload&Download Data

หลังจากที่ได้ทำการเชื่อมต่อ Firebase กับ Swift แล้วในส่วนนี้จะเป็นการ upload & download ข้อมูล โดยเริ่มจากสร้าง Tab Bar ViewController ส่วนแรกสร้างเป็นหน้า Add Item ซึ่งประกอบด้วย TextField และ Button

ส่วนที่สองเป็น List Of Item ซึ่งประกอบด้วย Table View และ Table View Cell (อย่าลืมทำการ delegate และ dataSource Table View)

จากนั้นเพิ่ม Label เข้าไปใน Prototype Cells และตั้ง Tag ของ Label นั้นเป็น 1 และ 2 ตามลำดับ

จากนั้นเข้าไปยัง Firebase แล้วแก้ไข “.read” : “true” และ “.write” : “true” เพื่อเป็นการอนุญาติให้ Database ของเราเป็นแบบ Public โดยสามารถเข้าใช้ได้โดยไม่ต้องทำการ Authentication เข้ามาก่อน

ViewController

ทำการ import Firebase , import FirebaseDatabase จากนั้น Outlet TextField และ Action Button จาก Main Storyboard

@IBAction func add(_ sender: Any) {
if price.text == "" || name.text == "" {
print("can't add")
}
else{
post()
price.text = ""
name.text = ""
}
}
func post() {
let Name_ = name.text
let Price_ = price.text
let post : [String: AnyObject] = ["Name" : Name_ as AnyObject,
"Price" : Price_ as AnyObject]
let databaseRef = FIRDatabase.database().reference()
databaseRef.child("Posts").childByAutoId().setValue(post)
}

สร้างฟังก์ชัน Post ​ขึ้นมาซึ่งเป็นฟังก์ชันที่ใช้ในการ Upload Data ขั้นไปยัง Firebase ซึ่ง Data ที่จะ Upload ขึ้นไปนั้นมีสองอย่างคือ Name และ Price และถูกเก็บไว้ใน Child ที่ชื่อว่า Posts และเมื่อ Upload เสร็จแล้วเราจะได้ Database ดังรูปข้างล่าง

สร้าง SecondViewController จากนั้นทำการ เพิ่ม UITableViewDelegate , UITableViewDataSource จากนั้นสร้าง struct postStruct ขึ้นมาเพื่อเก็บ Data ที่ได้จาก Firebase ไว้ก่อนที่จะนำไปแสดงผล

code ส่วน viewdidload()

posts.removeAll()
let databaseRef = FIRDatabase.database().reference()
databaseRef.child("Posts").queryOrderedByKey().observe(.childAdded, with:{
snaphot in
let snapshotValue = snaphot.value as! NSDictionary
let name = snapshotValue["Name"] as? String
let price = snapshotValue["Price"] as? String
self.posts.insert(postStruct(name: name, price: price), at: 0)
self.views.reloadData()
})

code ส่วน structure

struct postStruct{
let name : String!
let price : String!
}

โค้ดส่วนการ Download Data จาก Firebase ไปเก็บไว้ใน Struct

สร้างฟังก์ชันสำหรับ TableView มาสองฟังก์ชันคือ cellForRow และ NumberOfRows เพื่อใช้ในการแสดงผล Data ที่เราได้มาจาก Firebase ในรูปแบบตาราง

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
var cell = tableView.dequeueReusableCell(withIdentifier: "cell")
if cell == nil {
cell = UITableViewCell(style: .default, reuseIdentifier: "cell")
cell?.textLabel?.text = posts[indexPath.row].name
cell?.detailTextLabel?.text = posts[indexPath.row].price
return cell!
} else {
let label1 = cell?.viewWithTag(1) as? UILabel
label1?.text = posts[indexPath.row].name
let label2 = cell?.viewWithTag(2) as? UILabel
label2?.text = posts[indexPath.row].price
return cell!
}
}

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return posts.count
}

โค้ดส่วนการนำค่าที่เก็บไว้ใน Struct มาแสดงผลใน Table

เมื่อเสร็จสิ้นแล้ว จะได้หน้าตาของแอปพลิเคชันออกมาเป็นดังนี้