【KLWP】ローマ数字のアナログ時計を作ろう
こんにちは、Masaokaです。
今回は「ローマ数字を使ったアナログ時計」を作ってみましょう。
この時計が作れるようになると、レトロ風の壁紙やアイコンにも合わせやすいと思います。
作り方は、以下の通りです。
- 文字盤を作る
- 時計の針を作る
- 仕上げ
それでは始めましょう。
スポンサードサーチ
文字盤を作る
盤面
まず最初に『グループ化（重ねる）』を追加。
この中に、アナログ時計のアイテムを追加していきます。
次に『図形』を追加。
形は何でもいいのですが、今回は「ローマ数字」を使うのが決まっているので、円形がいいでしょう。
色は少し彩度を抑えつつ、黄色を加えた明るめのを。
ベゼル
その上にベゼルとなるパーツを作りましょう。
図形を追加。
僕は先ほど作った文字盤と同じ大きさ ＋１０くらい大きくして、ストロークで太さを１０にしました。
簡単ですが、これで盤面は完成です。
あとはお好みに合わせてカスタマイズしてください。
文字
いよいよ本題です。
エディターの「＋」ボタンから『連番』アイテムを追加します。
（デフォルトはバッテリーで、横に並んでいるだけになっています）
スタイルタブに移動し、リストの一番上「スタイル」を選択。
そのあと、次のダイアログで『円形』を選びます。
そして連番タブに移動し、モードをタップ。ダイアログの一番下までスクロールし、『自作』を選びます。
このリスト内のアイテムには、とりあえず次のような値を入力してください。
| 数式 | $tc(roman, index+1)$ |
| 現在の値 | $df(h)%12-1$ |
| 数 | 12 |
| 加工 | 変更なし |
| 回転 | 手動 |
| オフセット | 30 |
次のスクリーンショットのようになっていれば、成功です。
（文字色は見やすいように黒に変更しました）
あとはスタイルタブに戻って、お好みの設定にしてください。
モードは『固定サイズ』にした方が、調整しやすいです。
時計の針を作る
実はここもミソだったりします。
初心者の方は、とくに注意してください。
分針
時計の針を表すのに“アイテムを回転”させる必要があります。
その点、Zooper WidgetやUCCWは割と簡単に作れましたが、KLWPは少しコツが必要です。
まず、『グループ化（重ねる）』を追加。ついでに、区別しやすくするため「分針 グループ」などに名前を変えておきましょう。
その中に『図形』を追加し、時計の針っぽくなるように加工します。
終わったら、「分針 グループ」の『レイヤー』タブに移動。そしてリストから『回転』を選択します。
下までスクロールすると、『時針に連動（なめらか）』『分針に連動（正確）』などの選択肢が見つかります。
この『～（なめらか）』と『～（正確）』ですが、「なめらか」の方をえらんでください。
今回は純粋なアナログ時計を作りたいので、例えば『分針に連動（正確）』を選択してしまうと違和感が生じます。
例えば現在の時刻が17:34だった場合、既に30分を回っているのに、時針が5の場所ちょうどを指したままで止まってしまいます
今は分針を作っているので、『分針に連動（なめらか）』を選びます。
『オフセット』はいじらなくて結構です。
針の位置を調節する
お分かりのように、これだと針がどこを指しているのか不明瞭なままです。
そこで、「分針 グループ」の『位置』タブへ移動。
ここがポイントでもあるのですが、『余白（下）』の値だけを加算してください。
その他の値をいじってしまうと、回転の中心がおかしなことになり、混乱します（← 経験済）
あとはお好みのデザインに変更してください。
時針を作る
先ほど作った「分針 グループ」をコピー&ペーストしてください。
そして「時針 グループ」名前を変更したあと、『レイヤー』タブに移動、回転 → 『時針に連動（なめらか）』を選択。
あとは長さやデザインを調整してください。
時針なので、分針よりも短めにすると良いでしょう。
最後に針止めを適当において、時計の完成です。
仕上げ
それっぽい壁紙とアイコンを選び、それらに合わせてデザインや色を調節してみましょう。
結構荒削りですが、僕のはこれで完成です。
最後に
いかがでしょうか。
ローマ数字を表す関数が1年ほど前に追加されていたのは知っていましたが、果たしてどう使うのか、僕も悩んでいました。
今回アナログ時計に使ったのは、かなり有効だったと思います。
ここで少し、今回使用したローマ数字化するKLWPの関数について確認してみましょう。
tc(roman, |
NUM（数字）に入れた値をローマ数字に変換する。 |
このローマ数字ですが、フォントを変更していろいろ検証してみたところ、大文字アルファベットの“X”と“I”と“V”を組み合わせたものですね。
ローマ数字専用のフォントなんて多くないでしょうから、ありがたいですね。
是非、あなたのホーム画面にも使ってみてください。