热门标签 | HotTags
当前位置:  开发笔记 > Android > 正文

Android实现一个比相册更高大上的左右滑动特效(附源码)

这篇文章主要介绍了Android实现一个比相册更高大上的左右滑动特效(附源码),本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

在Android里面,想要实现一个类似相册的左右滑动效果,我们除了可以用Gallery、HorizontalScrollView、ViewPager等控件,还可以用一个叫做 ViewFlipper 的类来代替实现,它继承于 ViewAnimator。如见其名,这个类是跟动画有关,会将添加到它里面的两个或者多个View做一个动画,然后每次只显示一个子View,通过在 View 之间切换时执行动画,最终达到一个类似相册能左右滑动的效果。

本次功能要实现的两个基本效果

  • 最基本的左右滑动效果
  • 从屏幕的45度方向进入和退出的效果

实现思路

  • 按照 ViewFlipper 的源码说明,它是将两个或多个View用动画展示出来。那么我就在 ViewFlipper 内放入两个布局,每个布局都包含一个 TextView 和 ImageView,分别用于显示文字和图片
  • 既然要有动画效果,我准备使用Android的位移动画类 TranslateAnimation,设置起始的横纵坐标值
  • 为了让效果明显,我会设置 ViewFlipper 的进入和退出屏幕的动画,并且在左滑时呈现一个动画、右滑时呈现另一个动画(需要判断是左滑还是右滑:重写 onTouchEvent 方法,比较横坐标X的值的变化)

源码如下:

1、主Activity

// import语句省略
public class ViewFlipperDemo extends Activity {
  private static final String TAG = "ViewFlipperDemo";

  private ViewFlipper mViewFlipper;
  private float mOldTouchValue;

  @Override
  protected void onCreate(Bundle onSavedInstance) {
    super.onCreate(onSavedInstance);

    // 设置为全屏
    getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
    requestWindowFeature(Window.FEATURE_NO_TITLE);
    setContentView(R.layout.view_flipper_demo);
    mViewFlipper = findViewById(R.id.viewFlipper1);
  }

  @Override
  public boolean onTouchEvent(MotionEvent event) {
    switch (event.getAction()) {
      case MotionEvent.ACTION_DOWN:
        mOldTouchValue = event.getX();
        break;

        case MotionEvent.ACTION_UP:
          float currentX = event.getX();

          // 手指向右滑动: 手指向右滑动时横坐标 X 的值会变大,因此 currentX 的值更大
          if (mOldTouchValue  currentX) {

            // 进入屏幕的动效
            mViewFlipper.setInAnimation(AnimationHelper.inFromRightAnimation());

            // 退出屏幕的动效
            mViewFlipper.setOutAnimation(AnimationHelper.outToLeftAnimation());
            mViewFlipper.showPrevious();
          }
          break;

        default:
          break;
    }
    return super.onTouchEvent(event);
  }
}

2、对应的布局文件 view_flipper_demo.xml



  

  

    

      

      

    

    

      

      

    

  

3、动画辅助类 AnimationHelper.java

public class AnimationHelper {

  // 左滑的进入动画
  public static Animation inFromRightAnimation() {
    Animation inFromRight = new TranslateAnimation(
        Animation.RELATIVE_TO_PARENT,
        1.0f,
        Animation.RELATIVE_TO_PARENT,
        0.0f,
        Animation.RELATIVE_TO_PARENT,
        0.0f,
        Animation.RELATIVE_TO_PARENT,
        0.0f);
    inFromRight.setDuration(500);
    inFromRight.setInterpolator(new AccelerateInterpolator());
    return inFromRight;
  }

  // 左滑的退出动画
  public static Animation outToLeftAnimation() {
    Animation outToLeft = new TranslateAnimation(
        Animation.RELATIVE_TO_PARENT,
        0.0f,
        Animation.RELATIVE_TO_PARENT,
        -1.0f,
        Animation.RELATIVE_TO_PARENT,
        0.0f,
        Animation.RELATIVE_TO_PARENT,
        0.0f);
    outToLeft.setDuration(500);
    outToLeft.setInterpolator(new AccelerateInterpolator());
    return outToLeft;
  }

  // 右滑的进入动画
  public static Animation inFromLeftAnimation() {
    Animation inFromLeft = new TranslateAnimation(
        Animation.RELATIVE_TO_PARENT,
        -1.0f,
        Animation.RELATIVE_TO_PARENT,
        0.0f,
        Animation.RELATIVE_TO_PARENT,
        0.0f,
        Animation.RELATIVE_TO_PARENT,
        0.0f);
    inFromLeft.setDuration(500);
    inFromLeft.setInterpolator(new AccelerateInterpolator());
    return inFromLeft;
  }

  // 右滑的退出动画
  public static Animation outToRightAnimation() {
    Animation outToRight = new TranslateAnimation(
        Animation.RELATIVE_TO_PARENT,
        0.0f,
        Animation.RELATIVE_TO_PARENT,
        1.0f,
        Animation.RELATIVE_TO_PARENT,
        0.0f,
        Animation.RELATIVE_TO_PARENT,
        0.0f);
    outToRight.setDuration(500);
    outToRight.setInterpolator(new AccelerateInterpolator());
    return outToRight;
  }
}

4、对应的效果图如下

可以看到,这个左右滑动效果没有任何酷炫的地方。我们不妨先来看看跟动画相关的几个重点地方:

(1)函数 setInAnimation:是指 View 进入屏幕的动效

(2)函数 setOutAnimation:是指 View 退出屏幕的动效

(3)TranslateAnimation的构造函数的参数解释:

1、fromXType/toXType/fromYType/toYType,取值共有三个:

Animation.ABSOLUTEAnimation.RELATIVE_TO_SELFAnimation.RELATIVE_TO_PARENT

我这里用的是 Animation.RELATIVE_TO_PARENT,当传入该参数时,其余几个坐标值需要传入百分比参数(1.0表示100%);如果传入 Animation.ABSOLUTE,坐标值需要传入屏幕上的绝对位置(比如1000,1000)

2、fromXValue:起点的横坐标值

3、toXValue:终点的横坐标值

4、fromYValue:起点的纵坐标值

5、toYValue:终点的纵坐标值

如果我们想让这个效果变成45度从屏幕的四个角进入和退出,那代码就应该这么写(注意代码中传入的 4 个横纵坐标值):

// 左滑的进入动画
public static Animation inFromRightAnimation() {
  Animation inFromRight = new TranslateAnimation(
      Animation.RELATIVE_TO_PARENT,
      1.0f,
      Animation.RELATIVE_TO_PARENT,
      0.0f,
      Animation.RELATIVE_TO_PARENT,
      -1.0f,
      Animation.RELATIVE_TO_PARENT,
      0.0f);
  inFromRight.setDuration(500);
  inFromRight.setInterpolator(new AccelerateInterpolator());
  return inFromRight;
}

// 左滑的退出动画
public static Animation outToLeftAnimation() {
  Animation outToLeft = new TranslateAnimation(
      Animation.RELATIVE_TO_PARENT,
      0.0f,
      Animation.RELATIVE_TO_PARENT,
      -1.0f,
      Animation.RELATIVE_TO_PARENT,
      0.0f,
      Animation.RELATIVE_TO_PARENT,
      1.0f);
  outToLeft.setDuration(500);
  outToLeft.setInterpolator(new AccelerateInterpolator());
  return outToLeft;
}

// 右滑的进入动画
public static Animation inFromLeftAnimation() {
  Animation inFromLeft = new TranslateAnimation(
      Animation.RELATIVE_TO_PARENT,
      -1.0f,
      Animation.RELATIVE_TO_PARENT,
      0.0f,
      Animation.RELATIVE_TO_PARENT,
      -1.0f,
      Animation.RELATIVE_TO_PARENT,
      0.0f);
  inFromLeft.setDuration(500);
  inFromLeft.setInterpolator(new AccelerateInterpolator());
  return inFromLeft;
}

// 右滑的退出动画
public static Animation outToRightAnimation() {
  Animation outToRight = new TranslateAnimation(
      Animation.RELATIVE_TO_PARENT,
      0.0f,
      Animation.RELATIVE_TO_PARENT,
      1.0f,
      Animation.RELATIVE_TO_PARENT,
      0.0f,
      Animation.RELATIVE_TO_PARENT,
      1.0f);
  outToRight.setDuration(500);
  outToRight.setInterpolator(new AccelerateInterpolator());
  return outToRight;
}

对应的效果如下:

之所以有 -1.0f 这个值,是因为屏幕上的横纵坐标值的分布可以用如下象限来表示:

ViewFlipper中的 View 就位于象限的中心位置。因此,如果动画从左上角进入,那么它的起始横纵坐标就是(-1,-1)。大家可以按照这个思路去实现自己想要的动效。

到此这篇关于Android实现一个比相册更高大上的左右滑动特效(附源码)的文章就介绍到这了,更多相关android 实现左右滑动特效内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!


推荐阅读
  • Android LED 数字字体的应用与实现
    本文介绍了一种适用于 Android 应用的 LED 数字字体(digital font),并详细描述了其在 UI 设计中的应用场景及其实现方法。这种字体常用于视频、广告倒计时等场景,能够增强视觉效果。 ... [详细]
  • 优化ListView性能
    本文深入探讨了如何通过多种技术手段优化ListView的性能,包括视图复用、ViewHolder模式、分批加载数据、图片优化及内存管理等。这些方法能够显著提升应用的响应速度和用户体验。 ... [详细]
  • RecyclerView初步学习(一)
    RecyclerView初步学习(一)ReCyclerView提供了一种插件式的编程模式,除了提供ViewHolder缓存模式,还可以自定义动画,分割符,布局样式,相比于传统的ListVi ... [详细]
  • 本文介绍了如何利用JavaScript或jQuery来判断网页中的文本框是否处于焦点状态,以及如何检测鼠标是否悬停在指定的HTML元素上。 ... [详细]
  • 本文详细介绍了如何在Linux系统上安装和配置Smokeping,以实现对网络链路质量的实时监控。通过详细的步骤和必要的依赖包安装,确保用户能够顺利完成部署并优化其网络性能监控。 ... [详细]
  • 本文探讨了 RESTful API 和传统接口之间的关键差异,解释了为什么 RESTful API 在设计和实现上具有独特的优势。 ... [详细]
  • 本文详细介绍了如何使用Spring Boot进行高效开发,涵盖了配置、实例化容器以及核心注解的使用方法。 ... [详细]
  • 本文详细介绍了Java编程语言中的核心概念和常见面试问题,包括集合类、数据结构、线程处理、Java虚拟机(JVM)、HTTP协议以及Git操作等方面的内容。通过深入分析每个主题,帮助读者更好地理解Java的关键特性和最佳实践。 ... [详细]
  • Python自动化处理:从Word文档提取内容并生成带水印的PDF
    本文介绍如何利用Python实现从特定网站下载Word文档,去除水印并添加自定义水印,最终将文档转换为PDF格式。该方法适用于批量处理和自动化需求。 ... [详细]
  • 在当前众多持久层框架中,MyBatis(前身为iBatis)凭借其轻量级、易用性和对SQL的直接支持,成为许多开发者的首选。本文将详细探讨MyBatis的核心概念、设计理念及其优势。 ... [详细]
  • 将Web服务部署到Tomcat
    本文介绍了如何在JDeveloper 12c中创建一个Java项目,并将其打包为Web服务,然后部署到Tomcat服务器。内容涵盖从项目创建、编写Web服务代码、配置相关XML文件到最终的本地部署和验证。 ... [详细]
  • XNA 3.0 游戏编程:从 XML 文件加载数据
    本文介绍如何在 XNA 3.0 游戏项目中从 XML 文件加载数据。我们将探讨如何将 XML 数据序列化为二进制文件,并通过内容管道加载到游戏中。此外,还会涉及自定义类型读取器和写入器的实现。 ... [详细]
  • 本文介绍如何在 Unity 的 XML 配置文件中,将参数传递给自定义生命周期管理器的构造函数。我们将详细探讨 CustomLifetimeManager 类的实现及其配置方法。 ... [详细]
  • 本文详细介绍了 Java 中 org.apache.xmlbeans.SchemaType 类的 getBaseEnumType() 方法,提供了多个代码示例,并解释了其在不同场景下的使用方法。 ... [详细]
  • 本文详细介绍了如何解决MyBatis中常见的BindingException错误,提供了多种排查和修复方法,确保Mapper接口与XML文件的正确配置。 ... [详细]
author-avatar
手机用户2602939201
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有