请选择 进入手机版 | 继续访问电脑版

迪文科技论坛

 找回密码
 立即注册
搜索
查看: 2676|回复: 5

【转载】【17.教学视频】T5L C51 绘制2D形状

[复制链接]

537

主题

158

回帖

1万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
10327
发表于 2020-5-25 11:37:50 | 显示全部楼层 |阅读模式
本节课介绍了T5L C51 绘制2D形状  。
本视频教学由迪文开发者论坛用户  ID 熊家余 分享提供。
教学视频:https://www.yuanzige.com/course/detail/80041?section_id=81222
原视频链接:https://www.bilibili.com/video/BV1uz4y197j9


本节课课程内容如下:

1.介绍
本章节将利用DGUS Tool软件中的”基本图形显示控件”来绘制平面2D形状,比如点,线条,矩形等形状,不过这里有一点需要注意一下,那就是一个”基本图形显示控件”只能绘制一种类型的形状,比如说线条和矩形这俩种形状是不可能在同一个”基本图形显示控件”中出现的
    那么我们C51代码如何向基本图形显示控件”中绘制图形呢?这需要按照一定的数据格式向此控件的VP地址处写入数据即可

2.例程设计2.1功能简介
我们在”0启动界面”上放置俩个”基本图形显示控件”,一个用来绘制线条形状,一个用来绘制填充矩形形状


2.2 GUI界面设计
    主要是用到俩个”基本图形显示控件”。

2.3 C51代码设计
我们可以直接利用在第1章节中已经创建好的C51项目工程模板,然后在此基础上进行修改
(1) main.c文件的代码如下:
#include "sys.h"

xdata SHAPE_DATA_LINE line;//线条
xdata SHAPE_DATA_FILL_RECT        fill_rect;//填充矩形

void shape_draw()
{
        //绘制线条
        line.vp = 0x2000;
        line.shape_type = SHAPE_TYPE_LINE;
        line.color = 0xF800;//红色
        line.x0 = 40;
        line.y0 = 220;
        line.x1 = 200;
        line.y1 = 110;
        sys_draw_shape((u16*)&line);

        //绘制填充矩形
        fill_rect.vp = 0x3000;
        fill_rect.shape_type = SHAPE_TYPE_FILL_RECT;
        fill_rect.xs = 270;
        fill_rect.ys = 100;
        fill_rect.xe = 420;
        fill_rect.ye = 230;
        fill_rect.color = 0xF800;//红色
        sys_draw_shape((u16*)&fill_rect);
}
void main(void)
{   
        sys_init();//系统初始化
        shape_draw();//绘制2D形状

        while(1)
        {   

        }
}

(2) sys.c文件中的sys_draw_shape函数代码如下:
//形状类型
typedef enum {
        SHAPE_TYPE_POINT = 0x0001,//画一个1像素的点
        SHAPE_TYPE_LINE = 0x0002, //端点连线
        SHAPE_TYPE_RECT = 0x0003,//画矩形
        SHAPE_TYPE_FILL_RECT = 0x0004,//画填充矩形
        SHAPE_TYPE_AREA_COPY = 0x0006,//界面区域拷贝
        SHAPE_TYPE_VER_LINE =  0x0009//频谱,其实就是垂直线
}SHAPE_TYPE;

//点形状的数据
typedef struct{
        u16 vp;//往哪一个vp地址写入形状,需要用户配置相应的值
        u16 shape_type;//形状类型,需要用户配置相应的值
        u16 shape_num;//此类形状的个数,内部将会直接固定为1
        u16 x;//点的x坐标,需要用户配置相应的值
        u16 y;//点的y坐标,需要用户配置相应的值
        u16 color;//点的颜色,需要用户配置相应的值
        u16 end_flag;//结束标记,内部将会直接固定为0xff00
}SHAPE_DATA_POINT;

//端点连线形状或线段形状的数据
typedef struct{
        u16 vp;//往哪一个vp地址写入形状,需要用户配置相应的值
        u16 shape_type;//形状类型,需要用户配置相应的值
        u16 shape_num;//此类形状的个数,内部将会直接固定为1
        u16 color;//线的颜色,需要用户配置相应的值
        u16 x0;//第一个点的x坐标,需要用户配置相应的值
        u16 y0;//第一个点的y坐标,需要用户配置相应的值
        u16 x1;//第二个点的x坐标,需要用户配置相应的值
        u16 y1;//第二个点的y坐标,需要用户配置相应的值
        u16 end_flag;//结束标记,内部将会直接固定为0xff00
}SHAPE_DATA_LINE;

//矩形或者填充矩形
typedef struct{
        u16 vp;//往哪一个vp地址写入形状,需要用户配置相应的值
        u16 shape_type;//形状类型,需要用户配置相应的值
        u16 shape_num;//此类形状的个数,内部将会直接固定为1
        u16 xs;//左上角的x坐标,需要用户配置相应的值
        u16 ys;//左上角的y坐标,需要用户配置相应的值
        u16 xe;//右下角的x坐标,需要用户配置相应的值
        u16 ye;//右下角的y坐标,需要用户配置相应的值
        u16 color;//线或者填充颜色,需要用户配置相应的值
        u16 end_flag;//结束标记,内部将会直接固定为0xff00
}SHAPE_DATA_RECT;
typedef SHAPE_DATA_RECT         SHAPE_DATA_FILL_RECT;

//界面区域拷贝
typedef struct{
        u16 vp;//往哪一个vp地址写入形状,需要用户配置相应的值
        u16 shape_type;//形状类型,需要用户配置相应的值
        u16 shape_num;//此类形状的个数,内部将会直接固定为1
        u16 pic_id;//界面id,代表从哪一个界面上去拷贝区域,需要用户配置相应的值
        u16 xs;//拷贝区域左上角的x坐标,需要用户配置相应的值
        u16 ys;//拷贝区域左上角的y坐标,需要用户配置相应的值
        u16 xe;//拷贝区域右下角的x坐标,需要用户配置相应的值
        u16 ye;//拷贝区域右下角的y坐标,需要用户配置相应的值
        u16 x;//粘贴到当前界面的x坐标
        u16 y;//粘贴到当前界面的y坐标
        u16 end_flag;//结束标记,内部将会直接固定为0xff00
}SHAPE_DATA_AREA_COPY;

//频谱,垂直线
typedef struct{
        u16 vp;//往哪一个vp地址写入形状,需要用户配置相应的值
        u16 shape_type;//形状类型,需要用户配置相应的值
        u16 shape_num;//此类形状的个数,内部将会直接固定为1
        u16 color;//线的颜色,需要用户配置相应的值
        u16 x0;//x坐标,需要用户配置相应的值
        u16 y0s;//起始y坐标,需要用户配置相应的值
        u16 y0e;//终止y坐标,需要用户配置相应的值
        u16 end_flag;//结束标记,内部将会直接固定为0xff00
}SHAPE_DATA_VER_LINE;

void sys_draw_shape(u16 * shape_data)
{
        #define SHAPE_NUM                1                                //只绘制一个
        #define END_FLAG                0xff00        //绘制结束标记
        u8 len;

        switch(shape_data[1])
        {
                case SHAPE_TYPE_POINT://绘制点
                        ((SHAPE_DATA_POINT*)shape_data)->shape_num = SHAPE_NUM;
                        ((SHAPE_DATA_POINT*)shape_data)->end_flag = END_FLAG;
                        len = sizeof(SHAPE_DATA_POINT)-2;
                        break;
                case SHAPE_TYPE_LINE://端点连线或线段
                        ((SHAPE_DATA_LINE*)shape_data)->shape_num = SHAPE_NUM;
                        ((SHAPE_DATA_LINE*)shape_data)->end_flag = END_FLAG;
                        len = sizeof(SHAPE_DATA_LINE)-2;
                        break;
                case SHAPE_TYPE_RECT://画矩形
                case SHAPE_TYPE_FILL_RECT://画填充矩形
                        ((SHAPE_DATA_RECT*)shape_data)->shape_num = SHAPE_NUM;
                        ((SHAPE_DATA_RECT*)shape_data)->end_flag = END_FLAG;
                        len = sizeof(SHAPE_DATA_RECT)-2;
                        break;
                case SHAPE_TYPE_AREA_COPY://界面区域拷贝
                        ((SHAPE_DATA_AREA_COPY*)shape_data)->shape_num = SHAPE_NUM;
                        ((SHAPE_DATA_AREA_COPY*)shape_data)->end_flag = END_FLAG;
                        len = sizeof(SHAPE_DATA_AREA_COPY)-2;
                        break;
                case SHAPE_TYPE_VER_LINE://频谱,垂直线
                        ((SHAPE_DATA_VER_LINE*)shape_data)->shape_num = SHAPE_NUM;
                        ((SHAPE_DATA_VER_LINE*)shape_data)->end_flag = END_FLAG;
                        len = sizeof(SHAPE_DATA_VER_LINE)-2;
                        break;               
        }

        sys_write_vp(shape_data[0],(u8*)(shape_data+1),len/2);
}



本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
回复

使用道具 举报

9

主题

86

回帖

726

积分

高级会员

Rank: 4

积分
726
发表于 2023-5-11 11:57:16 | 显示全部楼层
基本图形的应用例子只看见“进度条功能”,没见过其它。难道基本图形就只能画着玩儿?
回复

使用道具 举报

0

主题

756

回帖

4553

积分

论坛元老

Rank: 8Rank: 8

积分
4553
发表于 2023-5-11 13:53:06 | 显示全部楼层
可以画矩形圆形区域复制粘贴等功能,结合项目实际需求开发
只会hellowrold
回复

使用道具 举报

5

主题

11

回帖

118

积分

注册会员

Rank: 2

积分
118
发表于 2024-1-25 15:25:10 | 显示全部楼层
基本图形 画点连线之后,可以擦除直线吗?
回复

使用道具 举报

0

主题

393

回帖

4681

积分

论坛元老

Rank: 8Rank: 8

积分
4681
发表于 2024-1-25 16:22:41 | 显示全部楼层
本帖最后由 lijiayan 于 2024-1-25 16:24 编辑

发送指令  连线条数写0 ,就可以清除直线
回复

使用道具 举报

5

主题

11

回帖

118

积分

注册会员

Rank: 2

积分
118
发表于 2024-1-26 10:07:56 | 显示全部楼层
lijiayan 发表于 2024-1-25 16:22
发送指令  连线条数写0 ,就可以清除直线

好的 谢谢
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|迪文科技论坛 ( 京ICP备05033781号-1 )

GMT+8, 2024-3-29 14:27 , Processed in 0.076239 second(s), 22 queries .

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表