Skip to content

设置样式

初始化样式

创建一个带边框样式的矩形。

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

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

const rect = new Rect({ 
    x: 100,
    y: 100,
    width: 200,
    height: 200,
    fill: '#32cd79',
    stroke: 'black', 
    strokeWidth: 2
})

leafer.add(rect)

修改样式

ts
rect.stroke = 'blue'
rect.strokeWidth = 4

简洁修改

ts
rect.set({
    stroke: 'blue',
    strokeWidth: 4
})

重置样式

ts
rect.reset() // 完全重置

rect.reset({ // 重置为新样式
    stroke: 'blue',
    strokeWidth: 4
})

使用 JSON

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

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

const group = new Group()

leafer.add(group)

const json = { "x": 20, "y": 20, "children": [{ "tag": "Rect", "x": 100, "y": 100, "width": 200, "height": 200, "fill": "#32cd79", "draggable": true }] } 

group.set(json)

下一步

事件处理

Released under the MIT License.