Androidの各端末への対応/Draw 9-patchを使おう!

Androidは端末ごとに解像度が違うため、レイアウトを考えるときにいろいろと注意が必要です。

その中でも、imageを表示するときには一層の注意が必要!!

そんなときに力を発揮してくれるのが、「Draw 9-patch」です!

9-patchを使わずに表示すると・・・

端末の縦幅横幅いっぱいに画像を表示させようとすると、こんな感じでぼやけてしまうんですね。そんなときに役に立つのが、9-patch!!

9-patchの使い方

使い方については、以下のリンクがオススメです。

Draw 9-patchを使ってAndroidアプリを解像度に応じたリキッドデザインする

Androidで拡大縮小可能なGUI部品を作成するには


公式なドキュメントは、

Draw 9-patch

日本語版


ざっくりと手順を説明すると、

1、Android sdkの/tools/の中にある、「draw9patch」をダブルクリック

2、ターミナルが起動し、draw9patchが起動

3、Commond + o で編集したいファイルを開く

4、縦に引き伸ばされるときに引き伸ばしたい部分、横に引き伸ばされるときに引き伸ばされる部分を、それぞれ指定

5、Commond + s で保存。

6、ファイル名.9.拡張子 というファイルが作成される

サンプルコード

・main.xml

<ImageView xmlns:android="http://schemas.android.com/apk/res/android" 
	android:id="@+id/splash_image"
	android:src="@drawable/star"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:scaleType="fitXY" />


・Activity

import java.util.TimerTask;

import android.app.Activity;
import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.widget.ImageView;

public class StartActivity extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
    }
}

・9-patchバージョン

ImageViewのscaleTypeの指定

9patchで引き伸ばし効果をうまく使うには、fitXYを使わねばうまく表示できませんでした。

scaleTypeについては以下をご参照ください。

エリア内での表示方法

UIコンポーネント/ImageView