雑文発散
2015-10-19 [長年日記]
▼ [Pebble] Pebble Time Round 対応の SDK 3.6 が降ってきたので Round での違いを知るよ
定期的に Homebrew の brew update / brew upgrade を実行していると勝手にいろいろなものがアップグレードされていく。先日も実行したら Homebrew で入れている Pebble SDK (pebble-sdk) もアップグレードされ、3.6 に変わった。DP(Developer Preview) 版が出ていたのは知っていたけど、いよいよ正式版がリリースされたようだ。
Web 日記の後追い作業（2週間分くらい溜め込んだ）も落ち着いたので、ようやく新しいことを学ぶ時間を確保できるようになったので、今日から Pebble Time Round の勉強でもしようと思う。
Pebble の開発者用に Round 用の差分などを記したドキュメントがあるので、ここから追ってみる。
まず、Pebble Time Round のプラットフォーム名は「Chalk」。オレは読めなかったけど「チョーク」だ。初代が「Aplite」、四角い Time が「Basalt」、そして Round が「Chalk」。次のプラットフォームが出るときは、きっと「D」で始まる岩石系の名前になるんだよね。何があるんだろう……。
まぁ、それは良いとして、Chalk プラットフォームに関しての差分などを自分用メモとして書きつつ、日記として公開する。日記ネタの枯渇に対する問題としては、こういう解決方法が良い。しばらく後に「あれ、確かオレ日記に書いたよな」ってことを思い出して、自分の日記をググることもよくあるし。
脱線した。
次に、各プラットフォームのハードウェア比較の表を確認してみる。
Pebble Time (Basalt) と Pebble Time Round (Chalk) は、ハードウェア的にはほぼ同じ。画面の形が丸くなったのはすぐ見てわかる大きな違いだけど、ディスプレイサイズもなにげに変わっている。Basalt は、144x168 だけど、Chalk では 180x180 と少し大きくなっている。
デザイン面についての注意事項のまとめドキュメントもある。まだ作成中（Work in progress）なので、今後ドキュメントに修正が入るかも知れないけど、ちょっと見ておく。
Chark は、メニューが左右中心に表示されるようになったんだね。あと、長いテキストをスクロールして見せていたようなアプリは、画面切り替えによるページングにしたほうが望ましいという説明がある。Chark は「場所によって1行の文字数が変わる」というプラットフォームなので、スクロールだとその都度レイアウト変更が発生してガタガタになってしまう。その様子のアニメーション GIF があるので、とても分かりやすい解説だ。
Pebble Time Round 用のアプリの作り方については、別途ドキュメントが用意されている。こっちもまだ WIP だ。
ディスプレイが四角いのか丸いのかという判定は、defined(PBL_RECT) / defined(PBL_ROUND) で実現できるとのこと。
#if defined(PBL_RECT)
printf("This is a rectangular display!");
#elif defined(PBL_ROUND)
printf("This is a round display!");
#endif
もうひとつのやり方も紹介されており、こちらは三項演算子的な使いかたなのかな。
// Conditionally print out the shape of the display
printf("This is a %s display!", PBL_IF_RECT_ELSE("rectangular", "round"));
あと、従来のプラットフォームとはディスプレイサイズが変わっている問題についての解説もある。例えば次のように、レイヤーの座標を固定値で書いてしまっていると、Pebble Time Round では表示位置がズレてしまうという説明。
// Bad
Layer *layer = layer_create(GRect(0, 0, 144, 168));
これは前述の説明のとおり Chalk では 144x168 から 180x180 へ変わったことによる。上の「Bad」な例だと左側へ寄った表示になってしまう。より良い方法として、次のように layer_get_bounds 関数を使って、動作中のプラットフォームに対応したサイズを取得するやり方が解説されている。
// Better
GRect bounds = layer_get_bounds(parent_layer);
Layer *layer = layer_create(bounds);
確か、オレが作ってきた Watchface では、固定値を使っているところがあった気がするので、Chalk 対応する場合は書き換えないとダメそうだ。
その他に、複数のプラットフォームに対応するときのリソース（画像やフォントなど）を使い分けるテクニックの解説もアップデートされていた。
Pebble SDK で画像を使うときには、まず appinfo.json で定義をする必要がある。例えばこういう感じ。
"resources": {
"media": [
{
"type": "png",
"name": "EXAMPLE_IMAGE",
"file": "images/example-image.png"
}
]
}
こうしておくと、ソースコードのなかで「RESOURCE_ID_EXAMPLE_IMAGE」という定数で images/example-image.png の画像へアクセスできるようになる。
そして、従来の Aplite（モノクロ）と Basalt（カラー）のプラットフォームでは、次のようなファイル名にしておくと、 RESOURCE_ID_EXAMPLE_IMAGE と記述した部分で、プラットフォームに応じたモノクロ／カラー画像のいずれかを使ってくれるようになっていた。
images/example-image~bw.png
images/example-image~color.png
つまり、モノクロはファイル名に「~bw」を付け、カラーは「~color」を付けるということ。ここに今度は「Rect（矩形）」と「Round（円形）」という概念が加わって、このような書き方ができるようになった。
images/example-image~bw.png
images/example-image~color~rect.png
images/example-image~color~round.png
「~」による区切りが、ちょっともにょい感じがするんだけど、ソースコード上では「RESOURCE_ID_EXAMPLE_IMAGE」として記述しておけば良いので楽チン。画像を利用するたびに if 文でプラットフォーム切り分けをすることを思えば、だいぶコードの見通しが良くなる。これは積極的に利用すべきテクニックだろう。
さて、これで Pebble Time Round の概要は把握できたような気がするので、次は実際にコーディングしながら試してみよう。