こんにちは、初めまして！、理学部B1 MJと申します！
みなさん、収支管理ってどうしてますか？
僕はスプレッドシートに書いて管理してます！
スプシってどんな端末からも操作できて、GASを用いた拡張性もしっかりしてて使いやすいですよね！
ただやっぱりアプリ開いて確認…ってのもめんどくさいですよね
と、いうことで今回は「手軽に残高を確認する！」ことを目標に開発をしました！
手軽に確認、といえばやっぱスマートウォッチですよね！
僕も 初代Pixel Watch LTEモデル を2年ほど使ってます。
そんなこんなで今回はWearOSでスプシのデータを確認する開発を今回は行いました！
実際の完成品
こちらスマートウォッチのホーム画面の画像です。
赤で囲ったものが今回開発したものです。
左の画像が現金の量、右の画像がPayPay銀行の残高を示しています。
また囲むようにあるメーター上の表示で、1か月の間の、財布に入れた、PayPay銀行に入金されたお金のうちどれだけが残っているかがわかるようになっています。
さらにこの丸をタップすることでもう一方の表示に変えることができるようになっています
開発に使ったもの
- Google Apps Script
- MacroDroid
- Webhook
Google Apps Script (GAS)
Googleのクラウド上で動くプログラミング言語です。
基本的な感じはjavascriptと似ています。
Googleのサーバー上で動くので、トリガーさえ設定してあげれば勝手に実行してくれます。
Googleのサービスとのつながりが強く、Google Form, Spreadsheet, Slide等のために独自のクラスが用意されています。今回はSpreadSheetと繋げて開発しました！
MacroDroid
ノーコード形式でマクロを作成、実行することができるAndroidアプリです。
トリガーとアクションを追加して作成します。
豊富なトリガーとアクションが用意されていますが、今回はトリガーにWebhookを用いて、アクションでWearOSに表示する機能を用いています。
またWearOS用のアプリも用意され、あくまでスマホアプリの拡張用ですが、BluetoothでつながれたスマホからWearOSを一部操作することができます。
Webhook
URLを公開し、そこにHTTPリクエストを送信することで、それがトリガーとなり実行される仕組みです。後述しますがMacroDroidではWebhook URLにクエリパラメータを追加することでMacrodroidの変数に値を代入することができます。
フローとコード
こんな感じで動いています。
function PushDBValue() {
// 1.スプレッドシートからデータの取得
const ss = SpreadsheetApp.getActiveSpreadsheet()
const DB = ss.getSheetByName('総合DB')
let DBValues = DB.getDataRange().getValues()
const rows = DBValues.length
// 2. GASからMacrodroidへデータの送信
let url = PropertiesService.getScriptProperties().getProperty("getDB");
for (var i=0; i<=rows-1; i++) {
name = DBValues[i][0]
value = DBValues[i][1]
if (i==0) {
url = url + `?BPDB(${name})=${value}`
}
else {
url = url + `&BPDB(${name})=${value}`
}
}
UrlFetchApp.fetch(url);
}1. スプシのデータをGASで取得
GASが「スプシのデータが変更させる」ことをトリガーに実行され、スプシからデータを取得します。スプシのシート ’ 総合DB ’ に下の感じでまとめてあるので取得します。
2. GASからAndroidのMacrodroidにデータを送信
URL直書きは怖いのでスクリプトプロパティに保存しました。
Webhookに送るhttpリクエストを作成します。
URLにhttps://trigger.macrodroid.com/…/identidifier?変数名1=値1&変数名2=値2&…って感じでMacrodroidの変数に代入することができます。
今回は ’BPDP’ という名前の連想配列に代入したいので, 連想配列名(キー) = 値って感じで代入しています。
3. WearOSのMacrodroidで表示させる。
Webhookにより変数に代入され、マクロが起動します。
条件分岐は一旦無視します。
「ウェアOSコンプリケーション」アクションから格納した変数を用いて、WearOSのコンプリケーションに表示させます。
詳細に説明すると、このアクションでは表示する文字列、メーターの（最小値、最大値、値）、アイコンを設定します。
そのため
- 表示の文字列：残額
- 最小値：０
- 最大値：1か月の収入総額
- 値：1か月の収入ー支出
- アイコン：それっぽいの
って感じで設定します。
これで基本的な表示はできました！
最後に表示をタップして表示を変える機能を実装します。
トリガーにタップするトリガーを加え、
起動毎に条件分岐で表示を変更させます。
以上！
おわり
結構やっつけで書いたので、伝わりにくかったりしたらごめんなさい！
GAS、MacroDroidを使うとかなり手軽に開発できるので、ぜひやってみてください！
