Flutter為跨平臺應(yīng)用程序提供了出色的動畫支持。本文探討了一種新的非常規(guī)方法，它是一種向應(yīng)用程序添加動畫的簡便方法。這些新的“動畫和運動”小部件到底是什么？我們?nèi)绾问褂盟鼈儊硖砑雍唵魏蛷?fù)雜的動畫？

Flutter是一個跨平臺框架，在過去兩年中已經(jīng)成熟，包括Web和桌面支持。它開發(fā)的應(yīng)用程序流暢且美觀，因此贏得了聲譽(yù)。憑借其豐富的動畫支持，聲明性的UI編寫方式，“熱重載”以及其他功能，它現(xiàn)已成為一個完整的跨平臺框架。

如果您是從Flutter開始的，并且想學(xué)習(xí)一種非常規(guī)的添加動畫的方法，那么您來對地方了：我們將探索動畫和運動小部件的領(lǐng)域，這是一種添加動畫的隱式方法。

Flutter基于小部件的概念。應(yīng)用程序的每個可視組件都是一個小部件-將其視為Android中的視圖。Flutter使用Animation類，用于管理的“ AnimationController”對象和用于插值數(shù)據(jù)范圍的“ Tween”來提供動畫支持。這三個組件協(xié)同工作以提供流暢的動畫。由于這需要手動創(chuàng)建和管理動畫，因此被稱為動畫的一種顯式方式。

現(xiàn)在，讓我向您介紹動畫和運動小部件。Flutter提供了許多固有支持動畫的小部件。無需創(chuàng)建動畫對象或任何控制器，因為所有動畫均由此類小部件處理。只需為所需的動畫選擇適當(dāng)?shù)男〔考缓髮⑵鋵傩灾祩鬟f給動畫即可。該技術(shù)是一種隱式動畫方法。

上面的圖表大致列出了Flutter中的動畫層次，以及如何同時支持顯式和隱式動畫。

本文介紹的一些動畫小部件包括：

AnimatedOpacity

AnimatedCrossFade

AnimatedAlign

AnimatedPadding

AnimatedSize

AnimatedPositioned。

Flutter不僅提供了預(yù)定義的動畫小部件，還提供了名為的通用小部件AnimatedWidget，可用于創(chuàng)建自定義的隱式動畫小部件。從名稱可以明顯看出，這些小部件屬于“動畫”和“運動”小部件類別，因此它們具有一些共同的屬性，這些屬性使我們能夠使動畫更加平滑和美觀。

現(xiàn)在讓我解釋這些通用屬性，因為稍后將在所有示例中使用它們。

duration

設(shè)置參數(shù)動畫的持續(xù)時間。

reverseDuration

反向動畫的持續(xù)時間。

curve

設(shè)置參數(shù)動畫時要應(yīng)用的曲線。內(nèi)插值可以從線性分布中獲取，或者，如果指定的話，也可以從曲線中獲取。

讓我們通過創(chuàng)建一個簡單的應(yīng)用程序（稱為“已報價”）開始旅程。每次應(yīng)用啟動時，它將顯示隨機(jī)報價。需要注意的兩件事：首先，所有這些報價都將在應(yīng)用程序中進(jìn)行硬編碼。其次，不會保存任何用戶數(shù)據(jù)。