Android:通过滤镜实现点击图片变暗效果

实现点击图片(ImageView)变暗效果,有一个较简单的方法,就是讲目标图片设置为背景图片(setBackground),再创建一个selector.xml文件,里面放置一张普通状态时的透明图片,一张点击状态下的棕色半透明图片,将其设置为ImageView的源图片。这样在点击ImageView时,源图片会变换透明度,达到变暗效果。但这种方法有个缺点:由于源图片已经被限制死了,假如我们需要自定义背景图片,将目标图片放置在背景图片上,就无法实现了。这里介绍一种通过滤镜和监听onTouchEvent事件来达到变暗效果的方法。

源码如下:

import android.content.Context;
import android.graphics.Color;
import android.graphics.PorterDuff;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.ImageView;

/**
 * @ClassName: ThumbnailView
 * @Description:  点击时显示明暗变化(滤镜效果)的ImageView
 * @author LinJ
 * @date 2015-1-6 下午2:13:46
 *
 */
public class ThumbnailView extends ImageView{

    public ThumbnailView(Context context, AttributeSet attrs) {
        super(context, attrs);
        // TODO Auto-generated constructor stub
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getActionMasked()) {
        case MotionEvent.ACTION_DOWN:
            //在按下事件中设置滤镜
            setFilter();
            break;
        case MotionEvent.ACTION_UP:
            //由于捕获了Touch事件,需要手动触发Click事件
            performClick();
        case MotionEvent.ACTION_CANCEL:
            //在CANCEL和UP事件中清除滤镜
            removeFilter();
            break;
        default:
            break;
        }
        return true;
    }

    /**
     *   设置滤镜
     */
    private void setFilter() {
        //先获取设置的src图片
        Drawable drawable=getDrawable();
        //当src图片为Null,获取背景图片
        if (drawable==null) {
            drawable=getBackground();
        }
        if(drawable!=null){
            //设置滤镜
            drawable.setColorFilter(Color.GRAY,PorterDuff.Mode.MULTIPLY);;
        }
    }
    /**
     *   清除滤镜
     */
    private void removeFilter() {
        //先获取设置的src图片
        Drawable drawable=getDrawable();
        //当src图片为Null,获取背景图片
        if (drawable==null) {
            drawable=getBackground();
        }
        if(drawable!=null){
            //清除滤镜
            drawable.clearColorFilter();
        }
    }

}

通过监听Down事件设置滤镜,监听Up和Cancel事件去掉滤镜,以此达到图片变暗效果。但是这个方法也有个很麻烦的缺点:由于拦截了Touch事件,会导致onClick和onLongClick事件还有其他很多事件都无法正常触发,如上述代码所示需要手动触发Click事件。当该View是作为ListView的内部View时,情况将更加麻烦,因此要慎用,在需要复杂交互的情况下最好别用这种方法。

修改添加长按事件:

package com.linj.camera.view;

import android.content.Context;
import android.graphics.Color;
import android.graphics.PorterDuff;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.widget.ImageView;

/**
 * @ClassName: FilterImageView
 * @Description:  点击时显示明暗变化(滤镜效果)的ImageView
 * @author LinJ
 * @date 2015-1-6 下午2:13:46
 *
 */
public class FilterImageView extends ImageView implements GestureDetector.OnGestureListener{

    /**   监听手势*/
    private GestureDetector mGestureDetector;
    public FilterImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
        mGestureDetector=new GestureDetector(context, this);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        //在cancel里将滤镜取消,注意不要捕获cacncel事件,mGestureDetector里有对cancel的捕获操作
         //在滑动GridView时,AbsListView会拦截掉Move和UP事件,直接给子控件返回Cancel
        if(event.getActionMasked()== MotionEvent.ACTION_CANCEL){
            removeFilter();
        }
        return mGestureDetector.onTouchEvent(event);
    }

    /**
     *   设置滤镜
     */
    private void setFilter() {
        //先获取设置的src图片
        Drawable drawable=getDrawable();
        //当src图片为Null,获取背景图片
        if (drawable==null) {
            drawable=getBackground();
        }
        if(drawable!=null){
            //设置滤镜
            drawable.setColorFilter(Color.GRAY,PorterDuff.Mode.MULTIPLY);;
        }
    }
    /**
     *   清除滤镜
     */
    private void removeFilter() {
        //先获取设置的src图片
        Drawable drawable=getDrawable();
        //当src图片为Null,获取背景图片
        if (drawable==null) {
            drawable=getBackground();
        }
        if(drawable!=null){
            //清除滤镜
            drawable.clearColorFilter();
        }
    }

    @Override
    public boolean onDown(MotionEvent e) {
        setFilter();
        //这里必须返回true,表示捕获本次touch事件
        return true;
    }

    @Override
    public void onShowPress(MotionEvent e) {
        // TODO Auto-generated method stub

    }

    @Override
    public boolean onSingleTapUp(MotionEvent e) {
        removeFilter();
        performClick();
        return false;
    }

    @Override
    public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
            float distanceY) {
        // TODO Auto-generated method stub
        return false;
    }

    @Override
    public void onLongPress(MotionEvent e) {
        //长安时,手动触发长安事件
        performLongClick();
    }

    @Override
    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
            float velocityY) {
        // TODO Auto-generated method stub
        return false;
    }
}
时间: 2024-10-19 01:06:56

Android:通过滤镜实现点击图片变暗效果的相关文章

Android 仿微信朋友圈点击图片变暗

package cn.eoe.leigo.view; import android.content.Context; import android.graphics.Bitmap; import android.graphics.Canvas; import android.graphics.Paint; import android.graphics.RectF; import android.graphics.drawable.BitmapDrawable; import android.g

Android的GridView控件点击图片变暗效果

@Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); grid = (GridView) findViewById(R.id.grid); grid.setAdapter(new GridAdapter()); grid.setOnItemClickListener(new OnI

Android 自定义 ViewPager 打造千变万化的图片切换效果

Android 自定义 ViewPager 打造千变万化的图片切换效果 标签: Android自定义ViewPagerJazzyViewPager 目录(?)[+] 转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/38026503 记 得第一次见到ViewPager这个控件,瞬间爱不释手,做东西的主界面通通ViewPager,以及图片切换也抛弃了ImageSwitch之类的,开 始让ViewPager来做.时间长了,ViewPa

Button按钮点击图片切换效果

Button按钮图片切换效果设置. 通常在工程中用到图片按钮点击事件,大多都用ImageButton.在这里我们用 Button的点击事件,在图片的切换过程中不再通过setBackgroundResource()设置 点击效果.而是通过.xml预先设置好切换效果.在这里我们习惯把该.xml文件放到drawable文件夹下. 代码如下: //xml文件   名称这里为test_press.xml 1. android:state_pressed="true"  为点击后效果 2. and

例题 进度条效果、点击图片滑动效果。

进度条效果 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Co

[Android] PorterDuff使用实例----实现新浪微博图片下载效果

先上效果图,如demo_sinaweibo.gif 由效果图,下半部分是简单的效果叠加,上半部分是新浪微博加载图片显示进度的效果,显示进度的半透明区域只与根据背景图的非透明区域叠加,背景图的透明区域仍为透明.为实现此要求,联想到APIDemos中的com.example.android.apis.graphics.Xfermodes,可以自定义组件在组件的绘制过程中设置PorterDuff.Mode即可实现.另效果图中显示当下载进度超过50%时,重新设置了背景图. 本次自定义组件选择继承Imag

鼠标经过地方图片变亮,其他地方图片变暗效果

很久没做,原理都有点忘记了. 效果的原理 原理其实很简单,首先给一个黑色的背景,通过降低图片的透明度,让黑色背景呈现出来,图片看起来就更暗.鼠标移到图片1,那么就让除了图片1的其他图片的透明度降低,让他们看起来更暗,让图片1看起来显得更亮 JS.CSS.JQ都可以使用 在这里记录下原理..

实现点击图片放大效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn"> <head> <!--

android View实现变暗效果

android项目中做一个默认图片变暗,有焦点时变亮的效果.相信大家都能各种办法,各种手段很容易的实现这个效果.这里记录下作者实现这个效果的过程及遇到的问题,仅供参考.见下图(注:因为是eclipse截图,所以有点色差了,黄色变成蓝色,不过暗亮的效果还是明显的O(∩_∩)O~):               1.脑袋里转的第一个实现的想法是:    2张图片,一张暗图,一张亮图.监听焦点事件,更换图片.    诶,这不是demo诶,哪来一个资源图片弄2份,并且这图片是从服务器上获取的,不实际.