
- Kivy 教程
- Kivy - 首頁
- Kivy 基礎
- Kivy - 入門
- Kivy - 安裝
- Kivy - 架構
- Kivy - 檔案語法
- Kivy - 應用
- Kivy - Hello World
- Kivy - 應用生命週期
- Kivy - 事件
- Kivy - 屬性
- Kivy - 輸入
- Kivy - 行為
- Kivy 按鈕
- Kivy - 按鈕
- Kivy - 按鈕事件
- Kivy - 按鈕顏色
- Kivy - 按鈕大小
- Kivy - 按鈕位置
- Kivy - 圓形按鈕
- Kivy - 停用按鈕
- Kivy - 圖片按鈕
- Kivy 元件
- Kivy - 元件
- Kivy - 標籤
- Kivy - 文字輸入
- Kivy - 畫布
- Kivy - 線
- Kivy - 複選框
- Kivy - 下拉列表
- Kivy - 視窗
- Kivy - 滾動檢視
- Kivy - 走馬燈
- Kivy - 滑塊
- Kivy - 圖片
- Kivy - 彈出視窗
- Kivy - 開關
- Kivy - 旋轉器
- Kivy - 分隔器
- Kivy - 進度條
- Kivy - 氣泡
- Kivy - 標籤頁面板
- Kivy - 散點圖
- Kivy - 手風琴
- Kivy - 檔案選擇器
- Kivy - 顏色選擇器
- Kivy - 程式碼輸入
- Kivy - 模態檢視
- Kivy - 切換按鈕
- Kivy - 相機
- Kivy - 樹形檢視
- Kivy - reStructuredText
- Kivy - 操作欄
- Kivy - 播放器
- Kivy - 模板檢視
- Kivy - 虛擬鍵盤
- Kivy - 觸控漣漪
- Kivy - 音訊
- Kivy - 影片
- Kivy - 拼寫檢查
- Kivy - 效果
- Kivy - 輸入記錄器
- Kivy - OpenGL
- Kivy - 文字
- Kivy - 文字標記
- Kivy - 設定
- Kivy 佈局
- Kivy - 佈局
- Kivy - 浮動佈局
- Kivy - 網格佈局
- Kivy - 盒式佈局
- Kivy - 堆疊佈局
- Kivy - 錨點佈局
- Kivy - 相對佈局
- Kivy - 頁面佈局
- Kivy - 回收佈局
- Kivy - 佈局巢狀
- Kivy 高階概念
- Kivy - 配置物件
- Kivy - 圖集
- Kivy - 資料載入器
- Kivy - 快取管理器
- Kivy - 控制檯
- Kivy - 動畫
- Kivy - 多筆畫
- Kivy - 時鐘
- Kivy - SVG
- Kivy - UrlRequest
- Kivy - 剪貼簿
- Kivy - 工廠
- Kivy - 手勢
- Kivy - 語言
- Kivy - 圖形
- Kivy - 繪製
- Kivy - 打包
- Kivy - 花園
- Kivy - 儲存
- Kivy - 向量
- Kivy - 工具
- Kivy - 檢查器
- Kivy - 工具
- Kivy - 日誌記錄器
- Kivy - 幀緩衝區
- Kivy 應用和專案
- Kivy - 繪圖應用
- Kivy - 計算器應用
- Kivy - 計時器應用
- Kivy - 相機處理
- Kivy - 圖片檢視器
- Kivy - 貝塞爾曲線
- Kivy - 畫布壓力測試
- Kivy - 圓形繪製
- Kivy - 元件動畫
- Kivy - 其他
- Kivy 有用資源
- Kivy - 快速指南
- Kivy - 有用資源
- Kivy - 討論
Kivy - 動畫
將動畫效果應用於小部件是 Kivy 框架最吸引人的功能之一。在 Kivy 中,動畫功能在 kivy.animation 模組中包含的 Animation 類中定義。同一個模組還包含 AnimationTransition 類。它是一組應用動畫過渡效果的函式。
要使用動畫效果,Kivy 應用程式應:
首先確定要為哪個小部件屬性設定動畫,
設定 Animation 類的物件,
設定屬性的最終值,
呼叫 Animation 物件的 start() 方法,並將小部件作為引數傳遞。
要為小部件的 x 或 y 位置設定動畫,只需指定動畫結束時希望小部件放置的目標 x/y 值:
rom kivy.animation import Animation anim = Animation(x=100, y=100) anim.start(widget)
這將從小部件的原始位置到 100,100 為其 x 和 y 位置設定動畫,預設持續時間為一秒。
您可以要求為多個屬性設定動畫。例如,要為位置和大小設定動畫,請使用:
anim = Animation(x=50, size=(80, 80)) anim.start(widget)
您還可以指定 Animation 物件的 transition(或 t)屬性以應用過渡效果。
在兩個 Animation 物件之間使用“+”運算子將動畫按順序連線。
anim = Animation(x=50) + Animation(size=(80, 80), duration=2)
這將使小部件在 1 秒內動畫到 x=50,然後在接下來的 2 秒內將大小動畫到 (80, 80)。
另一方面,“&”運算子並行連線動畫。以下示例將在 1 秒內同時為位置動畫到 (80, 10),大小動畫到 (800, 800):
anim = Animation(pos=(80, 10)) anim &= Animation(size=(800, 800), duration=2.)
如果程式正在實現“順序”動畫,可以透過設定 anim.repeat = True 將動畫設定為迴圈重複。
Animation 類具有以下屬性和方法:
duration 或 d - 動畫持續時間(以秒為單位),預設為 1。
transition 或 t - 動畫屬性的過渡函式。它可以是 AnimationTransition 中方法的名稱。
step 或 s - 浮點數。動畫的步長(以毫秒為單位)。預設為 0,這意味著動畫會針對每一幀更新。如果要以 30 FPS 的速度設定動畫,請使用 s=1/30。
cancel() - 取消之前應用於小部件的動畫。
cancel_all() - 取消所有與特定小部件/屬性列表相關的動畫。
start() - 在小部件上啟動動畫。
stop() - 停止之前應用於小部件的動畫,觸發 on_complete 事件。
stop_all() - 停止所有與特定小部件/屬性列表相關的動畫。
示例
藉助以下“kv”指令碼,按鈕和標籤被放置在垂直框佈局中。按鈕繫結到animating()方法。
<MyLayout> BoxLayout: orientation: "vertical" size: root.width, root.height padding: 50 spacing: 20 Label: id: my_label text: "Hello World!" font_size: 32 Button: text: "Start" font_size: 32 size_hint: .5, .5 pos_hint: {"center_x": 0.5} on_release: root.animating(self)
此“kv”指令碼載入到 App 類中。animating() 方法在單擊時對按鈕應用位置、背景顏色和大小動畫效果。
from kivy.app import App from kivy.uix.widget import Widget from kivy.lang import Builder from kivy.animation import Animation from kivy.core.window import Window Window.size = (720, 400) class MyLayout(Widget): def animating(self, widget, *args): animate = Animation( pos=(widget.pos[0], Window.height - 50) ) animate += Animation(pos=(widget.pos[0], 0)) animate += Animation( background_color=(0, 0, 1, 1), duration=1 ) animate += Animation(size_hint=(1, 1)) animate += Animation(size_hint=(.5, .5)) animate += Animation(pos_hint={"center_x": 0.1}) animate += Animation(pos_hint={"center_x": 0.5}) animate.start(widget) # Create a callback animate.bind(on_complete=self.my_callback) def my_callback(self, *args): self.ids.my_label.text = "Hello Kivy" class AwesomeApp(App): def build(self): return MyLayout() if __name__ == '__main__': AwesomeApp().run()
輸出
執行上述程式。您應該看到一個標籤,並在其下方看到一個按鈕。

單擊按鈕以啟動動畫效果。按鈕上下移動、左右移動、大小增減以及顏色變化。
