今回はGalleryを使って、ImageGalleryを作ってみます。

本サンプルは画像Imageのみをスクロールさせていますが、
作成するAdapter次第では複雑な物も使用出来ます。
それはまたの機会に。

具体的な実装方法は続きで紹介します。

Galleryを使用する為には、BaseAdapterを継承したクラスを
GalleryにsetAdapterする必要があります。

独自クラスの作成

まずは、BaseAdapterを継承した独自クラスImageAdapterを作成します。
注意しなければいけないのは、必ず以下4つのMethodの実装が必要なこと。
・int getCount
・Object getItem(int position)
・long getItemId(int position)
⇛これらについては、今回は深く関わらないので触れません。
・View getView(int position, View convertView, ViewGroup parent)
⇛後述

Gallery要素のBackGround

コンストラクタの中で、後述のattrs.xmlにて定義したGalleryBackImageの
リソースIDを取得し、getViewにおいてsetBackgroundResourceしています。

・obtainStyledAttributes

xmlで定義した値を読み出す。
今回は単にgalleryItemBackgroundのresIDを取得する為に。

	public ImageAdapter(Context ctx) {
	    mContext = ctx;
            TypedArray tmpArry = obtainStyledAttributes(R.styleable.GalleryBackImage);
            BackResId = tmpArry.getResourceId(
                    R.styleable.GalleryBackImage_android_galleryItemBackground, 0);
            tmpArry.recycle();
		}

getView

・View getView(int position, View convertView, ViewGroup parent)

画面上に表示されるGalleryの数だけ「position」の値を変え呼ばれる。
positionはN個の要素を持つ場合、０ 〜 N-1まで。
各々の場合において、読み込むべきImageをSetしています。

・ImageView.setScaleType

画像Imageの表示方法を指定します。

CENTER	枠中央を基準にscaleせずに表示
CENTER_CROP	枠中央を基準に横方向へscaleし表示
CENTER_INSIDE	枠中央を基準に枠内へ表示されるようscaleし表示(拡大はしない)
FIT_CENTER	枠中央を基準に縦方向へscaleし表示
FIT_END	枠右端を基準に縦方向へscaleし表示
FIT_START	枠左端を基準に縦方向へscaleし表示
FIT_XY	枠全体にFITする様scaleして表示
MATRIX	枠左上を基準にscaleせずに表示

・ImageView.setLayoutParams

Gallery.LayoutParamsに指定する値は、Gallaryを表示する大きさを指定する。
例）Gallery.LayoutParams(fill_parent,100)
→横方向には１つのみ（横fullx縦100)画面が出る。

		@Override
		public View getView(int position, View convertView, ViewGroup parent) {
			ImageView galleryView = new ImageView(mContext);

			galleryView.setImageResource(mImageIds[position]);
			galleryView.setScaleType(ImageView.ScaleType.FIT_XY);
			galleryView.setLayoutParams(new Gallery.LayoutParams(100, 100));

			galleryView.setBackgroundResource(BackResId);

			return galleryView;
		}

attrs.xml

/res/valuesディレクトリにattrs.xmlを作成する。
Gallery内のリソース全てに適用されるstyleの定義をする。
今回は、プラットフォーム既存のgalleryItemBackgroundを指定している。

<resources>
    <declare-styleable name="GalleryBackImage">
        <attr name="android:galleryItemBackground" />
    </declare-styleable>
</resources>

SourceCode全体/その他

AdapterView.OnItemSelected

Galleryにリスナーとしてsetすることで、
現在FocusされているGalleryの要素のpositionが取得出来ます。

public class Main extends Activity implements AdapterView.OnItemSelectedListener{
	ImageView fullView;

	protected Integer[] mImageIds = {
    		R.drawable.icon1,
    		R.drawable.icon2,
    		R.drawable.icon3,
    		R.drawable.icon4,
    		R.drawable.icon5
    	};

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

        Gallery gallery = (Gallery)findViewById(R.id.Gallery);
        gallery.setAdapter(new ImageAdapter(this));
        gallery.setOnItemSelectedListener(this);

        fullView = (ImageView)findViewById(R.id.ImageView_big);
    }

    @Override
    public void onItemSelected(AdapterView parent, View v, int position, long id){
    	fullView.setImageResource(mImageIds[position]);
    }

	@Override
	public void onNothingSelected(AdapterView<?> arg0) {
	}

    class ImageAdapter extends BaseAdapter{
    	int BackResId;

    	private Context mContext;

		public ImageAdapter(Context cnt) {
			mContext = cnt;
            TypedArray a = obtainStyledAttributes(R.styleable.GalleryBackImage);
            BackResId = a.getResourceId(
                    R.styleable.GalleryBackImage_android_galleryItemBackground, 0);
            a.recycle();

		}

		@Override
		public int getCount() {
			return mImageIds.length;
		}

		@Override
		public Object getItem(int position) {
			return position;
		}

		@Override
		public long getItemId(int position) {
			return position;
		}

		@Override
		public View getView(int position, View convertView, ViewGroup parent) {
			ImageView galleryView = new ImageView(mContext);

			galleryView.setImageResource(mImageIds[position]);
			galleryView.setScaleType(ImageView.ScaleType.FIT_XY);
			galleryView.setLayoutParams(new Gallery.LayoutParams(100, 100));

			galleryView.setBackgroundResource(BackResId);

			return galleryView;
		}

    }
}