画布-canvas
描述
画布，父对象为ui，无子对象
事件
sizechange： 控件尺寸变化，事件函数定义：onSizeChange()
userevent: 当订阅了某 用户自定义事件，通过service.ctl.emitEvent(name, value)广播时触发, 事件函数定义: onUserEvent(name,value)，参数name为事件名，value为数据
属性
名称 |
功能说明 |
脚本例子 |
|---|---|---|
geometryLocked |
区域锁定，锁定后控件的位置及大小不能修改 |
无 |
x |
x坐标 （只读属性） |
var x = ui.form-name.canvas-name.x; 获取对象的x坐标 |
y |
y坐标 （只读属性） |
var y = ui.form-name.canvas-name.y; 获取对象的y坐标 |
width |
宽 （只读属性） |
var width = ui.form-name.canvas-name.width; 获取对象的宽 |
height |
高 （只读属性） |
var height = ui.form-name.canvas-name.width; 获取对象的高 |
marginRight |
右外边距 （只读属性） |
无 |
marginBottom |
底外边距 （只读属性） |
无 |
enabled |
使能：如果选中，对象处于激活状态，否则处于“禁止”状态，对所有触摸操作无反应。 |
ui.form-name.canvas-name.enabled=0 禁止对象 |
visible |
可见：如果选中，对象可见，否则隐藏 |
ui.form-name.canvas-name.visible=0 隐藏对象 |
方法
名称 |
功能说明 |
脚本例子 |
|---|---|---|
clear(name) |
清除分组图形 |
ui.form-name.canvas-name.clear(‘poly1’);清除分组为poly1的图形 |
clearAll() |
清除所有图形 |
ui.form-name.canvas-name.clearAll();清除所有的图形 |
beginGroup(name) |
开始分组 |
ui.form-name.canvas-name.beginGroup(‘poly1’);开始分组poly1 |
endGroup() |
结束分组 |
ui.form-name.canvas-name.endGroup(‘poly1’);结束分组poly1 |
setPen(width, color, style) |
设置画笔 |
ui.form-name.canvas-name.setPen(1,’#ff0000’,ui.form-name.canvas-name.PEN_SOLID_LINE);设置画笔1像素粗，红色，实线 |
setBrush(color, style) |
设置画刷 |
ui.form-name.canvas-name.setBrush(‘#ff0000’,ui.form-name.canvas-name.BRUSH_SOLID);设置画刷，红色，实心 |
drawPoint(x, y) |
画点 |
ui.form-name.canvas-name.drawPoint(100, 100);在坐标(100,100)处画点 |
drawLine(x1, y1, x2, y2) |
画直线 |
ui.form-name.canvas-name.drawLine(100, 100, 200, 200);在坐标(100,100)处画直线到坐标(200, 200) |
drawRect(x, y, w, h) |
画矩形 |
ui.form-name.canvas-name.drawRect(50, 50, 200, 100);在坐标(50,50)开始画宽为200，高为100的矩形 |
drawEllipse(x, y, w, h) |
画椭圆 |
ui.form-name.canvas-name.drawEllipse(100, 100, 200, 200);在坐标(100,100)处画一个直径为200的圆 |
drawText(x, y, w, h, text) |
画文字 |
ui.form-name.canvas-name.drawText(50, 50, 200, 100, ‘test’);在矩形区域（50，50，200，100）居中画文字 |
textHeight() |
获取文字高度 |
var h = ui.form-name.canvas-name.textHeight(); |
textWidth(text) |
获取文字宽度 |
ui.form-name.canvas-name.textWidth(‘test’); |
rawPolyLine(data) |
画多段线 |
ui.form-name.canvas-name.drawPolyLine([0,0],[50,50],[100,20]);画多段线连接3个坐标点 |
move(x,y) |
移动对象：将对象移动到(x,y)坐标位置，坐标系的原点在屏幕的左上角。 |
ui.form-name.canvas-name.move(10,10) 移动对象到坐标（10，10） |
resize(width, height) |
设置对象宽和高 |
ui.form-name.canvas-name.resize(30,20) 设置对象宽30像素，高20像素 |