类似支付宝的view点击效果透明度变化

原创 2016年08月29日 16:10:29

先上两个截图,如下:

支付宝: 


QQ:


如上两图用红色框框住的部分,当手纸按压时,图片透明度发生变化,但是背景颜色没有变化,这和我们平常所用的控件按压效果不太一样,但是要做到这种效果也不难,我们可以让美工做两套图片出来,然后设置正常状态和按压状态时的图片即可, 但是这样会造成应用的包体积很大,毕竟有很多地方都需要这种效果,不是首选之法。第二种方式是利用ImageView的tint属性即可达到这样效果,在xml文件中使用:android:tint =" ”或者在java代码中使用ImageView.setColorFilter();  ImageView的这个方法的作用就是给src中的图片加上一层遮罩层,再经过一些触摸事件的处理就能实现类似支付宝或者QQ中的效果。

下面直接给出一个我自己写的工具类,然后就可以一行代码实现这种效果,代码如下:

package com.lanma.conveniencecar.utils;

import android.graphics.Color;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;

/**
 * 作者 qiang_xi on 2016/8/29 14:12.
 * view初始化完毕之后,建议在onCreate方法里调用 ImageViewTintUtil.setImageViewTint((ImageView) findViewById(R.id.xx));即可
 */
public class ImageViewTintUtil {

    public static void setImageViewtint(final ImageView imageView, final int color) {
        imageView.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                int action = event.getAction();
                switch (action) {
                    case MotionEvent.ACTION_DOWN:
                        imageView.setColorFilter(color);
                        break;
                    case MotionEvent.ACTION_UP:
                        imageView.setColorFilter(null);
                        break;
                }
                //这里一定要return false,不然该方法会拦截事件,造成不能响应点击等操作
                return false;
            }
        });
    }

    public static void setImageViewTint(final ImageView imageView) {
        imageView.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                int action = event.getAction();
                switch (action) {
                    case MotionEvent.ACTION_DOWN:
                        imageView.setColorFilter(Color.parseColor("#89DBFA"));
                        break;
                    case MotionEvent.ACTION_UP:
                        imageView.setColorFilter(null);
                        break;
                }
                //这里一定要return false,不然该方法会拦截事件,造成不能响应点击等操作
                return false;
            }
        });
    }
}

注意事项:

已经在代码中表明的很清楚了,即一定要返回false,不然onTouch方法会拦截事件,导致ACTION_DOWN、ACTION_UP、ACTION_MOVE等一系列事件不再传递到ImageView的onTouchEvent()方法,进而造成不能响应点击事件等问题!!!

版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

Android 自定义View 模仿豆瓣App加载中Loading(也类似支付宝AppLoading)

下面是虚拟机中豆瓣App的gif录制图示: 下面是效果: 思路见完整代码:package com.louisgeek.louiscustomviewstudy;import android.ani...

android 类似于支付宝咻咻咻界面的按钮波纹效果

放支付宝咻咻咻的那个波纹按钮

CSS鼠标点击式变化图片透明度

今天分享前端代码主题:jequery控制css图片透明度 很多时候在网站图片处理上需要实现一些辅助效果,比如鼠标在图片上滑动时或点击时改变图片颜色(变灰或者其他),其实一个简单的办法就是改变图片cs...

android实现类似于支付宝余额快速闪动的效果

效果如下: 此图片不会动,但实际上是会快速跳动的。 之前看到有支付宝的效果非常牛逼。就是进去看到余额呼噜噜的直接上蹿下跳到具体数字,效果帅,但不知道怎么实现,最近终于知道了。 思路: ...

一个可以实时显示进度的自定义view,类似于listview中音乐播放背景变化的效果

package progresslayoutdemo.wjj.com.progresslayoutdemo; import android.annotation.TargetApi; im...

自定义View系列(1)--仿支付宝中物流状态效果

国际惯例,先上支付宝中的原效果图:                                                                                  ...

Android在xml中设置组件风格(圆角,点击效果selector,边框,进度条风格,动画)TextView文字透明度

在标题中写到的组件的特效,都是在xml中为组件定义的 步骤: 1.在drawable下创建“Drawable resource file”,命名为:btn_corners(表示功能:圆角button)...

自定义View点击动画效果

  • 2016年08月17日 13:54
  • 191KB
  • 下载

android按钮被点击文字颜色变化效果

有的时候做应用需要点击按钮时文字颜色也跟着变,松开后又还原,目前发现两种解决方案:第一用图片,如果出现的地方比较多,那么图片的量就相当可观;第二,也就是本文讲到的。废话少说,先贴图片,再上代码。 正...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:类似支付宝的view点击效果透明度变化
举报原因:
原因补充:

(最多只允许输入30个字)