Android Weekly Topics
2021年12月第4週 開発意欲をくすぐるスマートウォッチ「Bangle.js 2」（後編）
前回に続いてBangle.
開発言語はJavaScript
アプリの開発言語はJavaScriptで，
アプリ開発は，
メモリが少ないので人気のライブラリは使えないと考えたほうが良いのと，
ハードウェアリソースが限られた端末では，
開発環境はクラウド
統合環境がクラウドで提供されているので，
これには，
端末との接続はWeb Bluetoothを使います。
対応ブラウザは，
余談ですが，
統合環境は，
とは言え，
ウィジェットを自作してみました
Bangle.
ウィジェットは，
たとえば，
このウィジェットがおもしろそうだったので自作してみました。開発したのは以下のようなものです。
- 画面左上にカレンダーアイコンと共に今日の日付を表示する
- 9時から20時までの間，
0分にバイブレーションを動作 - 同じ時間帯の9時，
11時， 13時， 16時， 18時の30分に， バイブレーションで手洗いを促す
このウィジェットで，
WIDGETS = {}; // <-- for development only
(() =< {
let width = 24; // width of the widget
let t_begin = 20;
let t_end = 9;
let t_hnd = { 9:1, 10:0, 11:1, 12:0, 13:1, 14:0, 15:0, 16:1, 17:0, 18:1, 19:0, 20:0 };
const ICON_CALENDAR = 0;
const ICON_CHIME = 1;
const ICON_HAND = 2;
let f_icon = ICON_CALENDAR;
function draw( ) {
g.reset(); // reset the graphics context to defaults (color/font/etc)
// Draw icon
if( f_icon == ICON_CHIME ) {
g.drawImage(atob( 'GBgBAAAAAAAAABgAABgAADwAAP8AAf+AAf+AA//AA//AA//AA//AA//AA//AA//AA//AA//AB//gD//wAAAAADwAABgAAAAAAAAA' ), this.x, this.y) ;
} else if( f_icon == ICON_HAND ) {
g.drawImage(atob( 'GBgBAAAAAAwAAAwAAG2AAG2AAG2wAG2wAG2wAG2wAG2wAH/wAH/wAH/wGH/wHn/wH3/wD//wB//wA//wAf/wAP/wAH/gAD/AAAAA' ), this.x, this.y) ;
} else {
g.drawImage(atob( 'GBgBAAAAAwDAAwDAD//wH//4H//4H//4H//4GAAYGAAYGAAYGAAYGAAYGAAYGAAYGAAYGAAYGAAYGAAYH//4D//wAAAAAAAAAAAA' ), this.x, this.y) ;
let date = new Date();
g.setFontAlign(0,0);
g.setFont('6x8');
g.drawString( date.getDate(), (this.x+width/2)+1, this.y+13);
}
}
setInterval(function() {
let today = new Date();
f_icon = ICON_CALENDAR;
if(( t_end <= today.getHours()) && ( t_begin < today.getHours())) {
if( today.getMinutes() == 0 ) {
f_icon = ICON_CHIME;
Bangle.buzz(400,1);
Bangle.buzz(800,0.1);
} else if(( t_hnd[today.getHours()] == 1 ) && ( today.getMinutes() == 30 )) {
f_icon = ICON_HAND;
Bangle.buzz(400,1);
Bangle.buzz(800,0.1);
Bangle.buzz(400,1);
}
}
WIDGETS['widdate'].draw(WIDGETS['widdate']);
}, 1*60000 );
WIDGETS['widdate']={
area : 'tl',
width : width,
draw : draw
};
})()
Bangle.drawWidgets(); // <-- for development only
これはサンプルから派生したものですが，
アイコンの描画とバイブレーションの動作
アイコンは，
アイコンの変更は，
g.drawImage(atob( 'GBgBAAAAAAwAAAwAAG2AAG2AAG2wAG2wAG2wAG2wAG2wAH/wAH/wAH/wGH/wHn/wH3/wD//wB//wA//wAf/wAP/wAH/gAD/AAAAA' ), this.x, this.y) ;
描画は，
画像ファイルはbase64に変換してコードに埋め込み，
バイブレーションは継続時間と強さが指定できます。
以下のコードでは，
Bangle.buzz(400,1);
Bangle.buzz(800,0.1);
音が鳴らせるとよかったのですが，
年末・年始のお休みにいかがでしょうか
駆け足ですが，
年末・
それでは皆さん，
Android, スマートフォン, スマホ, スマートウォッチ, Bangle.js 2, JavaScript, ウィジェット, 開発
著者プロフィール
傍島康雄（そばじまやすお）
5月30日生まれ。
モバイルデバイスが大好物。それで動くアプリの開発に喜びを感じている。スマートフォン前夜のWindows Mobile，PalmOSのアプリに情熱を傾けていたが，最近は停滞気味でコードを書くよりも文章を書く機会が多くなっており，文章を書くのも，プログラミングと同じくらい奥深い作業だと感じている。
バックナンバー
Android Weekly Topics
- 2021年12月第4週 開発意欲をくすぐるスマートウォッチ「Bangle.js 2」（後編）
- 2021年12月第3週 開発意欲をくすぐるスマートウォッチ「Bangle.js 2」
- 2021年12月第2週 来年こそは来るのか？「Pixel Watch」登場の噂
- 2021年12月第1週 AndroidにもRISC-Vの波が来るのか