react native中用插值實現自定義動畫效果

2021-10-09 16:58:48 字數 759 閱讀 9587

設想在rn如何實現一段**轉盤的動畫:20%前慢,20-80%快,80-90%減慢,90-100%搖擺一下回正。

難道用順序動畫去寫?這裡介紹的插值更方便,也許你沒注意到它的強大。

官方**:

value.interpolate();
注意input與output的對應方式。我們可以建立乙個線性動畫0-1,作為inputrange,然後輸出"0deg"到終點角度,對應關係可以這麼做:

inputrange: [0, 0.2, 0.8, 0.9, 1],

outputrange: ['0deg', '100deg', '800deg', '830deg', '810deg'],

輸出是非線性的,也就是我們要的自定義效果。以此為例可以做出你想要的動畫。

功能**:

let [zanim,setzanim] = usestate(new animated.value(0));

let [dis,setdis]=usestate(false)

let getdeg = () => {

return zanim.interpolate({

inputrange: [0, 0.2, 0.8, 0.9, 1],

outputrange: ['0deg', '100deg', '800deg', '830deg', '810deg'],

usenativedriver: true

插值查詢 插值搜尋

這是一種和二分比較相似的查詢的演算法,不過不同的是,對於分布比較均勻的較大的陣列,插值查詢有時能夠一次就搜尋到位.為什麼能夠這麼快呢 看網上沒有什麼關於這種演算法的描述,我就來描述一下吧.首先要知道一點,這種搜尋方式只能夠針對順序表進行,再乙個要理解順序表中的乙個特點,在順序表中查詢是否存在乙個值,...

hermite插值 分段插值 Hermite插值

1.分段二次多項式插值 試用分段 4段 二次多項式插值來近似 0,1 區間上的 runge 函式 1 取區間的 8 等分點,計算插值節點處的函式值 2 每次取 3 個相鄰的等分點為一組,呼叫 polyinterp 函式,計算繪圖求值點 3 繪圖.2.hermite插值 編寫程式,繪製繪製多項式 p ...

插值法(拉格朗日插值和牛頓插值)

牛頓插值 defnewton interpolation x,y,init sum y 0 temp np.zeros len x len x 將第一行賦值 for i in range 0,len x temp i,0 y i temp sum 1.0 for i in range 1,len x...