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