Skip to content
导航

Image

图片对象,另外所有图形都支持通过 图片填充 来显示图片。

关键属性

width?: number

宽度,默认使用图片原始宽度。

height?: number

高度, 默认使用图片原始高度。

url: string

图片地址。

只读属性

ready: boolean

图片是否已经加载完成。

image?: ILeaferImage

原始图片封装对象, 图片加载完成才存在。

示例

使用默认宽高

ts
import { Leafer, Image } from 'leafer-ui'

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

const image = new Image({  
    url: '/image/leafer.jpg',
    draggable: true
})

leafer.add(image)

监听图片加载

ts
import { Leafer, Image, ImageEvent } from 'leafer-ui'

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

const image = new Image({ 
    url: '/image/leafer.jpg',
    draggable: true
})

image.once(ImageEvent.LOADED, function (e: ImageEvent) {
    console.log(e)
})

leafer.add(image)

监听错误

ts
import { Leafer, Image, ImageEvent } from 'leafer-ui'

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

const image = new Image({
    url: '/image/leafer.jpg',
    draggable: true
})

image.once(ImageEvent.ERROR, function (e: ImageEvent) { 
    console.log(e.error)
})

leafer.add(image)

图片事件

ImageEvent

继承

Rect

API

Image

Released under the MIT License.