画像ビューワを作るために、ImageSwitcherを使ってみようと思って実験してみたら、思いのほか良い結果となりました。今までで知っているやり方は、ViewFlipperにImageViewを数個入れてそれでスライドを検知っぽいやり方していたのだけど、画像と画像の間の微妙な隙間が生まれるので、Desireに付いているギャラリーみたいな見せ方ってどうやるねん！？って思っていたのですが、ImageSwitcherだったんですね、多分。
ApiDemosのImageSwitcherを参考にやっています。
最初は何も考えずにImageSwitcherを取得してすぐにsetImageResourceしていたのですが、例外で死んでしまって原因がわからなかったんですが、ApiDemosをみたらうまくいきました。やっぱりサンプルは偉大。この辺りの情報は本にも載ってないし。
01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 | package jp.cyclemate.android.phototest;import jp.cyclemate.android.androidlib.util.AnimationHelper;import android.app.Activity;import android.os.Bundle;import android.view.View;import android.view.View.OnClickListener;import android.widget.ImageSwitcher;import android.widget.ImageView;import android.widget.Gallery.LayoutParams;import android.widget.ViewSwitcher.ViewFactory;public class PhotoView extends Activity implements ViewFactory { private final static String TAG = "PhotoView"; private ImageSwitcher mSwitcher; // 画像を20枚準備 private int[] images = { R.drawable.photo_01, R.drawable.photo_02, R.drawable.photo_03, R.drawable.photo_04, R.drawable.photo_05, R.drawable.photo_06, R.drawable.photo_07, R.drawable.photo_08, R.drawable.photo_09, R.drawable.photo_10, R.drawable.photo_11, R.drawable.photo_12, R.drawable.photo_13, R.drawable.photo_14, R.drawable.photo_15, R.drawable.photo_16, R.drawable.photo_17, R.drawable.photo_18, R.drawable.photo_19, R.drawable.photo_20 }; // 現在表示中の画像の位置 private int position = 0; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.photo_view); mSwitcher = (ImageSwitcher) findViewById(R.id.imageswitcher); mSwitcher.setFactory(this); // この処理を行わないと例外で落ちた position = getIntent().getIntExtra("position", 0); mSwitcher.setImageResource(images[position]); // 今日はフリック実装する時間なかったので、 // クリックされたら次の画像へスライドという形 mSwitcher.setOnClickListener(new OnClickListener() { public void onClick(View v) { showNext(); // showPrevious(); } }); } private void showNext() { position += 1; if (position >= images.length) { position = 0; } // AnimationHelperは個人のライブラリです。あしからず。 mSwitcher.setInAnimation(AnimationHelper.inFromRightAnimation()); mSwitcher.setOutAnimation(AnimationHelper.outToLeftAnimation()); mSwitcher.setImageResource(images[position]); } private void showPrevious() { position -= 1; if (position < 0) { position = images.length - 1; } // AnimationHelperは個人のライブラリです。あしからず。 mSwitcher.setInAnimation(AnimationHelper.inFromLeftAnimation()); mSwitcher.setOutAnimation(AnimationHelper.outToRightAnimation()); mSwitcher.setImageResource(images[position]); } public View makeView() { // ApiDemos->Views->ImageSwitcherのソースからメソッドを丸々コピー ImageView i = new ImageView(this); i.setBackgroundColor(0xFF000000); i.setScaleType(ImageView.ScaleType.FIT_CENTER); i.setLayoutParams(new ImageSwitcher.LayoutParams( LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT)); return i; }} |
フリックを実装してないので、しょぼいサンプルになってしまいましたが、showNextメソッドを定義してその中でアニメーションを毎回切り替えることで、showNextが呼ばれたら進む方向にスライド、showPreviousが呼ばれたら戻る方向にスライドという形で動作することが確認できました。あとはフリックを実装するだけ（のはず）！
