简单图片浏览器的实现

本例程的实现界面如下：

界面所用到的组件是ImageView，不熟悉的属性是android:scaleType="centerCrop"，它的值有很多：

center  按图片的原来size居中显示，当图片长/宽超过View的长/宽，则截取图片的居中部分显示

centerCrop  按比例扩大图片的size居中显示，使得图片长(宽)等于或大于View的长(宽)

centerInside  将图片的内容完整居中显示，通过按比例缩小或原来的size使得图片长/宽等于或小于View的长/宽

fitCenter  把图片按比例扩大/缩小到View的宽度，居中显示

 fitEnd   把图片按比例扩大/缩小到View的宽度，显示在View的下部分位置

 fitStart  把图片按比例扩大/缩小到View的宽度，显示在View的上部分位置

 fitXY  把图片不按比例扩大/缩小到View的大小显示

matrix 用矩阵来绘制，动态缩小放大图片来显示。

为了实现不同状态下按钮的背景图片，用<selector>标签实现，具体如下：

<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
   <!-- 按钮按下时 ，ImageButton上显示的图片-->
    <item android:state_pressed="true" android:drawable="@drawable/preb"/>
   <!-- 正常情况下，ImageButton上显示的图片 -->
    <item android:state_pressed="false" android:drawable="@drawable/preg"/>
</selector>

界面的布局文件是：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <TextView
        android:id="@+id/showView"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello_world"/>
    <ImageView 
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:scaleType="centerCrop"
        android:src="@drawable/pic1"/>
    <LinearLayout
       	android:id="@+id/linear1" 
    	android:layout_width="fill_parent"
    	android:layout_height="wrap_content"
    	android:layout_marginTop="25dip"
    	android:orientation="horizontal">   
        <ImageButton 
        	android:id="@+id/preBut"
       		android:layout_width="wrap_content"
        	android:layout_height="wrap_content"
       		android:layout_marginLeft="30dip"
        	android:src="@drawable/selectora"/> 
        <ImageButton 
        	android:id="@+id/nextBut"
        	android:layout_width="wrap_content"
        	android:layout_height="wrap_content"
        	android:layout_marginLeft="100dip"
        	android:src="@drawable/selectorb"/> 
    </LinearLayout>
</LinearLayout>

MainActivity中的代码如下，用单独定义的类实现OnClickListener()的接口：

package com.toby.chap3_3_1;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.TextView;

public class MainActivity extends Activity {
    private ImageButton preBtn,nextBtn;
    private ImageView imageView;
    private int currentImgId=0;//记录当前ImageView中显示图片的ID
    int imgID[]={R.drawable.pic1,R.drawable.pic2,R.drawable.pic3};//存储ImageView显示的图片的ID
	@Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        imageView=(ImageView)findViewById(R.id.imageView);
        preBtn=(ImageButton)findViewById(R.id.preBut);
        nextBtn=(ImageButton)findViewById(R.id.nextBut);
        preBtn.setOnClickListener(new ButtonListener());
        nextBtn.setOnClickListener(new ButtonListener());
   }
	class ButtonListener implements OnClickListener{
		@Override
		public void onClick(View v) {
			// TODO Auto-generated method stub
			if(v==preBtn){//如果按的是上一张按钮
				currentImgId=(currentImgId-1+imgID.length)%imgID.length;//计算机图片的在数组中的下标
				imageView.setImageResource(imgID[currentImgId]);//设置ImageView显示的图片
			}
			if(v==nextBtn){//如果按的是下一张按钮
				currentImgId=(currentImgId+1)%imgID.length;//计算机图片的在数组中的下标
				imageView.setImageResource(imgID[currentImgId]);//设置ImageView显示的图片
			}
		}
	}
}