Android自定义View实现抖音飘动红心效果

本文实例为大家分享了android自定义view实现抖音飘动红心效果的具体代码，供大家参考，具体内容如下

自定义view——抖音飘动红心

效果展示

动画效果

使用自定义view完成红心飘动效果

view实现

动画：属性动画（位移+缩放+透明度+旋转）
+
随机数：（属性动画参数+颜色选取）

view

/**
 * 飘心效果
 * 1.创建imageview
 * 2.imageview执行组合动画
 * 3.动画执行完成后销毁view
 */
public class flyheartview extends relativelayout {

  private int defoutwidth = 200;//默认控件宽度
  private long mduration = 3000;//默认动画时间
  //颜色集合 从中获取颜色
  private int[] color = {
      0xffff34b3, 0xff9acd32, 0xff9400d3, 0xffee9a00,
      0xffffb6c1, 0xffda70d6, 0xff8b008b, 0xff4b0082,
      0xff483d8b, 0xff1e90ff, 0xff00bfff, 0xff00ff7f
  };

  public flyheartview(context context) {
    super(context);
    initframelayout();
  }

  public flyheartview(context context, attributeset attrs) {
    super(context, attrs);
    initframelayout();
  }

  private void initframelayout() {
    viewgroup.layoutparams params = new viewgroup.layoutparams(defoutwidth, viewgroup.layoutparams.wrap_content);
    setlayoutparams(params);
  }

  /**
   * 创建一个心形的view视图
   */
  private imageview createheartview() {
    imageview heartiv = new imageview(getcontext());
    layoutparams params = new layoutparams(defoutwidth / 2, defoutwidth / 2);

    //控件位置
    params.addrule(relativelayout.align_parent_bottom);
    params.addrule(relativelayout.center_horizontal);

    heartiv.setlayoutparams(params);
    heartiv.setimageresource(r.mipmap.ic_heart);
    //改变颜色
    heartiv.setimagetintlist(colorstatelist.valueof(color[(int) (color.length * math.random())]));
    return heartiv;
  }

  /**
   * 执行动画
   * 在展示调用该方法
   */
  public void startfly() {
    final imageview heartiv = createheartview();
    addview(heartiv);
    animatorset animatorset = new animatorset();
    animatorset.play(createtranslationx(heartiv))
        .with(createtranslationy(heartiv))
        .with(createscale(heartiv))
        .with(createrotation(heartiv))
        .with(createalpha(heartiv));
    //执行动画
    animatorset.start();
    //销毁view
    animatorset.addlistener(new animatorlisteneradapter() {
      @override
      public void onanimationend(animator animation) {
        super.onanimationend(animation);
        removeview(heartiv);
      }
    });
  }

  /**
   * 横向正弦位移动画
   *
   * @return
   */
  private animator createtranslationx(view view) {
    objectanimator animator = objectanimator.offloat(view, "translationx", 0, (float) (defoutwidth * math.random() / 4));
    animator.setduration(mduration);
    //cycleinterpolator cycles 正弦曲线数
    animator.setinterpolator(new cycleinterpolator((float) (3 * math.random())));
    return animator;
  }


  /**
   * 纵向加速位移动画
   *
   * @return
   */
  private animator createtranslationy(view view) {
    objectanimator animator = objectanimator.offloat(view, "translationy", 0, -1000);
    animator.setduration(mduration);
    animator.setinterpolator(new accelerateinterpolator());
    return animator;
  }


  /**
   * 加速放大动画
   *
   * @return
   */
  private animator createscale(view view) {
    objectanimator animatorx = objectanimator.offloat(view, "scalex", 1, 1.5f);
    objectanimator animatory = objectanimator.offloat(view, "scaley", 1, 1.5f);
    animatorset animatorset = new animatorset();
    animatorset.setduration(mduration);
    animatorset.setinterpolator(new accelerateinterpolator());
    animatorset.play(animatorx).with(animatory);
    return animatorset;
  }

  /**
   * 透明度动画
   *
   * @return
   */
  private animator createalpha(view view) {
    objectanimator animator = objectanimator.offloat(view, "alpha", 1, 0.1f);
    animator.setduration(mduration);
    animator.setinterpolator(new accelerateinterpolator());
    return animator;
  }

  /**
   * 旋转动画
   *
   * @return
   */
  private animator createrotation(view view) {
    objectanimator animator = objectanimator.offloat(view, "rotation", 0, (float) (25f * math.random()));
    animator.setduration(mduration);
    animator.setinterpolator(new cycleinterpolator((float) (6 * math.random())));
    return animator;
  }


}

最后在mainactivity中调用flyheartview 的startfly()方法就能实现点击飘心效果。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。