Android模拟Windows照片查看器（15）

      我们在浏览图片的时候，尤其在使用美图看看的时候，经常是打开一个图片，下面一排预览，然后点击预览的图片，图片就会显示在最中央，最具人性化的是下面的图片预览支持拖动以及案件切换，不明白的话看下列图：

这就是windows照片查看器，显示图片，左右键切换。现在我们来做一个类似的

 

看到这里就涉及到接下来我们要学到的组件了，首先，显示在最中央上面的图用到了ImageSwitcher，这里我们可以称它为图片切换大师，它涉及到很多图片的特效功能，动画特效，这里我们用到淡入淡出功能，也就是切换的时候不那么突兀消失。现在我们遍一个小实例来了解它的简单功能，这个实例就是左右切换按钮切换图片，对！就是早期windows的图片浏览器功能。

 

布局文件main.xml

 

<!--EndFragment-->
 

 

 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/LinearLayout2"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    
    tools:context=".MainActivity" >

    <ImageSwitcher
        android:id="@+id/imageSwitcher1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >
    </ImageSwitcher>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="上一张" />

        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="下一张" />

    </LinearLayout>

</LinearLayout>

 

不出乎意料，一个图片切换大师加两个button

这里有一个很重要的格式工厂。

this.imageswitch.setFactory(new ViewFactoryImpl());//用于2图切换的转换操作

android.widget.ViewSwitcher.ViewFactory;图片切换要用到这个的接口的支持，在刚开始学安卓时，很多人也有这样的疑问，很多人会觉得这是个小白问题，就是我何必要那么麻烦用工厂转换我直接用ImageView.setImageResources换图不就可以了么，其实小编刚开始学也有这样的疑问，还以身犯险去试了一下，结果很悲剧的报错了，发现是NullPointerException,也就是空指针异常，也就是说必须用到setFactory（）方法，其实整个UI界面就是一个主线程，如果不用事件处理你的改变相当于一个子线程，线程冲突，这与后面学到的通信有异曲同工之妙，当然这是小编理解之一，如果找到更好的理解会同步更新。

接下来java代码：

 

 

public class MainActivity extends Activity {

	private ImageSwitcher imageswitch=null;
	private Button  previous=null;
	private Button  next=null;
	private int[] image=new int[]{
			R.drawable.a1,R.drawable.a2,R.drawable.a3,R.drawable.a4
	};
	private int foot=0;
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		this.imageswitch=(ImageSwitcher)super.findViewById(R.id.imageSwitcher1);
		this.previous=(Button)super.findViewById(R.id.button1);
		this.next=(Button)super.findViewById(R.id.button2);
		this.imageswitch.setFactory(new ViewFactoryImpl());//用于2图切换的转换操作
		//设置图片进入进出特效动画
		this.imageswitch.setInAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_in));
		this.imageswitch.setOutAnimation(AnimationUtils.loadAnimation(this, android.R.anim.fade_out));
		this.imageswitch.setImageResource(image[foot++]);
		this.previous.setOnClickListener(new Previouslistener());
		this.next.setOnClickListener(new Nextlistener());
		
		
	}
	private class Previouslistener implements OnClickListener{

		@Override
		public void onClick(View arg0) {
		MainActivity.this.imageswitch.setImageResource(image[foot--]);
		MainActivity.this.checkButEnable();
			
		}
		
	}
	private class Nextlistener implements OnClickListener{

		@Override
		public void onClick(View arg0) {
			MainActivity.this.imageswitch.setImageResource(image[foot++]);
			MainActivity.this.checkButEnable();
				
			
		}
		
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

	public void checkButEnable() {
		// TODO Auto-generated method stub
		if(foot<image.length-1){
			this.next.setEnabled(true);
		}
		else{
			this.next.setEnabled(false);
		}
		if(foot==0){
			this.previous.setEnabled(false);
		}
		else{
			this.previous.setEnabled(true);
		}
		
		
	}
	private class ViewFactoryImpl implements ViewFactory{

		@Override
		public View makeView() {
			ImageView imageview=new ImageView(MainActivity.this);
			imageview.setBackgroundColor(0xFFFFFFFF);//设置背景
			imageview.setScaleType(ImageView.ScaleType.CENTER);//居中
			//自适应图片
			imageview.setLayoutParams(new ImageSwitcher.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));
			
			
			return imageview;
			// TODO Auto-generated method stub
			
		}
		
	}

}

 

 

 

实现效果如下：

 

 

 

这里由于图片放的较小导致预览效果不是特别好，大家可以对应放大一点图片

 

接下来的美图看看阅览器我们将看到ImageSwitcher图片切换大师和Gallery拖拉图片大师的结合将产生怎样的火花

<!--EndFragment-->

 
 

 

 

<!--EndFragment-->

 

<!--EndFragment-->

<!--EndFragment--><!--EndFragment-->