把商品新增到購物車的動畫效果(貝塞爾曲線)

2021-09-08 13:02:07 字數 1523 閱讀 9711

目錄(?)

android補間動畫,屬性動畫實現購物車新增動畫

確定動畫的起終點

在起終點之間使用二次貝塞爾曲線填充起終點之間的點的軌跡

設定屬性動畫,valueanimator插值器,獲取中間點的座標

將執行動畫的控制項的x、y座標設為上面得到的中間點座標

開啟屬性動畫

當動畫結束時的操作

pathmeasure的使用

- getlength()

- boolean getpostan(float distance, float pos, float tan) 的理解

//得到父布局的起始點座標(用於輔助計算動畫開始/結束時的點的座標)

int parentlocation = new int[2]; rl.getlocationinwindow(parentlocation);

//        四、計算中間動畫的插值座標(貝塞爾曲線)(其實就是用貝塞爾曲線來完成起終點的過程)

//開始繪製貝塞爾曲線

path path = new path();

//移動到起始點(貝塞爾曲線的起點)

path.moveto(startx, starty);

//使用二次薩貝爾曲線:注意第乙個起始座標越大,貝塞爾曲線的橫向距離就會越大,一般按照下面的式子取即可 path.quadto((startx + tox) / 2, starty, tox, toy); //mpathmeasure用來計算貝塞爾曲線的曲線長度和貝塞爾曲線中間插值的座標, // 如果是true,path會形成乙個閉環 mpathmeasure = new pathmeasure(path, false); //★★★屬性動畫實現(從0到貝塞爾曲線的長度之間進行插值計算,獲取中間過程的距離值) valueanimator valueanimator = valueanimator.offloat(0, mpathmeasure.getlength()); valueanimator.setduration(1000); // 勻速線性插值器 valueanimator.setinterpolator(new linearinterpolator()); valueanimator.addupdatelistener(new valueanimator.animatorupdatelistener() }); // 五、 開始執行動畫 valueanimator.start();

package cn.c.com.beziercurveanimater;

import android.animation.animator;

import android.animation.valueanimator;

import android.graphics.bitmap;

github

iOS新增到購物車的簡單動畫效果

pragma mark 新增到購物車的動畫效果 huangyibiao void addanimatedwithframe cgrect frame completion bool finished self.cartcategorieslabel text nsstring stringwithf...

商品新增購物車實現動畫效果

在應用商場的時候,發現 和京東在往購物車新增商品時,會有商品縮圖跑到購物車的效果,特此做了個小demo,便於學習和應用 在controller的.h檔案中 inte ce viewcontroller property nonatomic,strong uibezierpath path end i...

安卓購物車新增商品動畫效果

自定義動畫類 直接使用 package com.bjut.sse.yimeiband.main import android.graphics.drawable.drawable import android.view.view import android.view.viewgroup impor...