1、Math.atan()與Math.atan2()的區別

angle = Math.atan(slope) 復制代碼

slope斜率值為y/x，返回值angle為一個角度的弧度制，因為角度的周期性，此方法不能很好的反應角度,應使用Math.atan2替換。

angle = Math.atan2(y,x) 復制代碼

x是臨邊邊長，y是對邊邊長。

弧度轉角度方法：

弧度 = 角度 * Math.PI / 180;角度 = 弧度 * 180 / Math.PI; 復制代碼

計算兩點間連線的傾斜角：

Math.atan2()函數返回的是點(x,y)和原點(0,0)之間直線的傾斜角，計算任意兩點的切斜角，應使用Math.atan2(y2-y1,x2-x1)。

2、PathMeasure結合ValueAnimator實現軌跡繪制效果

關鍵方法：

PathMeasure#getLength()：獲取軌跡總長度

PathMeasure#getSegment(float startD, float stopD, Path dst, boolean startWithMoveTo)：startD、stopD分別是軌跡長度值，dst是保存到的片段路徑。

public class CirclePathView extends View {private int mWidth;private int mHeight;private PathMeasure mPathMeasure;private float mLength;private Path mDst;private float animatedValue;private Paint mPaint;private Path mPath;public CirclePathView(Context context) {this(context,null);}public CirclePathView(Context context, @Nullable AttributeSet attrs) {this(context, attrs,0);}public CirclePathView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);initView();}@Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);mWidth = w;mHeight = h;mPath = new Path();mPath.addCircle(mWidth / 2,mHeight / 2,mWidth / 4,Path.Direction.CW);mPathMeasure = new PathMeasure();mPathMeasure.setPath(mPath,true);mLength = mPathMeasure.getLength();}private void initView() {mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);mPaint.setStyle(Paint.Style.STROKE);mPaint.setStrokeWidth(5);mPaint.setColor(Color.BLACK);mDst = new Path();ValueAnimator animator = ValueAnimator.ofFloat(1, 0);animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {@Overridepublic void onAnimationUpdate(ValueAnimator animation) {animatedValue = (float) animation.getAnimatedValue();invalidate();}});animator.setDuration(2000);animator.setRepeatCount(ValueAnimator.INFINITE);animator.start();}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);mDst.reset();mDst.lineTo(0,0);float stop = mLength * animatedValue;float start = (animatedValue - 0.5f > 0 ? (animatedValue - 0.5f) * 2 : 0f) * mLength;mPathMeasure.getSegment(start,stop,mDst,true);canvas.drawPath(mDst,mPaint);} }復制代碼

軌跡效果也可使用DashPathEffect，通過控制實線的偏移量來實現。

3、點贊-飄心效果

• 獲取一個間于min和max之間的隨機值：

int randomNum = new Random().nextInt(max - min + 1) + min; //int randomNum = new Random().nextInt(max) % (max - min + 1) + min; //好傻噢 復制代碼

• AS打開工程報錯ssl peer shut down incorrectly：gradle版本問題。
• GitHub飄心點贊項目：github.com/trc1993/And…

核心邏輯：確認紅心起點、終點坐標（高度隨機），創建2階貝塞爾曲線，通過PathMeasure.getPosTan()和ValueAnimator，獲取路徑上每個點的坐標，再通過View#setTranslationX()和View#setTranslationY()移動紅心。

private void addFHeart(ImageView startLocationIv, Drawable floatDrawable) {int min = animMinWidth;int max = animMaxWidth;Random random = new Random();animWidth = random.nextInt(max - min + 1) + min;int min1 = animMinHeight;int max1 = animMaxHeight;Random random1 = new Random();animHeight = random1.nextInt(max1 - min1 + 1) + min1;final ImageView _floatIv = new ImageView(context);_floatIv.setImageDrawable(floatDrawable);RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(floatIconWidth, floatIconHeight);params.width = DisplayUtil.dip2px(context, floatIconWidth);params.height = DisplayUtil.dip2px(context, floatIconHeight);FRl.addView(_floatIv, params);int[] parentLocation = new int[2];FRl.getLocationInWindow(parentLocation);//得到起始圖片的坐標（用于計算動畫開始的坐標）int startLoc[] = new int[2];startLocationIv.getLocationInWindow(startLoc);// 三、正式開始計算動畫開始/結束的坐標//起始點：圖片起始點-父布局起始點+該圖片的一半startX = startLoc[0] - parentLocation[0];startY = startLoc[1] - parentLocation[1];endX = startX;endY = startY - animHeight;firstControlX = startX - animWidth;firstControlY = startY - animHeight * 3 / 8;secondControlX = startX + animWidth;secondControlY = startY - animHeight * 5 / 8;Path path = new Path();path.moveTo(startX, startY);path.cubicTo(firstControlX, firstControlY, secondControlX, secondControlY, endX, endY);final PathMeasure mPathMeasure = new PathMeasure(path, false);//★★★屬性動畫實現（從0到貝塞爾曲線的長度之間進行插值計算，獲取中間過程的距離值）AnimatorSet bouncer = new AnimatorSet();ValueAnimator valueAnimator = ValueAnimator.ofFloat(0, mPathMeasure.getLength());ObjectAnimator anim = ObjectAnimator.ofFloat(_floatIv, "alpha", 1f, 0.1f);// 勻速線性插值器bouncer.setInterpolator(new LinearInterpolator());valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {@Overridepublic void onAnimationUpdate(ValueAnimator animation) {// 當插值計算進行時，獲取中間的每個值，// 這里這個值是中間過程中的曲線長度（下面根據這個值來得出中間點的坐標值）float value = (Float) animation.getAnimatedValue();Log.d("FloatHeartView", "value:" + value);// ★★★★★獲取當前點坐標封裝到mCurrentPosition// boolean getPosTan(float distance, float[] pos, float[] tan) ：// 傳入一個距離distance(0<=distance<=getLength())，然后會計算當前距// 離的坐標點和切線，pos會自動填充上坐標，這個方法很重要。mPathMeasure.getPosTan(value, mCurrentPosition, null);//mCurrentPosition此時就是中間距離點的坐標值// 移動的圖片（動畫圖片）的坐標設置為該中間點的坐標_floatIv.setTranslationX(mCurrentPosition[0]);_floatIv.setTranslationY(mCurrentPosition[1]);}});bouncer.play(valueAnimator).with(anim);bouncer.setDuration(animDuration);bouncer.start();bouncer.addListener(new Animator.AnimatorListener() {@Overridepublic void onAnimationStart(Animator animation) {}//當動畫結束后：@Overridepublic void onAnimationEnd(Animator animation) { // // 把移動的圖片imageview從父布局里移除FRl.removeView(_floatIv);}@Overridepublic void onAnimationCancel(Animator animation) {}@Overridepublic void onAnimationRepeat(Animator animation) {}});} 復制代碼

4、點贊-數字滾動+1效果

juejin.im/post/5c2190…

5、支付寶、微信、銀聯支付

juejin.im/post/596d97…

總結

以上是生活随笔為你收集整理的8：Math.atan2、PathMeasure、点赞飘心效果、点赞数字滚动+1效果、集成支付的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。