跳到主要内容

AnimatedSwitcher

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

示例​

在线示例

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

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)

属性​

duration​

从旧的content值过渡到新的content值的持续时间，以毫秒为单位。默认值为1000毫秒。

reverse_duration​

从新的content值过渡到旧的content值的持续时间，以毫秒为单位。默认值为1000毫秒。

switch_in_curve​

在过渡到新content时使用的动画曲线。属性值是AnimationCurve枚举，默认值为AnimationCurve.LINEAR。

switch_out_curve​

在过渡到旧content时使用的动画曲线。属性值是AnimationCurve枚举，默认值为AnimationCurve.LINEAR。

transition​

在新旧content之间过渡的动画类型。属性值是AnimatedSwitcherTransition枚举，具有以下值：

  • FADE
  • ROTATION
  • SCALE

默认值为FADE。