Draw 9-patchを使う

| コメント(0)
android には9-patch という画像フォーマットが用意されている。これは、パーツを9つの部位に分け、拡大してもきれいに表示されるというものらしい。解像度が色々あるandroidの機種で、機種別画像を用意せず、一つの画像で使いまわしでき、便利そうだ。ただ、ボタンなどのように背景画像が無いものにしか使えない。その仕組みを理解してから使うべきだ。

まずは使ってみよう。button.gif

anndroid をインストールしたフォルダandroid-sdk-windows の tools の中に draw9patch.bat がある。これをクリックして起動。コマンドは File というだけのシンプルなプログラムだ。
1- まずは、適当なボタン画像(右の画像をコピー保存して使ってください)を中央の ↓ にドラッグする。 
2- 上下左右の端の1ラインにクリックした状態でラインを引く。修正は右クリックでラインが消える。
   
test7.bmp




3- コマンド File のSave9-patch で xx.9.png (ドット 9 ドット png) というファイルネームでandroid の res フォルダの drawble に保存する。 



test10.bmp
※ここで重要なのが、このラインの中だけが拡大されるということだ。
※Show patches にチェックを入れると右のように色分けされる

番号の説明。。。。
①②③④の部分は拡大されない。
⑤⑥は横方向のみ拡大れる
⑦⑧は縦方向のみ拡大される
⑨は縦、横に拡大される

つまり、上下左右の端部分は見た目で1:1の比率なのできれいということである。逆に言えば、⑨の部分のみ拡大される。つまり、⑨に模様入ったボタンは無理だということだ。

しかし、ラインの取り方の工夫次第で、模様の入ったものでもきれいに表示できる。
下記の場合、模様の無い2か所の部分を設定して拡大するようにすれば、中央に光のシルバーラインが入った画像がきれいに表示できる。
最初に「ボタンなどのように背景がないものしか使えない」と言ったが、⑨の部分をどこに取るかでかなり応用ができそうだ。


test11.bmptest12.bmp



ちなみに、最初のボタン画像はhttp://box.aflat.com/buttonmaker/で簡単に作ることができる。お勧めサイトだ。

<<神戸でHP作成&個人レッスンなら http://petafield.com まで>>

コメントする