菜单

2.3.15 画布

下载

画布控件是给用户提供一个绘图区域来自由绘制点、线、矩形等图形图像。默认样式如下：

用户通过画布控件的API接口来使用。

1 参考视频

2 属性

2.1 主背景

设置背景主色、不透明度及是否使用图片。

 

3 坐标系

从画布控件的左上角开始计算坐标位置。

 

4 画布API接口

drawLine

按给定坐标数组画直线

drawArc

在指定位置绘制圆弧

drawPolygon

按给定坐标数组画多边形

drawRect

按给定坐标数组画矩形

drawText

在指定位置绘制文字

drawImage

画图片

1）填充颜色

wMCanvas1->fillBg(0xffcccccc, 255);

2）置点

在（100,100）位置用红色置点

wMCanvas1->setPixelColor(100, 100,0xff0000);

3）绘制圆

以画布的（100,100）为圆心绘制线宽为3，半径50的整圆：

代码：
//圆心点
LvPoint pt;
pt.x = 100;
pt.y = 100;
//圆弧样式(颜色、宽度)
LvDrawArcDsc arcdsc;
arcdsc.color.ch.alpha=0xff;
arcdsc.color.ch.blue=0xff;
arcdsc.color.ch.green=0;
arcdsc.color.ch.red=0;
arcdsc.width=3;
//绘制
wMCanvas1->drawArc(pt.x,pt.y ,50,0,360,&arcdsc);

4）绘制直线

绘制从点（100,100）到点（150,150），线宽为3的蓝色直线：

代码：
LvPoint pt[2];
LvDrawLineDsc linedsc;
linedsc.color.ch.alpha=0xff;
linedsc.color.ch.blue=0xff;
linedsc.color.ch.green=0;
linedsc.color.ch.red=0;
linedsc.width=3;
pt[0].x=100;
pt[0].y=100;
pt[1].x=150;
pt[1].y=150;
wMCanvas1->drawLine(pt, 2, &linedsc);

5）绘制矩形

在（100,100）位置绘制线宽为2，宽50，高40的红色矩形：

代码：
LvDrawRectDsc rect_dsc;
rect_dsc.radius = 0;
rect_dsc.border_width=2;
rect_dsc.border_color.full=0xffff0000; //红色，0xff00ff00(绿色),0xff0000ff(蓝色）
rect_dsc.bg_opa=0;
rect_dsc.border_opa=255;
rect_dsc.outline_opa=0;
rect_dsc.shadow_opa=0;
wMCanvas1->drawRect(100,100,50, 40, &rect_dsc);

6）绘制文本

在（100,100）位置用“文泉驿微米黑”的30号字体绘制字符串“hello”

代码：
LvDrawLabelDsc label_des(fm->getFont("文泉驿微米黑", 30));
label_des.color.full=0xff0000ff;
wMCanvas1->drawText(100, 100, 200, &label_des, "hello");

7）绘制图片

在（100,100）位置绘制图片：

代码：
wMCanvas1->drawImage(100,100,"./images/img17236918949480_70X116R0.png");
注意：必须确保引用图片存在
附：蝴蝶曲线代码
    int cenX=wMCanvas1->getWidth()/2;
	int cenY=wMCanvas1->getHeight()/2;
	LvDrawArcDsc arcdsc;
	arcdsc.color.ch.alpha=0xff;
	arcdsc.color.ch.blue=0;
	arcdsc.color.ch.green=0xff;
	arcdsc.color.ch.red=0;
	arcdsc.width=2;
	float row;
	int angle=500;
	while(curth<angle){
		curth+=0.02;
		//蝴蝶曲线
		row=(exp(cos(curth))-2*cos(4*curth)-std::pow(sin(curth/12),5))*50;
		pt[1].y=cenY-(row*cos(curth)+0.5);
		pt[1].x=cenX+(row*sin(curth)+0.5);
		wMCanvas1->drawArc(pt[1].x,pt[1].y , 2, 0, 360, &arcdsc);
		pt[1].x=pt[0].x;
		pt[1].y=pt[0].y;
		vm->setFloat("当前角度", curth);
	}
 
上一个
2.3.14 二维码
下一个
代码示例
最近修改: 2025-02-10Powered by