Android幻灯片式图片浏览器

来源:互联网 发布:手机指纹锁软件下载 编辑:程序博客网 时间:2024/05/01 18:51

本文转自:http://blog.csdn.net/bear_huangzhen/article/details/24232029

今天我们通过使用Android提供给我们的现有空间Gallery和ImageSwitcher来实现一个幻灯片式的图片浏览器。

(1)首先我们新建一个工程,修改主布局文件activity_main.xml内容如下:

[html] view plaincopy在CODE上查看代码片派生到我的代码片
  1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent"  
  5.     android:gravity="center_horizontal"  
  6.     android:orientation="vertical" >  
  7.   
  8.     <ImageSwitcher  
  9.         android:id="@+id/image_switcher"  
  10.         android:layout_width="wrap_content"  
  11.         android:layout_height="0dip"  
  12.         android:layout_weight="2"  
  13.         android:paddingTop="30dip" />  
  14.   
  15.     <!--  
  16.          android:layout_weight  详细解释:按比例显示LinearLayout内各个子控件,  
  17.                                 需设置android:layout_width="0dp",  
  18.                                 如果为竖直方向的设置android:layout_height="0dp"。  
  19.                                 在这种情况下某子个控件占用LinearLayout的比例为:  
  20.                                 本控件weight值 / LinearLayout内所有控件的weight值的和。  
  21.                                   
  22.          android:spacing 设置图片的间距  
  23.            
  24.          android:unselectedAlpha 设置为选中条目的透明度  
  25.     -->  
  26.   
  27.     <Gallery  
  28.         android:id="@+id/gallery"  
  29.         android:layout_width="fill_parent"  
  30.         android:layout_height="0dip"  
  31.         android:layout_weight="1"  
  32.         android:spacing="5dip"  
  33.         android:unselectedAlpha="0.6" />  
  34.   
  35. </LinearLayout>  


(2)在Java代码部分,修改MainActivity.java的内容如下(代码已经详细注释):

[java] view plaincopy在CODE上查看代码片派生到我的代码片
  1. public class MainActivity extends Activity {  
  2.   
  3.     // 声明并静态初始化图片id数组  
  4.     private int[] imageIds = { R.drawable.img01, R.drawable.img02,  
  5.             R.drawable.img03, R.drawable.img04, R.drawable.img05,  
  6.             R.drawable.img06, R.drawable.img07, R.drawable.img08,  
  7.             R.drawable.img09, R.drawable.img10, R.drawable.img11,  
  8.             R.drawable.img12 };  
  9.   
  10.     // 声明一个Gallery视图控件变量  
  11.     private Gallery gallery;  
  12.   
  13.     // 声明一个ImageSwitcher视图控件变量  
  14.     private ImageSwitcher imageSwitcher;  
  15.   
  16.     @Override  
  17.     public void onCreate(Bundle savedInstanceState) {  
  18.         super.onCreate(savedInstanceState);  
  19.         setContentView(R.layout.activity_main);  
  20.   
  21.         // 获取视图控件对象  
  22.         gallery = (Gallery) findViewById(R.id.gallery);  
  23.         imageSwitcher = (ImageSwitcher) findViewById(R.id.image_switcher);  
  24.   
  25.         // 设置动画效果  
  26.         imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(this,  
  27.                 android.R.anim.fade_in));  
  28.         imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(this,  
  29.                 android.R.anim.fade_out));  
  30.   
  31.         // 为imageSwitcher设置ViewFactory对象  
  32.         imageSwitcher.setFactory(new ViewFactory() {  
  33.   
  34.             @Override  
  35.             public View makeView() {  
  36.                 // 初始化一个ImageView对象  
  37.                 ImageView imageView = new ImageView(MainActivity.this);  
  38.                 // 设置保持纵横比居中缩放图像  
  39.                 imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);  
  40.                 // 设置imageView的宽高  
  41.                 imageView.setLayoutParams(new FrameLayout.LayoutParams(  
  42.                         LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));  
  43.                   
  44.                 return imageView;  
  45.             }  
  46.         });  
  47.           
  48.         //初始化一个MainGalleryAdapter对象  
  49.         MainGalleryAdapter adapter = new MainGalleryAdapter();  
  50.           
  51.         //将适配器与gallery关联起来  
  52.         gallery.setAdapter(adapter);  
  53.           
  54.         //初始选中中间的图片  
  55.         gallery.setSelection(imageIds.length/2);  
  56.   
  57.         gallery.setOnItemClickListener(new OnItemClickListener() {  
  58.   
  59.             @Override  
  60.             public void onItemClick(AdapterView<?> parent, View view,  
  61.                     int position, long id) {  
  62.                 //在ImageSwitcher中显示选中的图片  
  63.                 imageSwitcher.setImageResource(imageIds[position]);  
  64.             }  
  65.         });  
  66.     }  
  67.   
  68.     @Override  
  69.     public boolean onCreateOptionsMenu(Menu menu) {  
  70.         getMenuInflater().inflate(R.menu.activity_main, menu);  
  71.         return true;  
  72.     }  
  73.   
  74.     /** 
  75.      * 定义Gallery的数据适配器MainGalleryAdapter 
  76.      */  
  77.     class MainGalleryAdapter extends BaseAdapter {  
  78.           
  79.         /** 
  80.          * 获得数量 
  81.          */  
  82.         @Override  
  83.         public int getCount() {  
  84.             return imageIds.length;  
  85.         }  
  86.           
  87.         /** 
  88.          * 获得当前选项 
  89.          */  
  90.         @Override  
  91.         public Object getItem(int position) {  
  92.             return getResources().getDrawable(imageIds[position]);  
  93.         }  
  94.           
  95.         /** 
  96.          * 获得当前选项的id 
  97.          */  
  98.         @Override  
  99.         public long getItemId(int position) {  
  100.             return position;  
  101.         }  
  102.           
  103.         /** 
  104.          * 获得当前选项的视图 
  105.          */  
  106.         @Override  
  107.         public View getView(int position, View convertView, ViewGroup parent) {  
  108.             //初始化一个ImageView对象  
  109.             ImageView imageView = new ImageView(MainActivity.this);  
  110.             //设置缩放方式  
  111.             imageView.setScaleType(ImageView.ScaleType.FIT_XY);  
  112.             //设置ImageView的宽高  
  113.             imageView.setLayoutParams(new Gallery.LayoutParams(180135));  
  114.             //设置IamgeView显示的图片  
  115.             imageView.setImageResource(imageIds[position]);  
  116.               
  117.             /** 
  118.              * 设置ImageView背景,这里背景使用的是android提供的一种背景风格 
  119.              * 在values/attr.xml文件中需要一下内容 
  120.              *  <declare-styleable name="Gallery"> 
  121.              *      <attr name="android:galleryItemBackground" /> 
  122.              *  </declare-styleable> 
  123.              */  
  124.             TypedArray typedArray = MainActivity.this  
  125.                     .obtainStyledAttributes(R.styleable.Gallery);  
  126.             int mGalleryItemBackground = typedArray.getResourceId(  
  127.                     R.styleable.Gallery_android_galleryItemBackground, 0);  
  128.             imageView.setBackgroundResource(mGalleryItemBackground);  
  129.               
  130.             //返回ImageView对象  
  131.             return imageView;  
  132.         }  
  133.   
  134.     }  
  135. }  

(3)我们看一下程序运行后的效果图:



(4)附上完整的android源码:

Android幻灯片式的图片浏览器
0 0
原创粉丝点击