android开发分享Android实现水波纹扩散效果

本文实例为大家分享了android实现水波纹扩散效果的具体代码,供大家参考,具体内容如下 先上图 囧!没有图片所以就拿了小安代替了。 先看一下如何使用这个view

android开发分享Android实现水波纹扩散效果实例为大家分享了android实现水波纹扩散效果的具体代码,供大家参考,具体内容如下

上述就是android开发分享Android实现水波纹扩散效果的全部内容,如果对大家有所用处且需要了解更多关于Android学习教程,希望大家多多关注—计算机技术网(www.ctvol.com)!

先上图

Android实现水波纹扩散效果

囧!没有图片所以就拿了小安代替了。

先看一下如何使用这个view。

  <jianpan.com.mybutton.view.ripplediffuse   android:layout_width="200dp"   android:layout_height="200dp"   app:btn_img_res="@drawable/rd"   app:ripple_img_res="@drawable/rd">  </jianpan.com.mybutton.view.ripplediffuse>  

是的,没有别的代码了,就这么简单

实现思路

自定义viewgroup,创建一个用显示图片的view,在创建几个,大小相同的imageview。当按下时,对这几个imageview进行放大和渐变。

代码

首先它肯定是一个正方形。

  @override  protected void onmeasure(int widthmeasurespec, int heightmeasurespec) {   super.onmeasure(widthmeasurespec, widthmeasurespec);   if (!minitdatasucceed){   initdata();   }  }

显示图片的view的大小,该怎么给?这是个比较蛋疼的问题。给大了就看不到扩散效果了,给小,给多少的值合适呢?有没有正好的值,有的用父 view 的 size / 子 view 放大的倍数,这样肯定会达到理想的效果。

  private static final int animation_each_offset = 800; // 每个动画的播放时间间隔  private static final int ripple_view_count = 3;//波纹view的个数  private static final float default_scale = 1.6f;//波纹放大后的大小    //点击有扩散效果的view  private circleimageview mbtnimg;  private int mbtnviewheight;  private int mbtnviewwidth;  private float mscale = default_scale;  //图片资源  private int mbtnimgres;  private int mrippleres;  //是否初始化完成  private boolean minitdatasucceed = false;    private void initdata(){   if (getmeasuredheight() > 0 && getmeasuredwidth() > 0){   minitdatasucceed = true;     int height = getmeasuredheight() - getpaddingtop() - getpaddingbottom();   int width = getmeasuredwidth() - getpaddingleft() - getpaddingright();   mbtnviewheight = (int) (height / mscale);   mbtnviewwidth = (int) (width / mscale);     mbtnimg = new circleimageview(getcontext());   mbtnimg.setimageresource(mbtnimgres);   mbtnimg.setontouchlistener(this);     addview(mbtnimg, getwavelayoutparams());     for (int i = 0; i < ripple_view_count; i++){    //创建view    circleimageview wave = createwave();    mwaves.add(wave);    //创建动画    manimas.add(getnewanimationset());      addview(wave, 0, getwavelayoutparams());   }   }  }  private circleimageview createwave(){   circleimageview circleimageview = new circleimageview(getcontext());   circleimageview.setscaletype(imageview.scaletype.center_crop);   circleimageview.setimageresource(mrippleres);   return circleimageview;  }    private layoutparams getwavelayoutparams(){   layoutparams lp = new layoutparams(mbtnviewwidth, mbtnviewheight);   return lp;  }    private animationset getnewanimationset() {   animationset as = new animationset(true);   scaleanimation sa = new scaleanimation(1f, mscale, 1f, mscale,    scaleanimation.relative_to_self, 0.5f,    scaleanimation.relative_to_self, 0.5f);   sa.setduration(animation_each_offset * 3);   sa.setrepeatcount(-1);// 设置循环   alphaanimation anialp = new alphaanimation(1, 0.1f);   anialp.setrepeatcount(-1);// 设置循环   as.setduration(animation_each_offset * 3);   as.addanimation(sa);   as.addanimation(anialp);   return as;  }

view 都初始化完成了,好像还差一步,onlayout,只要把子 view 都显示到中先就可以了。

  @override  protected void onlayout(boolean changed, int left, int top, int right, int bottom) {   if (minitdatasucceed) {   int childleft = (getmeasuredwidth() - mbtnviewwidth) / 2;   int childtop = (getmeasuredheight() - mbtnviewheight) / 2;   for (int i = 0; i < ripple_view_count; i++) {    circleimageview wave = mwaves.get(i);    wave.layout(childleft, childtop, mbtnviewwidth + childleft, mbtnviewheight + childtop);   }   mbtnimg.layout(childleft, childtop, mbtnviewwidth + childleft, mbtnviewheight + childtop);   }else {   initdata();   }  }

最后处理一下图片的ontouch事件。

  @override  public boolean ontouch(view v, motionevent event) {   switch (event.getaction()) {   case motionevent.action_down:    showwaveanimation();    break;   case motionevent.action_move:    break;   case motionevent.action_up:   case motionevent.action_cancel:    cancelwaveanimation();    break;   default:    cancelwaveanimation();    break;   }   return true;  }    private void showwaveanimation() {   for (int i = 0; i < ripple_view_count; i++){   message message = new message();   message.obj = i;   handler.sendmessagedelayed(message, animation_each_offset * i);   }  }    private void cancelwaveanimation() {   for (int i = 0; i < ripple_view_count; i++){   circleimageview wave = mwaves.get(i);   wave.clearanimation();   }  }    private handler handler = new handler() {   @override   public void handlemessage(message msg) {   int position = (int) msg.obj;   circleimageview wave = mwaves.get(position);   wave.startanimation(manimas.get(position));   super.handlemessage(msg);   }  };

参考地址:android实现水波纹外扩效果

以上就是android开发分享Android实现水波纹扩散效果的全部内容,希望对大家的学习有所帮助,也希望大家多多支持<计算机技术网(www.ctvol.com)!!>。

本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

ctvol管理联系方式QQ:251552304

本文章地址:https://www.ctvol.com/addevelopment/937826.html

(1)
上一篇 2021年11月12日
下一篇 2021年11月12日

精彩推荐