前回はラズパイに接続したセンサBME280から温度等のデータをFirebaseのRealtimeDatabaseにアップするところまで実施しました。
今回はアップした温度と時間を表示するiPhoneアプリを作りました。
データベースの新しいデータがアップされたら自動的に更新するようにしています。
以下がアプリの画面です。
１.FirebaseとXcodeの連携
Firebaseのプロジェクトからアプリを追加でiOSを選択
XcodeのバンドルIDをFirebaseのiOSバンドルIDにコピーする
GoogleService-Info.plistをダウンロードし、Xcodeプロジェクトに追加する。
Firebase側の設定は以上で完了です。
次にXcodeでFirebaseを扱えるよう設定します。まずはFirebaseインストールの前準備としてCocoa Podsをインストールします。
ターミナルを開き、Xcodeのプロジェクトのあるパスにcdして、以下コマンドを実行します。
pod init
以下のようにPodfileが出来上がるので、ファイルに下記を追記します。
pod install
私の環境では先に以下のコマンドでgitのバッファリング容量を16Mに設定する必要がありました。
git config --global http.postBuffer 16M
FirebaseライブラリがXcodeプロジェクトにインストールされたのでコーディングに移ります。
2. データベースからアプリに反映する
AppDelegate.swiftに
・import Firebase
・FirebaseApp.configure()
を追記します。
次にViewController.swiftを以下のように記述します。
<ソースコード>
import UIKit
import Firebase
class ViewController: UIViewController {
@IBOutlet weak var tempatureLabel: UILabel!
@IBOutlet weak var timeLabel: UILabel!
override func viewDidLoad() {
super.viewDidLoad()
fetchData()
}
func fetchData(){
let fetchDataRef = Database.database().reference()
fetchDataRef.child("environment").observe(.childAdded){(snapShot) in
let snapShotData = snapShot.value as AnyObject
let tempature = snapShotData.value(forKeyPath: "bme280.tempature")
let record_time = snapShotData.value(forKeyPath: "bme280.record_time")
self.tempatureLabel.text = String(format: "%.2f", tempature as! Double) + " ℃"
self.timeLabel.text = record_time as? String
}
}
}
ポイントとなるFirebaseからデータを取得している箇所は以下となります。
fetchDataRef.child("environment").observe(.childAdded){(snapShot) in
let snapShotData = snapShot.value as AnyObject
.childAddedはデータベースにアイテムが追加されたらsnapShotに追加されたアイテムを入れて、in以下の処理が動作します。いわゆるクロージャです。
RealtimeDatabaseは個々のアイテムを参照することはできず、上記のようなイベント発生によってデータを自動的に取り出す機能に役立つのでよくチャットアプリに使われているようです。
今回は、センサデータがデータベースに追加されたらアプリに表示としています。
snapShotの中身をprintしてみますと確かに辞書型のセンサデータが取得できている事が分かります。
あとは辞書型のデータから必要なデータを抜きしてラベルに放り込みます。
データベースは以下のような構成となっています。
なので例えばtempatureを取り出す場合には
snapShotData.value(forKeyPath: "bme280.tempature")
と風にすればOKです。
これでbuildしてiPhoneにアプリ作成すれば完成です。
以上。