Android中通过ImageSwitcher实现相册滑动查看照片功能(附代码下载)
场景
效果
注:
博客:
关注公众号
霸道的程序猿
获取编程相关电子书、教程推送与免费下载。
实现
将需要滚动查看的照片复制到res/drawable下
这里只准备了两张bg01.jpg和bg02.jpg
在滚动时需要用到左进右出和左出右进的动画,所以在res下新建anim目录,在目录下新建四种动画的xml文件
具体代码参照示例代码。
然后打开布局文件activity_image_switcher.xml
将布局修改为相对布局relativelayout,并添加一个imageswitcher,设置其id属性。
<?xml version="1.0" encoding="utf-8"?> <relativelayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".imageswitcheractivity"> <imageswitcher android:id="@+id/imageswitcher" android:layout_width="match_parent" android:layout_height="match_parent"/> </relativelayout>
然后来到imageswitcheractivity
首先声明一些私有变量,用来存储照片资源数组、数组索引、鼠标放下和离开的x坐标等。
//图片资源数组 private int[] arraypicture = new int[]{ r.drawable.bg01,r.drawable.bg02 }; private imageswitcher imageswitcher; private int index; private float touchdowmx; private float touchupx;
然后通过id获取imageswitcher并设置其视图工厂
//获取imageswitch imageswitcher =(imageswitcher) findviewbyid(r.id.imageswitcher); //设置视图工厂 imageswitcher.setfactory(new viewswitcher.viewfactory() { @override public view makeview() { imageview imageview = new imageview(imageswitcheractivity.this); imageview.setimageresource(arraypicture[index]); return imageview; } });
然后设置imageswitcher的触碰的监听器
通过
event.getaction() == motionevent.action_down
判断如果是鼠标按下,则记录鼠标按下时的坐标。
否则通过
event.getaction() ==motionevent.action_up
判断如果是鼠标抬起,则记录抬起时的x坐标。
此时再通过
touchupx-touchdowmx >100
即抬起时的x坐标减去落下时的x坐标大于100则认为是从左往右滑动。
此时图片的索引通过三目表达式进行判断。
index = index==0?arraypicture.length-1:index-1;
如果当前索引为0,即为第一张照片时,则从左往右滑动后,应该是最后一张照片,即照片索引为图片数组的长度减一。
然后通过
imageswitcher.setinanimation(animationutils.loadanimation(imageswitcheractivity.this, r.anim.slide_in_left));
设置左边滑进的动画
再通过
imageswitcher.setoutanimation(animationutils.loadanimation(imageswitcheractivity.this, r.anim.slide_out_right));
设置右边滑出的动画
最后通过
imageswitcher.setimageresource(arraypicture[index]);
设置图片索引。
同理如果通过
touchdowmx - touchupx >100
则认为是从右往左滑。
同样通过三目表达式
index = index==arraypicture.length -1?0:index+1;
如果是最后一张照片,即索引为数组的长度 -1 ,则再往左滑 该是第一张照片,即索引为0 否则就索引+1。
然后通过
imageswitcher.setinanimation(animationutils.loadanimation(imageswitcheractivity.this, r.anim.slide_in_right));
设置右边滑进的动画
再通过
imageswitcher.setoutanimation(animationutils.loadanimation(imageswitcheractivity.this, r.anim.slide_out_left));
设置左边滑出的动画
最后通过
imageswitcher.setimageresource(arraypicture[index]);
设置图片
完整示例代码
package com.badao.relativelayouttest; import androidx.appcompat.app.appcompatactivity; import android.os.bundle; import android.view.motionevent; import android.view.view; import android.view.animation.animationutils; import android.widget.imageswitcher; import android.widget.imageview; import android.widget.viewswitcher; public class imageswitcheractivity extends appcompatactivity { //图片资源数组 private int[] arraypicture = new int[]{ r.drawable.bg01,r.drawable.bg02 }; private imageswitcher imageswitcher; private int index; private float touchdowmx; private float touchupx; @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_image_switcher); //获取imageswitch imageswitcher =(imageswitcher) findviewbyid(r.id.imageswitcher); //设置视图工厂 imageswitcher.setfactory(new viewswitcher.viewfactory() { @override public view makeview() { imageview imageview = new imageview(imageswitcheractivity.this); imageview.setimageresource(arraypicture[index]); return imageview; } }); //设置imageswitcher 触碰监听器 imageswitcher.setontouchlistener(new view.ontouchlistener() { @override public boolean ontouch(view v, motionevent event) { //如果是鼠标按下 if(event.getaction() == motionevent.action_down) { //记录按下时的x坐标 touchdowmx = event.getx(); return true; }else if(event.getaction() ==motionevent.action_up) //如果是鼠标抬起 { //记录抬起时的x坐标 touchupx = event.getx(); //如果是从左向右滑动 if(touchupx-touchdowmx >100) { //如果是第一张图片则从左向右滑后下标是数组的长度-1,即最后一张,如果不是则索引-1 index = index==0?arraypicture.length-1:index-1; //设置左边滑进的动画 imageswitcher.setinanimation(animationutils.loadanimation(imageswitcheractivity.this, r.anim.slide_in_left)); //设置右边滑出的动画 imageswitcher.setoutanimation(animationutils.loadanimation(imageswitcheractivity.this, r.anim.slide_out_right)); //设置图片索引 imageswitcher.setimageresource(arraypicture[index]); } //否则认为是从右往左滑 else if(touchdowmx - touchupx >100) { //如果是最后一张照片,即索引为数组的长度 -1 ,则再往左滑 该是第一张照片,即索引为0 否则就索引+1 index = index==arraypicture.length -1?0:index+1; //设置右边滑进的动画 imageswitcher.setinanimation(animationutils.loadanimation(imageswitcheractivity.this, r.anim.slide_in_right)); //设置左边滑出的动画 imageswitcher.setoutanimation(animationutils.loadanimation(imageswitcheractivity.this, r.anim.slide_out_left)); //设置图片索引 imageswitcher.setimageresource(arraypicture[index]); } } return false; } }); } }
示例代码下载
关注公众号:
霸道的程序猿
回复:
android相册滑动代码
下一篇: MySql 部分字段去重