HardBirch

Android入门第十三篇之Gallery + ImageSwitcher

时间:10-10-24 栏目:安卓入门与提高 作者:张飞不张,文采横飞 评论:24 点击: 10,756 次

    上次讲了如何使用Gallery控件,这次就讲Gallery 与ImageSwitcher的结合使用,本文实现一个简单的浏览图片的功能。先贴出程序运行截图:

除了Gallery可以拖拉切换图片,我在ImageSwitcher控件加入了setOnTouchListener事件实现,使得ImageSwitcher也可以在拖拉中切换图片。本例子依然使用JAVA的反射机制来自动读取资源中的图片。

main.xml的源码如下:




<ImageSwitcher android:id="@+id/switcher"
android:layout_width="match_parent" android:layout_height="match_parent"/>

<Gallery android:id="@+id/gallery"
android:background="#55000000"
android:layout_width="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"

android:gravity="center_vertical"
android:spacing="16dp" android:layout_height="100dp"/>
</RelativeLayout>

 

程序的源码如下:
























@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
//用反射机制来获取资源中的图片ID
Field[] fields = R.drawable.class.getDeclaredFields();
for (Field field : fields)
{
if (!"icon".equals(field.getName()))//除了icon之外的图片
{
int index = 0;
try {
index = field.getInt(R.drawable.class);
} catch (IllegalArgumentException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IllegalAccessException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
//保存图片ID
imgList.add(index);
}
}

//设置ImageSwitcher控件
is = (ImageSwitcher) findViewById(R.id.switcher);
is.setFactory(this);
is.setInAnimation(AnimationUtils.loadAnimation(this,
android.R.anim.fade_in));
is.setOutAnimation(AnimationUtils.loadAnimation(this,
android.R.anim.fade_out));
is.setOnTouchListener(new OnTouchListener(){
/*
* 在ImageSwitcher控件上滑动可以切换图片
*/
@Override
public boolean onTouch(View v, MotionEvent event) {
if(event.getAction()==MotionEvent.ACTION_DOWN)
{
downX=(int) event.getX();//取得按下时的坐标
return true;
}
else if(event.getAction()==MotionEvent.ACTION_UP)
{
upX=(int) event.getX();//取得松开时的坐标
int index=0;
if(upX-downX>100)//从左拖到右,即看前一张
{
//如果是第一,则去到尾部
if(gallery.getSelectedItemPosition()==0)
index=gallery.getCount()-1;
else
index=gallery.getSelectedItemPosition()-1;
}
else if(downX-upX>100)//从右拖到左,即看后一张
{
//如果是最后,则去到第一
if(gallery.getSelectedItemPosition()==(gallery.getCount()-1))
index=0;
else
index=gallery.getSelectedItemPosition()+1;
}
//改变gallery图片所选,自动触发ImageSwitcher的setOnItemSelectedListener
gallery.setSelection(index, true);
return true;
}
return false;
}

});

//设置gallery控件
gallery = (Gallery) findViewById(R.id.gallery);
gallery.setAdapter(new ImageAdapter(this));
gallery.setOnItemSelectedListener(new OnItemSelectedListener(){
@Override
public void onItemSelected(AdapterView<?> arg0, View arg1,
int position, long arg3) {
is.setImageResource(imgList.get(position));
}
@Override
public void onNothingSelected(AdapterView<?> arg0) {
// TODO Auto-generated method stub
}

});
}
//设置ImgaeSwitcher
@Override
public View makeView() {
ImageView i = new ImageView(this);
i.setBackgroundColor(0xFF000000);
i.setScaleType(ImageView.ScaleType.CENTER);//居中
i.setLayoutParams(new ImageSwitcher.LayoutParams(//自适应图片大小
LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
return i;
}
public class ImageAdapter extends BaseAdapter {
public ImageAdapter(Context c) {
mContext = c;
}
public int getCount() {
return imgList.size();
}
public Object getItem(int position) {
return position;
}
public long getItemId(int position) {
return position;
}
public View getView(int position, View convertView, ViewGroup parent) {
ImageView i = new ImageView(mContext);
i.setImageResource(imgList.get(position));
i.setAdjustViewBounds(true);
i.setLayoutParams(new Gallery.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
return i;
}
private Context mContext;
}

}

声明: 本文由( 张飞不张,文采横飞 )原创编译,转载请保留链接: Android入门第十三篇之Gallery + ImageSwitcher

Android入门第十三篇之Gallery + ImageSwitcher:目前有24 条留言

  1. 24楼
    badmanyu:

    感谢LZ

    2010-10-25 09:01 [回复]
  2. 23楼
    hmc1985:

    纯支持,[e01]

    2010-10-25 09:09 [回复]
  3. 22楼
    yangc_83:

    [e01]

    2010-10-25 09:09 [回复]
  4. 21楼
    kf156:

    顶虫哥 
    点击图片左右区域切换前后图片时,如果能将圈圈改成左右箭头效果会更好,哈哈

    2010-10-25 09:11 [回复]
  5. 20楼
    woshild666:

    public View getView(int position, View convertView, ViewGroup parent) {
    ImageView i = new ImageView(mContext);
    i.setImageResource(imgList.get(position));
    i.setAdjustViewBounds(true);
    i.setLayoutParams(new Gallery.LayoutParams(
    LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
    return i;
    }
    view是有缓存的..不需要一直new…

    2010-10-30 15:52 [回复]
  6. 19楼
    huangbq:

    请教个问题:当第一次显示Gallery中的图片时,默认第一张图片位置是屏幕的中间,屏幕左边留下一片空白。

    请问怎样能让屏幕左边不留空,图片直接紧靠屏幕左边依次向右排列?

    2010-12-14 14:23 [回复]
  7. 18楼
    TsinghuaTop:

    你这是从资源中得图片,要是从SDCard中得到图片要怎搞??

    2011-08-06 10:36 [回复]
  8. 17楼
    hellogv:

    [reply]TsinghuaTop[/reply]
    File->InputStream->Bitmap

    2011-08-09 20:59 [回复]
  9. 16楼
    kangliquan26:

    很好的想法, 记录点下和抬起手指时的X值进行对比,以判断滑动方向的想法学习了..多谢..看来编程更多的还是要思考和实践

    2011-08-11 15:08 [回复]
  10. 15楼
    stardust_oak:

    楼主你那onTouch方法return的是false,这样滑动时,可以进行图片的切换吗,我原来return的是false,滑动时,切换不了图片,后来改成true就可以了

    2011-09-18 23:17 [回复]
  11. 14楼
    hellogv:

    [reply]stardust_oak[/reply]
    你返回true的话,只能捕获到ACTION_DOWN一次,再也捕获不了ACTION_UP了

    2011-09-18 23:23 [回复]
  12. 13楼
    stardust_oak:

    [reply]woshild666[/reply]
    为什么测试的时候,convertView都是为空呢,以前用的话,还加了一个判断,convertView不为空的话,就从缓存中读取,如果是这样的话,那岂不是就没有缓存到了

    2011-09-18 23:29 [回复]
  13. 12楼
    stardust_oak:

    [reply]hellogv[/reply]
    不明白,从测试的结果上来看,return false的话,我就没
    捕获过ACTION_UP,总是捕获ACTION_DOWN,而且博主
    你那代码里面还有一个return是不是多余的,好像删了也没
    什么影响吧

    2011-09-18 23:33 [回复]
  14. 11楼
    lwuit:

    楼主,你可以说一下,gallery中的某个item获得焦点时放大,是在实现的么?

    2011-09-20 11:54 [回复]
  15. 回4楼,亚日哥~
    好久不联系了~现在也开始搞android了啊~
    哈哈!

    2011-09-23 12:24 [回复]
  16. [reply]lwuit[/reply]
    if (view instanceof ImageView) {
    ImageView imgView = (ImageView) view;
    LayoutParams param = new LayoutParams(40, 40);
    imgView.setLayoutParams(param);
    // imgView.set
    }

    2011-09-23 12:25 [回复]
  17. [reply]huangbq[/reply]
    第一张图片,左边肯定为空的~想要做到不显示空白,要不在第一张图片填充到屏幕宽度,不然它始终要左右两边对等的~

    2011-09-23 13:47 [回复]
  18. 很好,学习了。

    2011-09-26 15:27 [回复]
  19. 6楼
    yeahwell:

    116. @Override
    117. public View makeView() {
    118. ImageView i = new ImageView(this);
    119. i.setBackgroundColor(0xFF000000);
    120. i.setScaleType(ImageView.ScaleType.CENTER);//居中
    121. i.setLayoutParams(new ImageSwitcher.LayoutParams(//自适应图片大小
    122. LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
    123. return i;
    124. }
    没有ImageSwitcher.LayoutParams(//自适应图片大小
    122. LayoutParams.FILL_PARENT, 这个方法

    2012-01-27 21:32 [回复]
  20. 为什么我做的gallery只显示一张图片,而不是布满整个窗口的宽度

    2012-02-25 22:49 [回复]
  21. public View makeView() 是如何设置ImgaeSwitcher的

    2012-03-13 22:57 [回复]
  22. 地板
    crasyman2008:

    弱弱的问一下,你的效果图是怎么做出来的? 能录制屏幕内容保存为图片?求指教。。

    2012-03-14 00:01 [回复]
  23. 板凳
    lanyimo555:

    这么喜欢用反射么

    2012-03-15 14:23 [回复]
  24. 沙发
    zhou_stick:

    ]

    2012-09-10 09:37 [回复]

发表评论


QQ群互动

Linux系统与内核学习群:194051772

WP建站技术学习交流群:194062106

魔豆之路QR

魔豆的Linux内核之路

魔豆的Linux内核之路

优秀工程师当看优秀书籍

优秀程序员,要看优秀书!

赞助商广告

友荐云推荐