スキンは”Skin”フォルダ内に必要なファイルが入ったフォルダを置くことで追加ができます。
スキンを用意することで以下の内容を自由に変更できます。
- 背景
- 画像とその後ろに表示する色を指定できます。
- スキンの幅と高さは、背景画像と同じサイズになります。
- 背景画像を指定しない場合は、幅と高さを指定する必要があります。
- 心拍数に合わせた間隔で交互に表示する画像
- 2つの画像とそれぞれの表示位置を指定できます。
- 画像は (30000 / 心拍数)ミリ秒 間隔で切り替わります。
- 追加画像
- 画像と表示位置を指定できます。
- 心拍数を表示する文字
- フォントファイル・色・サイズ・太字・斜体・位置を指定できます。
- ブラウザで表示するページ
- ブラウザで表示するHTMLファイルを指定できます。
- 内容を自由に作れるので、画像の切り替え時にアニメーションを入れたり、心拍数に連動させて何かアクションを起こすこともできます。
- 心拍数による要素の切り替え
- 背景画像、画像1、画像2、追加画像と心拍数の文字の色を心拍数によって切り替えることができます。
付属のサンプルでは画像とフォントを変更しています。
サンプル2では、心拍数によって表示する画像と心拍数の色が変化するようになっていて、更にブラウザ用HTMLを変更して、点滅する際にフェードイン/アウトのアニメーションを付けています。
(アニメーションが付くのはブラウザで表示した場合のみです。)
作り方
スキンは付属のスキンエディタを使って作成します。
“SkinEditor.exe”を実行して、変更したい項目を入力してください。
変更する必要のない項目は空欄のままで構いませんが、
背景の”幅と高さ”もしくは”画像”のどちらかを必ず入力する必要があります。
空欄の場合の各項目のデフォルト値については”README_SkinEditor.txt”を確認してください。
スキンエディタで保存したスキンファイル(JSON形式の”skin.json”)をテキストエディタで編集することもできます。
“skin.json”は必ずUTF-8(BOM無し)で保存してください。