设置样式
初始化样式
创建一个带边框样式的矩形。
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)修改样式
元素只能检测到第一层级属性的变化，如：修改 rect.fill.url = url 是不会渲染更新的。
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 }] }