场景

效果

注:

博客:
https://blog.csdn.net/badao_liumang_qizhi
关注公众号
霸道的程序猿
获取编程相关电子书、教程推送与免费下载。

实现

将需要滚动查看的照片复制到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 >

即抬起时的X坐标减去落下时的X坐标大于100则认为是从左往右滑动。

此时图片的索引通过三目表达式进行判断。

index = index==?arrayPicture.length-:index-;

如果当前索引为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 >

则认为是从右往左滑。

同样通过三目表达式

index = index==arrayPicture.length -?:index+;

如果是最后一张照片,即索引为数组的长度 -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 >)
{
//如果是第一张图片则从左向右滑后下标是数组的长度-1,即最后一张,如果不是则索引-1
index = index==?arrayPicture.length-:index-;
//设置左边滑进的动画
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 >)
{
//如果是最后一张照片,即索引为数组的长度 -1 ,则再往左滑 该是第一张照片,即索引为0 否则就索引+1
index = index==arrayPicture.length -?:index+;
//设置右边滑进的动画
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相册滑动代码

Android中通过ImageSwitcher实现相册滑动查看照片功能(附代码下载)的更多相关文章

  1. Android中四种补间动画的使用示例(附代码下载)

    场景 Android中四种补间动画. 透明度渐变动画 旋转动画 缩放动画 平移动画 注: 博客: https://blog.csdn.net/badao_liumang_qizhi关注公众号 霸道的程 ...

  2. Android 中 DrawerLayout + ViewPager 怎么解决滑动冲突?

    DrawerLayout 是 Android 官方的侧滑菜单控件,而 ViewPager 相信大家都很熟悉了.今天这里就讲一下当在 DrawerLayout 中嵌套 ViewPager 时,要如何解决 ...

  3. JPA中实现双向多对多的关联关系(附代码下载)

    场景 JPA入门简介与搭建HelloWorld(附代码下载): https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/103473937 ...

  4. 浅谈Android中拍照、从相册选择图片并截图相关知识点

    前言 我们在Android开发中经常会需要使用相机或者从相册中选取图片的情况,今天就把这里面相关的知识点总结下,方便以后开发的时候使用. 1.相机拍照并可自定义截图功能 我们先来看如何使用Intent ...

  5. Android中通过访问本地相册或者相机设置用户头像

    目前几乎所有的APP在用户注册时都会有设置头像的需求,大致分为三种情况: (1)通过获取本地相册的图片,经过裁剪后作为头像. (2)通过启动手机相机,现拍图片然后裁剪作为头像. (3)在APP中添加一 ...

  6. Android中使用GridView和ImageViewSwitcher实现电子相册简单功能

    我们在手机上查看相册时,首先看到的是网格状的图片展示界面,然后我们选择想要欣赏的照片点击进入,这样就可以全屏观看该照片,并且可以通过左右滑动来切换照片.如下图的显示效果: 首先我们先罗列一下本次实现所 ...

  7. Android中获取网页表单中的数据实现思路及代码

    在Android中获取网页里表单中的数据具体实现代码如下,感兴趣的各位可以参考过下哈,希望对大家有所帮助 MainActivity如下: 复制代码 代码如下: package cn.testjavas ...

  8. Android中实现一个简单的逐帧动画(附代码下载)

    场景 Android中的逐帧动画,就是由连续的一张张照片组成的动画. 效果 注: 博客: https://blog.csdn.net/badao_liumang_qizhi 关注公众号 霸道的程序猿 ...

  9. Android 一s个相对完整的自动升级功能实现代码

    由于项目的需要最近做了一个关于Android自动升级的功能,下面将贴出Android手机客户端的完整代码.这段代码参考别的代码居多,由于不满足需求,所以自己仅仅改了一些需要变动的内容,其他功能都是按照 ...

随机推荐

  1. Windows10 java环境配置

    1.下载 JDK 下载地址:https ://www.oracle.com/technetwork/java/javase/downloads/index-jsp-138363.html 点击下载按钮 ...

  2. 学习 lind api 十月 第5弹

    继续 四弹里的 自定义的api response message 但是 那上面的 那些值得也是包含

  3. jade 的 考古

    Jade是一款高性能简洁易懂的模板引擎(加上这两个字我想起了发动机,为什么不直接叫发动机呢), Jade是Haml的Javascript实现, 在服务端(NodeJS)及客户端均有支持. haml 是 ...

  4. 个人第4次作业——alpha项目测试

    这个作业属于哪个课程 http://edu.cnblogs.com/campus/xnsy/GeographicInformationScience 这个作业的要求在哪里 https://www.cn ...

  5. 1.Vue初始及相关Vue核心组件

    1.Vue官方文档 官网文档:https://cn.vuejs.org/v2/guide/ 2.Vue-cli官方文档(脚手架) 官网文档:https://cli.vuejs.org/zh/guide ...

  6. 富文本编辑器、全文检索和django发送邮件

    1.富文本编辑器 1.1快速了解 借助富文本编辑器,网站的编辑人员能够像使用offfice一样编写出漂亮的.所见即所得的页面.此处以tinymce为例,其它富文本编辑器的使用也是类似的. 在虚拟环境中 ...

  7. CTF--HTTP服务--暴力破解

    开门见山 1. 扫描靶机ip,发现PCS 192.168.1.103 2. 用nmap扫描靶机开放服务和服务版本 3. 再扫描全部信息 4. 用nikto探测敏感文件 5. 打开敏感网页发掘信息 6. ...

  8. ElasticSearch系列专栏

    最近我们公司因业务发展较快,不少服务遇到了一些瓶颈,影响最大的就是数据量的暴增带来的搜索效率的问题.虽然建立索引以及利用好缓存可以有效地缓解该问题,但是随着业务的发展,业务的复杂度也逐渐提升,原有的技 ...

  9. 使用H5与webGL的3D 可视化地铁展示

    前言 工业互联网,物联网,可视化等名词在我们现在信息化的大背景下已经是耳熟能详,日常生活的交通,出行,吃穿等可能都可以用信息化的方式来为我们表达,在传统的可视化监控领域,一般都是基于 Web SCAD ...

  10. 图像GIST特征和LMGIST包的python实现(有github)

    1什么是Gist特征        (1) 一种宏观意义的场景特征描述        (2) 只识别"大街上有一些行人"这个场景,无需知道图像中在那些位置有多少人,或者有其他什么对 ...