AnimatedSwitcher

一种控制器，默认情况下会在新的控制和先前设置在AnimatedSwitcher上的控制之间进行交叉淡入淡出。

示例

在线示例

使用缩放效果在两个容器之间进行动画切换

Python

import flet as ft

def main(page: ft.Page):

    c1 = ft.Container(
        ft.Text("Hello!", style=ft.TextThemeStyle.HEADLINE_MEDIUM),
        alignment=ft.alignment.center,
        width=200,
        height=200,
        bgcolor=ft.colors.GREEN,
    )
    c2 = ft.Container(
        ft.Text("Bye!", size=50),
        alignment=ft.alignment.center,
        width=200,
        height=200,
        bgcolor=ft.colors.YELLOW,
    )
    c = ft.AnimatedSwitcher(
        c1,
        transition=ft.AnimatedSwitcherTransition.SCALE,
        duration=500,
        reverse_duration=100,
        switch_in_curve=ft.AnimationCurve.BOUNCE_OUT,
        switch_out_curve=ft.AnimationCurve.BOUNCE_IN,
    )

    def animate(e):
        c.content = c2 if c.content == c1 else c1
        c.update()

    page.add(
        c,
        ft.ElevatedButton("Animate!", on_click=animate),
    )

ft.app(target=main)

属性

content

要显示的内容。当 content 发生变化时，AnimatedSwitcher 将为从旧的 content 到新的 content 的过渡进行动画处理。

值的类型为 control 。

duration

从旧的 content 值到新的 content 值的过渡的持续时间（以毫秒为单位）。

值的类型为 int ，默认值为 1000 毫秒。

reverse_duration

从新的 content 值到旧的 content 值的过渡的持续时间（以毫秒为单位）。

值的类型为 int ，默认值为 1000 毫秒。

switch_in_curve

引入新 content 时使用的动画曲线。

值的类型为 AnimationCurve ，默认值为 AnimationCurve.LINEAR 。

switch_out_curve

将之前的 content 切换出去时使用的动画曲线。

值的类型为 AnimationCurve ，默认值为 AnimationCurve.LINEAR 。

transition

在新和旧 content 之间进行过渡的动画类型。

值的类型为 AnimatedSwitcherTransition ，默认值为 AnimatedSwitcherTransition.FADE 。