小程式二次貝塞爾曲線，購物車商品曲線飛入效果

前段時間閒暇的時候看到乙個貝塞爾曲線演算法的文章，試著在小程式裡去實現小程式的貝塞爾曲線演算法，及其效果。

主要應用到的技術點：

1、小程式wxss布局，以及資料繫結

2、js二次bezier曲線演算法

bezier: function (points, times) ;

point_d['x'] = dist_ad * math.cos(radius_ab) + points[0]['x'];
point_d['y'] = dist_ad * math.sin(radius_ab) + points[0]['y'];
points_d.push(point_d);
// e點的座標
var point_e = {};
point_e['x'] = dist_be * math.cos(radius_bc) + points[1]['x'];
point_e['y'] = dist_be * math.sin(radius_bc) + points[1]['y'];
points_e.push(point_e);
// 此時線段de的正切值
var tan_de = (point_e['y'] - point_d['y']) / (point_e['x'] - point_d['x']);
// tan_de的弧度值
var radius_de = math.atan(tan_de);
// 地市de的間距
var dist_de = math.sqrt(math.pow((point_e['x'] - point_d['x']), 2) + math.pow((point_e['y'] - point_d['y']), 2));
// 此時df的距離
var dist_df = (dist_ad / dist_ab) * dist_de;
// 此時df點的座標
var point_f = {};
point_f['x'] = dist_df * math.cos(radius_de) + point_d['x'];
point_f['y'] = dist_df * math.sin(radius_de) + point_d['y'];
bezier_points.push(point_f);
} return ;
}

094614lq8csndfksittquq.gif

用 PIL 繪製二次貝塞爾曲線

pil python image library 中有 line,ellipse,rectangle 等常規繪圖的函式，但缺少繪製曲線的函式，今天我的需求中需要繪製乙個二次貝塞爾曲線 兩個端點，乙個控制點 無奈之下，到網上找了乙個 c 語言寫的演算法，把它寫成了 python 的，並且寫成了類的形式...

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

目錄 android補間動畫，屬性動畫實現購物車新增動畫 確定動畫的起終點 在起終點之間使用二次貝塞爾曲線填充起終點之間的點的軌跡 設定屬性動畫，valueanimator插值器，獲取中間點的座標 將執行動畫的控制項的x y座標設為上面得到的中間點座標 開啟屬性動畫 當動畫結束時的操作 pathme...

微信小程式實現批量刪除購物車商品

使用下面的 進行刪除時，會動態的改變list的長度，導致每次只能刪除乙個商品 for var i 0 i list.length i 定義乙個變數index為要開始刪除的位置 第乙個勾選的商品的位置 定義乙個變數delnum為要刪除的商品的數量，遍歷商品列表list，當找到第乙個勾選的商品時，將該商...