Dosen原創(chuàng)
開始學(xué)習(xí)Framerjs,邊學(xué)邊翻譯充石,也加了一些我學(xué)習(xí)過程中的理解。寫下來留作以后查閱霞玄,看官如果發(fā)現(xiàn)有地方寫的不對(duì)請(qǐng)指出骤铃。轉(zhuǎn)載請(qǐng)聯(lián)系作者。
Animation????? 動(dòng)畫
Properties of a layer can be animated, including x, y, width, height, scale, opacity, rotation and more. Multiple properties can be animated at once.
層的屬性可以被動(dòng)畫坷剧,包括x惰爬,y,寬惫企,高撕瞧,縮放,透明度狞尔,旋轉(zhuǎn)丛版,等。多種屬性的動(dòng)畫可以一起執(zhí)行偏序。
這段代碼給layerA創(chuàng)建了一個(gè)透明度變?yōu)?.5的動(dòng)畫页畦。
Timing????? 時(shí)間
You can define the duration of an animation, except when using spring curves. Animations can also be delayed and repeated. All durations in Framer are defined in seconds.
你可以定義一個(gè)動(dòng)畫的持續(xù)時(shí)間,除了當(dāng)使用彈性曲線時(shí)研儒。動(dòng)畫可以添加延遲和重復(fù)豫缨。在Framer中所有持續(xù)都用秒為單位。
這段代碼給layerA創(chuàng)建了一個(gè)透明度變?yōu)?.5的動(dòng)畫端朵。并且使用ease這個(gè)預(yù)置的動(dòng)畫曲線好芭,動(dòng)畫重復(fù)1次,延遲2秒冲呢,持續(xù)1秒舍败。
Curves????? 曲線
Animations optionally take a curve that describe the type of animation. You can use pre-defined curves like 'linear' or 'ease-in', custom bezier curves and spring animations. Below is an overview of different curves.
動(dòng)畫的類型用曲線來描述。你可以使用預(yù)定義曲線敬拓,比如“l(fā)inear”邻薯,“ease-in”,自定義貝塞爾曲線和彈性動(dòng)畫恩尾。下面是不同曲線的預(yù)覽弛说。
Summary????? 概要
Multiple properties can be animated at once
多種屬性動(dòng)畫可以一起執(zhí)行。
Animations can be timed, delayed and repeated
動(dòng)畫可以被定義時(shí)間翰意,延遲木人,重復(fù)次數(shù)信柿。
Framer contains various animation curves, including spring curves
Framer包含多種動(dòng)畫曲線,包含彈性曲線醒第。