Android贝塞尔曲线初步学习第三课 Android实现添加至购物车的运动轨迹

 更新时间:2021年03月22日 10:47:38   作者:猴菇先生  
这篇文章主要为大家详细介绍了Android贝塞尔曲线初步学习第三课,Android实现添加至购物车的运动轨迹,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

不知上一节高仿QQ未读消息气泡大家还喜欢么,今天继续练习贝赛尔曲线,这一节我们通过贝赛尔曲线和属性动画估值器实现添加至购物车的运动轨迹,效果如下:

1、新建自定义View,重写构造方法,初始化Paint、Path;

2、确定起始点、终止点、控制点坐标,这里我们直接固定:

 @Override
 protected void onSizeChanged(int w, int h, int oldw, int oldh) {
 super.onSizeChanged(w, h, oldw, oldh);
 mStartX = 100;
 mStartY = 100;
 mEndX = w - 100;
 mEndY = h - 100;
 mControlX = w - 100;
 mControlY = 100;
 }

3、画起止点小球和贝赛尔曲线路径:

@Override
 protected void onDraw(Canvas canvas) {
 super.onDraw(canvas);
 canvas.drawCircle(mStartX, mStartY, 24, mCirclePaint);
 canvas.drawCircle(mEndX, mEndY, 24, mCirclePaint);
 mPath.reset();
 mPath.moveTo(mStartX, mStartY);
 mPath.quadTo(mControlX, mControlY, mEndX, mEndY);
 canvas.drawPath(mPath, mPathPaint);
 }

这样基本的东西就完成了。

4、那么该怎样使一个小球随着贝赛尔曲线的路径轨迹运动呢,那就需要得到运动到当前的点在贝赛尔曲线上的坐标,使用如下工具类:

/**
 * 计算贝赛尔曲线坐标的工具类
 */

public class BezierUtil {
 /**
 * B(t) = (1 - t)^2 * P0 + 2t * (1 - t) * P1 + t^2 * P2, t ∈ [0,1]
 *
 * @param t 曲线长度比例
 * @param p0 起始点
 * @param p1 控制点
 * @param p2 终止点
 * @return t对应的点
 */
 public static PointF calculateBezierPointForQuadratic(float t, PointF p0, PointF p1, PointF p2) {
 PointF point = new PointF();
 float temp = 1 - t;
 point.x = temp * temp * p0.x + 2 * t * temp * p1.x + t * t * p2.x;
 point.y = temp * temp * p0.y + 2 * t * temp * p1.y + t * t * p2.y;
 return point;
 }

 /**
 * B(t) = P0 * (1-t)^3 + 3 * P1 * t * (1-t)^2 + 3 * P2 * t^2 * (1-t) + P3 * t^3, t ∈ [0,1]
 *
 * @param t 曲线长度比例
 * @param p0 起始点
 * @param p1 控制点1
 * @param p2 控制点2
 * @param p3 终止点
 * @return t对应的点
 */
 public static PointF calculateBezierPointForCubic(float t, PointF p0, PointF p1, PointF p2, PointF p3) {
 PointF point = new PointF();
 float temp = 1 - t;
 point.x = p0.x * temp * temp * temp + 3 * p1.x * t * temp * temp + 3 * p2.x * t * t * temp + p3.x * t * t * t;
 point.y = p0.y * temp * temp * temp + 3 * p1.y * t * temp * temp + 3 * p2.y * t * t * temp + p3.y * t * t * t;
 return point;
 }
}

只需要传入对应的参数即可获得到当前点在贝赛尔曲线上的坐标。其中曲线长度比例t 以及起始点、终止点都可以在属性动画估值器Evaluator中获得:

/**
 * 贝赛尔曲线估值器
 */
public class BezierEvaluator implements TypeEvaluator<PointF> {

 /* 控制点坐标 */
 private PointF mControlPoint;

 public BezierEvaluator(PointF controlPoint) {
 mControlPoint = controlPoint;
 }

 @Override
 public PointF evaluate(float v, PointF pointF, PointF t1) {
 return BezierUtil.calculateBezierPointForQuadratic(v, pointF, mControlPoint, t1);
 }
}

注:Point与PointF的区别:
Point使用的是int类型来存储x、y坐标,而PointF使用的是float类型。

5、设置点击监听setOnclickListner(this),重写onClick方法:

 @Override
 public void onClick(View view) {
 BezierEvaluator evaluator = new BezierEvaluator(new PointF(mControlX, mControlY));
 PointF startPoint = new PointF(mStartX, mStartY);
 PointF endPoint = new PointF(mEndX, mEndY);
 ValueAnimator anim = ValueAnimator.ofObject(evaluator, startPoint, endPoint);
 anim.setDuration(1000);
 anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
  @Override
  public void onAnimationUpdate(ValueAnimator valueAnimator) {
  PointF curPoint = (PointF) valueAnimator.getAnimatedValue();
  mCurX = (int) curPoint.x;
  mCurY = (int) curPoint.y;
  invalidate();
  }
 });
 anim.start();
 }

使用估值器BezierEvaluator的对象,在属性动画更新监听中获取到该当前所在位置,并重绘:

canvas.drawCircle(mCurX, mCurY, 24, mCirclePaint);

即可实现一种类似于添加至购物车的运动轨迹效果。

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

相关文章

  • 解析Kotlin JSON格式

    解析Kotlin JSON格式

    这篇文章主要介绍了Kotlin JSON格式解析,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-03-03
  • Android NDK开发(C语言--联合体与枚举)

    Android NDK开发(C语言--联合体与枚举)

    这篇文章主要介绍了Android NDK开发C语言联合体与枚举,共用体是一种特殊的数据类型,允许您在相同的内存位置存储不同的数据类型。您可以定义一个带有多成员的共用体,但是任何时候只能有一个成员带有值。下面详细介绍该内容,需要的朋友可以参考一下
    2021-12-12
  • Kotlin Channel处理多个数据组合的流

    Kotlin Channel处理多个数据组合的流

    最近项目中对 kotlin 的使用比较多。不得不说 kotlin 确实可以极大的提高 android 的开发效率,channel用于协程之间的通讯,使用send和receive往通道里写入或者读取数据,2个方法为非阻塞挂起函数,channel是热流,不管有没有订阅者都会发送
    2022-11-11
  • Android EditText被软键盘遮盖的处理方法

    Android EditText被软键盘遮盖的处理方法

    android app新增了透明栏效果,结果发现键盘弹起后会遮盖屏幕底部的EditText,没有像想象中的调整窗口大小,并滚动ScrollView,将EditText显示在键盘上方。下面小编把解决方法记录一下,特此分享到脚本之家平台,感兴趣的朋友一起看看吧
    2016-10-10
  • 详解Android的内存优化--LruCache

    详解Android的内存优化--LruCache

    LruCache是基于Lru算法实现的一种缓存机制。本文对LruCache的概念和实现原理进行介绍,通过实例分析和使用介绍,让大家更好的了解LruCache,下面跟着小编一起来看下吧
    2016-12-12
  • Android文件选择器ExFilePicker的使用方法

    Android文件选择器ExFilePicker的使用方法

    这篇文章主要为大家详细介绍了Android文件选择器ExFilePicker的使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • Android开发Jetpack组件Room使用讲解

    Android开发Jetpack组件Room使用讲解

    Room是一个数据库访问组件; 对SqLite数据库做了友好的封装,使我们在编码的时候,只需要注重逻辑的部分即可,数据库就交给Room去流畅的访问即可
    2022-08-08
  • Android ExpandableListView双层嵌套实现三级树形菜单

    Android ExpandableListView双层嵌套实现三级树形菜单

    这篇文章主要介绍了Android ExpandableListView双层嵌套实现三级树形菜单,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-11-11
  • Android开发实现自定义水平滚动的容器示例

    Android开发实现自定义水平滚动的容器示例

    这篇文章主要介绍了Android开发实现自定义水平滚动的容器,涉及Android滚动容器的事件响应、属性运算与修改相关操作技巧,需要的朋友可以参考下
    2017-10-10
  • Windows下搭建Flutter开发环境

    Windows下搭建Flutter开发环境

    这篇文章介绍了Windows下搭建Flutter开发环境的方法,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-11-11

最新评论