Flutter動畫類型
動畫分為兩類：基于tween或基于物理的。以下部分解釋了這些術語的含義，并指出您可以在其中了解更多信息的資源。在某些情況下，我們目前最好的文檔是Flutter圖庫中的示例代碼。
tween動畫
介于兩者之間的簡稱。在補間動畫中，定義了開始點和結束點，以及時間線和定義轉換時間和速度的曲線。該框架計算如何從開始點過渡到結束點。
上面列出的文檔（如動畫教程）并不是關于補間，特別是，但他們在其示例中使用補間。
基于物理的動畫
在基于物理學的動畫中，運動被模擬為與真實世界的行為相似。例如，當你擲球時，它在何處落地，取決于拋球速度有多快，有多沉重，距離地面有多遠。類似地，將連接在彈簧上的球落下（并彈跳）與將連接到繩上的球放下的方式不同。
顫振畫廊
在材質組件下，網格示例演示了一個動畫。從網格中選擇其中一個圖像并放大。您可以用甩手或拖動手勢平移圖像。
另請參閱AnimationController.animateWith和SpringSimulation的API文檔。
Hero animation(英雄動畫)
英雄指的是在屏幕之間飛行的小部件。
使用Flutter's Hero小部件創建英雄動畫。
將英雄從一個屏幕飛到另一個屏幕。
將英雄的形狀從圓形轉換為矩形，同時將其從一個屏幕飛到另一個屏幕的過程中進行動畫處理。
Flutter中的Hero小部件實現了通常稱為共享元素轉換或共享元素動畫的動畫風格。
1?? 基本的動畫概念和類
重點是什么？
Animation對象是Flutter動畫庫中的一個核心類，它內插用于指導動畫的值。
Animation對象知道動畫的當前狀態（例如，它是開始，停止還是向前或向后移動），但不知道屏幕上顯示的內容。
AnimationController管理動畫。
CurvedAnimation將進展定義為非線性曲線。
Tween在正在動畫的對象所使用的數據范圍之間進行插值。 例如，Tween可能會定義從紅到藍的插值，或者從0到255。
使用Listeners和StatusListeners監視動畫狀態更改。
Animation
在Flutter中，動畫對象對屏幕上的內容一無所知。 動畫是一個抽象類，它理解其當前價值和狀態（完成或解散）。 其中一個比較常用的動畫類型是Animation 。
Flutter中的Animation對象是一個在一定時間內依次生成兩個值之間的插值數字的類。 動畫對象的輸出可以是線性的，曲線，步進函數或任何其他可以設計的映射。 根據動畫對象的控制方式，它可以反向運行，甚至可以在中間切換方向。
動畫還可以插入除double之外的其他類型，例如Animation 或Animation 。
動畫對象具有狀態。 其當前值始終在.value成員中可用。
一個Animation對象對渲染或build（）函數一無所知。
2??AnimationController
AnimationController是一個特殊的Animation對象，只要硬件準備好新幀，就會生成一個新的值。 默認情況下，AnimationController在給定的持續時間內線性生成從0.0到1.0的數字。 例如，此代碼創建一個Animation對象，但不會啟動它運行：
final AnimationController controller = new AnimationController(
??? duration: const Duration(milliseconds: 2000), vsync: this);
3??Tween
默認情況下，AnimationController對象的范圍從0.0到1.0。 如果您需要不同的范圍或不同的數據類型，則可以使用補間來配置動畫以插入到不同的范圍或數據類型。 例如，以下Tween從-200.0變為0.0：
final Tween doubleTween = new Tween(begin: -200.0, end: 0.0);
Tween從Animatable繼承，而不是從Animation繼承。 Animatable與動畫一樣，不需要輸出兩倍。 例如，ColorTween指定兩種顏色之間的進展。
final Tween colorTween =
? ? new ColorTween(begin: Colors.transparent, end: Colors.black54);
要使用Tween對象，請在Tween上調用animate（），傳入控制器對象。 例如，以下代碼在500毫秒的過程中生成從0到255的整數值。
final AnimationController controller = new AnimationController(
??? duration: const Duration(milliseconds: 500), vsync: this);
Animation alpha = new IntTween(begin: 0, end: 255).animate(controller);
注意 ：Notice that?animate()?返回的是一個 an Animation, not an Animatable.
以下示例顯示了一個控制器，一條曲線和一個Tween：
final AnimationController controller = new AnimationController(
??? duration: const Duration(milliseconds: 500), vsync: this);
final Animation curve =
? ? new CurvedAnimation(parent: controller, curve: Curves.easeOut);
Animation alpha = new IntTween(begin: 0, end: 255).animate(curve);
4??Animation notifications
一個Animation對象可以有Listeners和StatusListeners，它們分別由addListener（）和addStatusListener（）定義。 只要動畫的值發生變化，就會調用監聽器。 Listener最常見的行為是調用setState（）來重建。 動畫開始，結束，向前移動或向后移動（如AnimationStatus所定義）時會調用StatusListener。 下一節有addListener（）方法的示例，<監視動畫的進度顯示https://flutter.io/tutorials/animation/#monitoring>了addStatusListener（）的示例。
重點是什么
使用addStatusListener來處理動畫狀態更改的通知，例如啟動，停止或反轉方向。
當動畫完成或返回其開始狀態時，通過反轉方向在無限循環中運行動畫。
5??用AnimatedWidget簡化
如何使用AnimatedWidget幫助器類（而不是addListener（）和setState（））來創建動畫的控件。
使用AnimatedWidget創建一個可執行可重用動畫的小部件。 要從小部件中分離出轉換，請使用AnimatedBuilder。
Flutter API中AnimatedWidgets的示例：AnimatedBuilder，AnimatedModalBarrier，DecoratedBoxTransition，FadeTransition，PositionedTransition，RelativePositionedTransition，RotationTransition，ScaleTransition，SizeTransition，SlideTransition。
AnimatedWidget類允許您在setState（）調用中從動畫代碼中分離出小部件代碼。 AnimatedWidget不需要維護一個State對象來保存動畫。
6??監視動畫的進度
使用addStatusListener來處理動畫狀態更改的通知，例如啟動，停止或反轉方向。
當動畫完成或返回其開始狀態時，通過反轉方向在無限循環中運行動畫。
7??用AnimatedBuilder重構
AnimatedBuilder了解如何呈現過渡。
AnimatedBuilder不知道如何渲染小部件，也不知道如何管理動畫對象。
使用AnimatedBuilder將動畫描述為另一個小部件的構建方法的一部分。 如果你只是想用可重用的動畫定義一個小部件，請使用AnimatedWidget。
AnimatedBuilder是渲染樹中的一個獨立的類。 與AnimatedWidget類似，AnimatedBuilder會自動偵聽來自Animation對象的通知，并根據需要將該控件樹標記為dirty，因此您無需調用addListener（）。
Flutter API中AnimatedBuilder的示例：BottomSheet，ExpansionTile，PopupMenu，ProgressIndicator，RefreshIndicator，Scaffold，SnackBar，TabBar，TextField。
從小部件樹的底部開始，渲染徽標的代碼很簡單：
class LogoWidget extends StatelessWidget {
? // Leave out the height and width so it fills the animating parent
? build(BuildContext context) {
? ? return new Container(
????? margin: new EdgeInsets.symmetric(vertical: 10.0),
????? child: new FlutterLogo(),
? ? );
? }
}
圖中的中間三個塊都在GrowTransition的build（）方法中創建。 GrowTransition小部件本身是無狀態的，并擁有定義過渡動畫所需的最終變量集合。 build（）函數創建并返回AnimatedBuilder，它將（匿名構建器）方法和LogoWidget對象作為參數。 渲染轉換的工作實際上發生在（匿名構建器）方法中，該方法創建一個適當大小的Container來強制縮放LogoWidget。
8??同時動畫
Curves類定義了一個可用于CurvedAnimation的常用曲線數組。
