カスタマイズしたWidgetの色や配置を変更

d0204132_5155895.jpg

もうホーム画面を変えないと書いておきながら、新しく作った壁紙が気に入ったので、壁紙を変更しました。

ところで、前の記事でカスタマイズしたWidgetの色や配置を上の画像のようにする為の変更箇所を書いておきます。
と言っても画像ですが・・・。
画像クリックで本来の画像の大きさになります。
黄色の枠で囲ってある部分が変更した箇所です。




配置を考える前に、フォントの大きさや色を先に決めます。
というのも、色はともかくフォントの大きさで配置したときの感じが変わってしまう為です。
d0204132_5184572.jpg

上の画像は見やすさの関係で2列にしてあります。
変更するのは、/theme/css/に入っているBottom.cssです。
左側が、ホーム画面の左に配置される時間と秒とAM/PMの表示に関する指定で、右側が右に配置される年月日と曜日の表示に関する指定です。
色に関しては英語でのコード指定をしています。

フォントの大きさなどが決まったら、次は配置を考えます。
これはWidget.htmlを書き換えます。
d0204132_5234424.jpg

同じく黄色の枠で囲ったところが変更した箇所です。
配置に関しては数字を入れてみて保存し、リスプリングしてどの辺に表示されるか確かめるのを繰り返してちょうど良い配置を見つけていきました。

Tableが下に行くほどレイヤーが上になるので、この場合はyearが一番下に表示されるようにするためにyearのTableを、day、date、monthよりも上に配置しています。

一番上の画像の様な配置以外にも、変わった配置が考えられると思います。
これを参考に色々試してみてはいかがでしょうか?
 
[PR]
by norippeipon | 2011-05-06 05:39 | テーマ(要WB)

iPhone4で設定したことや入れたアプリ、カスタマイズしたことの覚え書き


by norippeipon