Android模拟Windows照片查看器(15)

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


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
			
		}
		
	}

}

 

实现效果如下:


Android模拟Windows照片查看器(15)


Android模拟Windows照片查看器(15)

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

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

<!--EndFragment-->


 
 

 

<!--EndFragment-->

<!--EndFragment-->

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

相关推荐