flip

镜像/翻转元素。

关键方法

flip( axis：'x' | 'y', transition?: ITranstion )

在 世界坐标系 中， 按轴方向 镜像/翻转元素。

transition 参数表示是否进行 动画 过渡。

// 按X轴镜像元素
rect.flip('x')

// 动画过渡
rect.flip('x', true)

rect.flip('x', 2) // 过渡 2 秒

归属

UI

示例

按 X 轴镜像元素

// #通过 flip() 镜像元素 [无动画过渡]
import { Leafer, Rect } from 'leafer-ui'

const leafer = new Leafer({ view: window })

const rect = Rect.one({ fill: '#32cd79' })

leafer.add(rect)

setTimeout(() => {

    // 按 X 轴镜像元素
    rect.flip('x') 

}, 1000)

按 X 轴镜像元素，有动画过渡

// #通过 flip() 镜像元素 [有动画过渡]
import { Leafer, Rect } from 'leafer-ui'
import '@leafer-in/animate' // 导入动画插件

const leafer = new Leafer({ view: window })

const rect = Rect.one({ fill: '#32cd79' })

leafer.add(rect)

setTimeout(() => {

    // 按 X 轴镜像元素
    rect.flip('x', true) 

}, 1000)