2023年7月15日发(作者：)

Android实现曲线路径动画概述近期碰到曲线动画的实现问题，写本⽂记录下。动画类似“剑与远征”游戏的⾦币动画，动画路径如下图：思路1. 通过贝塞尔曲线计算出x和y的位置（各个点的位置需要⾃⼰微调）（此部分内容参考此⽂：/p/fea4d1f6512a）2. 通过ValueAnimator来实现动画demo如下：注意：此demo使⽤到了屏幕的宽⾼，因此如果要demo显⽰正常，需要把状态栏显⽰透明，把acitionbar去掉。源码blic class MainActivity extends AppCompatActivity { //ui private Button btnOne; private Button btnTwo; private Button btnAnim; //data private int screenHeight; private int screenWidth; @Override protected void onCreate(Bundle savedInstanceState) { te(savedInstanceState); getWindow().addFlags(_TRANSLUCENT_STATUS);//设置透明状态栏 setContentView(ty_main); screenHeight=getResources().getDisplayMetrics().heightPixels; screenWidth=getResources().getDisplayMetrics().widthPixels; initViews(); } private void initViews() { btnOne = findViewById(_one); btnTwo = findViewById(_two); btnAnim = findViewById(_anim); final ValueAnimator valueAnimator=new ValueAnimator(); ation(2000); ectValues(new PointF(0, 0)); ateListener(new orUpdateListener() { @Override @Override public void onAnimationUpdate(ValueAnimator animation) { PointF point = (PointF) matedValue(); (point.x); (point.y); } }); lickListener(new kListener() { @Override public void onClick(View v) { luator(new TypeEvaluator() { @Override public Object evaluate(float fraction, Object startValue, Object endValue) { return ateBezierPointForQuadratic(fraction, new PointF(t(), ()), new PointF(screenWidth, screenHeight/2), new PointF(t(), screenHeight)); } }); (); } }); lickListener(new kListener() { @Override public void onClick(View v) { luator(new TypeEvaluator() { @Override public Object evaluate(float fraction, Object startValue, Object endValue) { return ateBezierPointForCubic(fraction, new PointF(t(), ()), new PointF(screenWidth, screenHeight/3), new PointF(0, screenHeight/3*2), new PointF(t(), screenHeight)); } }); (); } }); }}blic 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; }}activity_

/>

/>

/>id="@+id/btn_one"layout_width="match_parent"layout_height="wrap_content"text="⼆阶贝塞尔曲线"id="@+id/btn_two"layout_width="match_parent"layout_height="wrap_content"text="三阶贝塞尔曲线"id="@+id/btn_anim"layout_width="wrap_content"layout_height="wrap_content"layout_gravity="center"text="Anim"

发布者：admin，转转请注明出处：http://www.yc00.com/web/1689430768a247066.html