展会信息港展会大全

Android之ImageSwitcher,Gallery用法
来源:互联网   发布日期:2015-10-03 10:45:04   浏览:2387次  

导读:今天在做一个软件界面时用到了ImageSwitcher和Gallery控件,在看API时,感觉上面的例子讲的不是很具体,效率并不高。在这里我就以一个图片浏览功能来具体说明这两个控件的用法。...

今天在做一个软件界面时用到了ImageSwitcher和Gallery控件,在看API时,感觉上面的例子讲的不是很具体,效率并不高。在这里我就以一个图片浏览功能来具体说明这两个控件的用法。

首先看运行效果:

在这里图片我用的是API中的图片。先说下这个图片浏览的功能吧,首先,它要实现图片的切换,当点击上面的小图时,下方会出现对象的大图,其次就是实现上图中最上面的样式,即一个图片和一个文本。下来我们还要实现起始位置居中,滑动小图的速率的控制,最上面小图的无限循环等功能。下面我就将具体实现代码附下,供大家参考。

main.xml:

1 <?xml version="1.0" encoding="utf-8"?>

2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

3android:layout_width="match_parent"

4android:layout_height="match_parent"

5android:orientation="vertical">

6<cn.yj3g.gallery.MyGallery android:id="@+id/gallery"

7android:background="#55000000"

8android:layout_width="match_parent"

9android:layout_height="80dp"

10android:gravity="center_vertical"

11android:spacing="2dp"

12/>

13<ImageSwitcher android:id="@+id/switcher"

14android:layout_width="match_parent"

15android:layout_height="match_parent"

16android:layout_weight="1"

17/>

18 </LinearLayout>

在上面我是自定义视图,引用自己定义的一个Gallery,在这个Gallery中我重新设置的滑动的速率,让它滑动速度放慢,下面是我自定义的Gallery 代码:

MyGallery.java:

1 package cn.yj3g.gallery;

2

3 import android.content.Context;

4 import android.util.AttributeSet;

5 import android.view.MotionEvent;

6 import android.widget.Gallery;

7

8 public class MyGallery extends Gallery {

9public MyGallery(Context context, AttributeSet attrs) {

10super(context, attrs);

11}

12/**

13* 重写onFling方法,将滑动的速率降低

14*/

15@Override

16public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {

17return super.onFling(e1, e2, velocityX/3, velocityY);

18}

19 }

下面是在定义gallery布局文件的代码:

gallery_item.xml:

1 <?xml version="1.0" encoding="utf-8"?>

2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

3android:orientation="vertical" android:layout_width="match_parent"

4android:layout_height="match_parent">

5<ImageView android:id="@+id/item_gallery_image"

6android:layout_width="fill_parent"

7android:layout_height="fill_parent"

8android:layout_weight="1"

9android:scaleType="fitXY"/>

10<TextView android:id="@+id/item_gallery_text"

11android:layout_width="fill_parent"

12android:layout_height="wrap_content"

13android:gravity="center"/>

14

15 </LinearLayout>

下面就是核心实现代码:

PictrueChangeActivity:

1 package cn.yj3g.PictrueChange;

2

3 import java.util.HashMap;

4

5 import android.app.Activity;

6 import android.content.Context;

7 import android.content.res.TypedArray;

8 import android.os.Bundle;

9 import android.util.Log;

10 import android.view.LayoutInflater;

11 import android.view.View;

12 import android.view.ViewGroup;

13 import android.view.Window;

14 import android.view.animation.AnimationUtils;

15 import android.widget.AdapterView;

16 import android.widget.BaseAdapter;

17 import android.widget.Gallery;

18 import android.widget.Gallery.LayoutParams;

19 import android.widget.ImageSwitcher;

20 import android.widget.ImageView;

21 import android.widget.TextView;

22 import android.widget.ViewSwitcher;

23

24 public class PictrueChangeActivity extends Activity implements AdapterView.OnItemClickListener,

25ViewSwitcher.ViewFactory {

26//定义ImageSwitcher类对象

27private ImageSwitcher mSwitcher;

28//文本资源

29private String[] titles = {"标题1","标题2","标题3","标题4","标题5","标题6","标题7","标题8",};

30//大图资源

31private Integer[] mThumbIds = { R.drawable.sample_0, R.drawable.sample_1, R.drawable.sample_2,

32R.drawable.sample_3, R.drawable.sample_4, R.drawable.sample_5, R.drawable.sample_6,

33R.drawable.sample_7 };

34//大图对应的小图资源

35private Integer[] mImageIds = { R.drawable.sample_thumb_0, R.drawable.sample_thumb_1,

36R.drawable.sample_thumb_2, R.drawable.sample_thumb_3, R.drawable.sample_thumb_4,

37R.drawable.sample_thumb_5, R.drawable.sample_thumb_6, R.drawable.sample_thumb_7 };

38@Override

39public void onCreate(Bundle savedInstanceState) {

40super.onCreate(savedInstanceState);

41//设置窗体无标题

42requestWindowFeature(Window.FEATURE_NO_TITLE);

43setContentView(R.layout.main);

44mSwitcher = (ImageSwitcher) findViewById(R.id.switcher);

45mSwitcher.setFactory(this);

46//设置图片的滑动效果

47mSwitcher.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_in));

48mSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_out));

49

50Gallery g = (Gallery) findViewById(R.id.gallery);

51//设置Gallery的适配器

52g.setAdapter(new ImageAdapter(this, mThumbIds.length));

53//Gallery中每个条目的点击事件监听

54g.setOnItemClickListener(this);

55//设置默认其实位置为第二张图片

56g.setSelection(1);

57}

58

59public void onItemSelected(AdapterView parent, View v, int position, long id) {

60mSwitcher.setImageResource(mThumbIds[position % mImageIds.length]);

61}

62public void onNothingSelected(AdapterView parent) {

63}

64

65@Override

66public View makeView() {

67ImageView i = new ImageView(this);

68i.setBackgroundColor(0xFF000000);

69i.setScaleType(ImageView.ScaleType.FIT_CENTER);

70i.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.MATCH_PARENT,

71LayoutParams.MATCH_PARENT));

72return i;

73}

74//Gallery的适配器

75public class ImageAdapter extends BaseAdapter {

76private int mGalleryItemBackground;

77//定义map存储划过的位置

78private HashMap<Integer, View> mViewMaps;

79private int mCount;

80//定义布局加载器

81private LayoutInflater mInflater;

82

83public ImageAdapter(Context c, int count) {

84this.mCount = count;

85mViewMaps = new HashMap<Integer, View>(count);

86mInflater = LayoutInflater.from(PictrueChangeActivity.this);

87//定义图片的背景样式

88TypedArray a = obtainStyledAttributes(R.styleable.Gallery1);

89mGalleryItemBackground = a.getResourceId(

90R.styleable.Gallery1_android_galleryItemBackground, 0);

91//定义可以重复使用.可回收

92a.recycle();

93}

94

95public int getCount() {

96//设置循环的次数

97return Integer.MAX_VALUE;

98}

99

100public Object getItem(int position) {

101return position;

102}

103

104public long getItemId(int position) {

105return position;

106}

107

108public View getView(int position, View convertView, ViewGroup parent) {

109Log.v("TAG", "getView() position=" + position + " convertView=" + convertView);

110View viewGroup = mViewMaps.get(position%mCount);

111ImageView imageView = null;

112TextView textView = null;

113if(viewGroup==null) {

114viewGroup = mInflater.inflate(R.layout.gallery_item, null);

115imageView = (ImageView) viewGroup.findViewById(R.id.item_gallery_image);

116textView = (TextView) viewGroup.findViewById(R.id.item_gallery_text);

117imageView.setBackgroundResource(mGalleryItemBackground);

118mViewMaps.put(position%mCount, viewGroup);

119imageView.setImageResource(mImageIds[position % mImageIds.length]);

120textView.setText(titles[position % mImageIds.length]);

121}

122

123return viewGroup;

124}

125}

126//记录当前位置

127private int curruntPos = -1;

128@Override

129public void onItemClick(AdapterView<?> parent, View view, int position, long id) {

130if (curruntPos == position) {

131return;

132} else

133curruntPos = position;

134mSwitcher.setImageResource(mThumbIds[position % mThumbIds.length]);

135}

136 }

这里要加载一个背景文件,放在values目录下,文件名为attrs.xml,代码如下:

1 <?xml version="1.0" encoding="utf-8"?>

2 <resources>

3

4<!-- These are the attributes that we want to retrieve from the theme

5in view/Gallery1.java -->

6<declare-styleable name="Gallery1">

7<attr name="android:galleryItemBackground" />

8</declare-styleable>

9

10 </resources>

这样显示的图片就有一个相框一样的边框。

在上面的代码中,和API中不同的是做了四点改进:

1.实现滑动可以无限滑动,就是在上面的getCount()中,返回的是一个Integer.MAX_VALUE,这样可以做到无限滑动。

2.提高在滑动时大图的显示效率。就是在上面,我自定义了一个Map,将滑动过的位置全部记录下来,等到下次滑到这个位置时,就不必再去加载图片了,类似于缓存。这样提高了效率。

3.在点击事件中,如果重复点击同一张图片,不会去加载图片。在这里我设置了一个标记位置,如果标记位置和当前位置一样,那就不去加载图片。

4.设置起始位置为第二位,这样初始界面比较美观,显示的图片两边都有图片。

摘自:青春流水指间

赞助本站

人工智能实验室

相关热词: android开发 教程

AiLab云推荐
推荐内容
展开

热门栏目HotCates

Copyright © 2010-2024 AiLab Team. 人工智能实验室 版权所有    关于我们 | 联系我们 | 广告服务 | 公司动态 | 免责声明 | 隐私条款 | 工作机会 | 展会港