Android SDKのドキュメントを見ていると、NinePatchイメージという言葉が出てくる。
NinePatchイメージとは、ボタンやViewのバックグラウンド、GUIパーツで使用する、拡大しても汚くならない画像フォーマットの事である。

おさえる所

  • Android SDKにdraw9patchというツールが用意されている。
  • 画像フォーマットはPNG
  • リソースは、res/drawable/hoge.9.png に配置(最後に9.pngを付ける)
  • android.graphics.drawable.NinePatchDrawableクラスがあるが使う事はまずない、通常XMLファイルに指定するだけで使用できる。

何故Nine Patchというかは、9つの部品から構成されているからである。

かなりぐだぐだな画像だが、なんとなくイメージをつかんでもらえたらと思う。

以下の9つの箇所をしてい知れば、ボタンを綺麗に拡大可能な事がわかる、逆にいえば9つの場所を指定して拡大できない種類の画像(写真等)では使用する意味がない

9-patch

Draw9Patch

Android SDKのtoolsディレクトリ下にdraw9patch.batが存在するので、ダブルクリックをして起動する。
draw9patchを起動して、適当な9Patchファイルの、btn_default_selected.9.pngを読み込んだ状態が以下の画面である。

画面右が編集画面、画面右が拡大縮小した時にどのように見えるかのプレビュー画面となっている。

画面下のPatch sacleのスライドバーを動かすと右側のプレビュー画面が変化をする。

編集方法は意外に難しく、右上の「Show bad patches」ボタンを押してから作業をした方が分かりやすい

左画面の一番外のドット部分だけ編集可能となっており、外枠1ドットをクリックすると選択した領域が黒くなる、選択を辞める時は、右クリックで元に戻る。

とりあえず15分ぐらいいじっていれば感じがつかめると思う。

ブログ内の関連する記事