Pebble 開発チュートリアル(1-3)：色を付けてみる

せっかくPebble SDK 3使っているのに、白黒なのは残念ですよね。ということで、チュートリアルからは外れますが、色を付けてみましょう。

Pebble Timeで使える色は64色。Developerサイトにカラーピッカーがあります。

色を選ぶと、名称やHTML色コードや色設定サンプルコードも出てくる親切ページ。

Window *window = window_create();
window_set_background_color(window, GColorBrightGreen);
window_stack_push(window, true);

こういう感じで「GColor～」で指定してやればよいみたいですね。では、さっそく、TextLayerの背景をGColorDarkGray、文字色をGColorBrightGreenにしてみます。

 text_layer_set_background_color(s_time_layer, GColorDarkGray);
 text_layer_set_text_color(s_time_layer, GColorBrightGreen);

あれ？なんか該当行に、バッテン付いてますね。

コンパイルしてみると、やっぱり失敗。

../src/main.c: In function 'main_window_load':
../src/main.c:34:49: error: 'GColorDarkGray' undeclared (first use in this function)
../src/main.c:34:49: note: each undeclared identifier is reported only once for each function it appears in
../src/main.c:35:43: error: 'GColorBrightGreen' undeclared (first use in this function)
Waf: Leaving directory `/tmp/tmpMXfVRB/build'
Build failed

ビルドログによると、値の未定義。

これは、コンパイラが白黒Pebble用とカラーPebble用の両方をコンパイルするため、白黒用のコンパイル時に、カラー指定のところでエラーが出ているのでした。

バッテンのところにマウスオーバーすると、エラー理由出してくれます。ブラウザ上のエディタなのにスゴイです。「aptile: use of undeclared Identifier ‘GColorDarkGray’」とのことじゃ。

白黒用のコンパイルをしないために、SETTING で「APLITE」を対象から外します。一番下の「SAVE CHANGES」押すの忘れずに。

ただ、この設定にしても、バッテンは消えないのです。まあ、それは気にせず、実行してみると…

やったー。色が付いたー。

ひとまずうまくいったとはいえ、バッテンは消したいですよね。マイグレーションガイドによると、「#ifdef PBL_COLOR」を使って白黒とカラーで処理を分ける必要があるとのこと。

#ifdef PBL_COLOR
  text_layer_set_background_color(s_time_layer, GColorDarkGray);
  text_layer_set_text_color(s_time_layer, GColorBrightGreen);
#else
  text_layer_set_background_color(s_time_layer, GColorClear);
  text_layer_set_text_color(s_time_layer, GColorBlack);
#endif

これでOK。