如果有这样的一款GUI软件,你需要吗?（持续更新....）

ID:471574 · 发表于 2024-6-14 13:43

最近在搞单片机编程，需要用到TFT彩屏，实现GUI界面，常规的操作有二个：一、用第三方的GUI软件编辑界面，然后移植他们的库；
二、自己写库，实现点阵图、文字、彩图、画直线、画圆、圆矩形等功能，在第三方图形软件里编辑好界面，然后获取坐标位置、大小，在自己的MCU程序一个个指令生成对应的界面；
先说下这二种操作的优缺点：第一种用第三方库，比较简便，移植需要先研究库，一般库功能比较全面，有些功能用不上，因此会浪费比较多程序空间；
第二种方法要自己写库，第一次写比较花时间，第二次就简单多了。界面不太好编辑处理，每改动一个坐标就要在程序里更新，重新编译，感觉非常不方便，也花时间。
于是，我在想，如果我设计一款软件，功能如下：
一、支持点阵图、文字、彩图、画直线、画圆、圆矩形等绘图，所见即所得，而且每个元件可以随时单独编辑和移动位置；
二、支持不同屏幕大小设置、缩放功能；
三、支持单色屏、16色彩屏、24色彩屏；
四、支持多个画面编辑，比如画面一、画面二......
五、支持点阵文字取模、单图图片取模、彩色图片取模，输出C或TXT文本，也支持输出二进制文件；
六、支第三方取模的数据，并显示出来
七、支持自定义多个元件组合成一个元件，做成模板，在界面里复用。（比如你用一个圆加单色图文，做成一个选项的按钮模板。。。）
八、支持每个元件自定义函数格式，然后排版过程自动把这个函数生成列表，可以自动替换函数里的坐标、大小、颜色等参数，把真实的值填入；
前面1-7项的功能主要是方便编辑GUI界面，第8个功能非常关键，因为可以自定义函数格式，跟你自写的库的函数对应起来，实现把生成的函数列表复制到你的MCU程序里，即可显示一模一样的屏幕画面。
为了方便大家的理解，举个例子：我要画一条直线和一个圆，在软件编辑好了，位置大小，并设置直线元件的自定义指令为DrawLine([X1], [Y1], [X2], [Y2], [FC]);//画直线，也设置了圆形元件的自定义指令为DrawCircle([X], [Y],[R],[FC], [TM]);//画圆 TM=[TM]: 0空心 1填充，这样，我随便移动两个元件的位置，最终会生成具有实际数据的指令：
DrawCircle(8, 8,5,0xF810, 0);//画圆 TM=0: 0空心 1填充，
DrawLine(1, 27, 159, 27, 0x07FF);//画直线
指令的先后顺序跟两个元件的先后顺序有关，顶层的元件指令在后面。
这样，我只要在MCU里程序也实现了对应的方法，就可以把生成的指令复制过去，真正运行起来了。当然，如果是点阵或图片，你要先取模好数据，在程序加入变量储存。。。。。

有了这个软件，搞GUI界面就方便多了，保存的数据内容和实现的库都是自己控制，占有空间比较少，而且有DIY的乐趣，您需要吗？
我计划近期开始编写这个软件，会经常发布我的进度和实现的编程思路，大家可以跟贴发意见

ID:276663 · 发表于 2024-6-14 15:07

我大概理解你说的是【串口屏】

ID:237471 · 发表于 2024-6-14 15:39

支持，这是造福大家的好事

ID:1064915 · 发表于 2024-6-14 20:33

找到创作的动力，否则容易半途而废

ID:471574 · 发表于 2024-6-14 22:43

joyb 发表于 2024-6-14 20:33
找到创作的动力，否则容易半途而废

放心，一定会设计出来

ID:471574 · 发表于 2024-6-14 22:46

IdeaMing 发表于 2024-6-14 15:07
我大概理解你说的是【串口屏】

不是串口屏，你当成是可以DlY库的GUI编辑软件，我搞好一部分就会发出来

ID:471574 · 发表于 2024-6-15 08:45

昨天开始做了界面，主要完成GUI画面的设置功能，如下图

1、设计屏幕尺寸，“交换”是为了方便横竖屏切换；
2、屏幕类型可以设置，单色屏、16bit彩屏、24bit彩屏；（16bit彩屏色彩RGB565）（24bit彩屏色彩RGB888）
3、默认的颜色，前景色、背景色、选中色；背景色主要是为了模拟屏幕显示效果，个人爱好。如果是彩屏，你要想能真正变成背景色的话，要实现填充色来做背景；前景色，对单色屏比较适用，或作为默认元件的前景色；选中色，考虑后面的元件都是可选中并操作的，显示选中的效果；
4、显示倍数，主要是放大显示效果，实际上屏幕及元件的像素还是1：1；
5、右边是画面管理的功能；
6、左下边是计划实现自定义函数的自动生成列表功能，可以直接复制到你的MCU程序里代替画面的生成过程；
7、右下边是屏幕实时效果，还一些坐标、大小等信息；
考虑每个项目都要保存屏幕的信息，我写了一个GuiSetting的类，然后用Serializable允许它序列化，这样就可保存到文件信息里，下次打开时还原屏幕设置的信息；其实用写Ini文件的方法也是可行，但C#里的序列化和反序列化，非常方便把变量的值还原回来，不需要额外的很多处理；
下面是屏幕设置的类，大家看文字应该很好理解对应的信息。
namespace Gui_Designer
{
[Serializable]
public class GuiSetting
{
      public int width;
      public int height;
      public bool radMonoColor;
      public bool rad16bitColor;
      public bool rad24bitColor;
      public int guiscale;
      public Color BackColor;
      public Color ForeColor;
      public Color SelColor;
      public bool showGrid;
}
}
下面是屏幕1倍和3倍的缩放的效果，因为还没有元件功能，还看不出元件的缩放，只能看到屏幕大小缩放了

以上是昨天完成的内容，选给大家看看

ID:651494 · 发表于 2024-6-15 11:39

ZLG不是有这样的GUI么？

ID:156220 · 发表于 2024-6-15 11:53

厉害了楼主，这样的软件很期待

ID:471574 · 发表于 2024-6-15 11:54

feeling1791 发表于 2024-6-15 11:39
ZLG不是有这样的GUI么？

ZLG是用他们的库移植，我这个更多的是一款编辑器，适用于你自己的库，通过生成指令列表的形式，匹配你自己的库函数。

ID:471574 · 发表于 2024-6-15 12:01

zyhlove813 发表于 2024-6-15 11:54
ZLG是用他们的库移植，我这个更多的是一款编辑器，适用于你自己的库，通过生成指令列表的形式，匹配你自 ...

另外ZLG更适合于专业搞GUI设计的人，需要对ZLG库移植熟悉。如果是个人DIY或只想用自己写库的人，我设计的这个软件就非常适合

ID:471574 · 发表于 2024-6-15 14:54

紫色的云发表于 2024-6-15 11:53
厉害了楼主，这样的软件很期待

有您的期待，是我创作的动力源泉

ID:471574 · 发表于 2024-6-15 17:47

今天完成了元件的框架，并实现了单色图文（即点阵图片或文字）元件的基本功能；名称：可以不填，填的话，自定义函数里，可以通过[N]来获取；
参数：可以不填，填的话，自定义函数里，可以通过[P]来获取；
指令：即自定义指令，有自定义指令，就会自动替换指令里的内容，生成符合你DIY库里的函数格式；
类型：即元件类型，有单片图文，彩色图片、直线、圆形、矩形等
起点坐标：即元件的放置位置
图文大小：即图文的长宽
填充/前景：就是单色图文的背景，无背景时相当于透明；有背景时，就成一个图块上显示；

元件类型规划如下

单色图文测试

改个颜色

加个指令，调试信息的内容变成你的指令了，并自动替换了一些坐标

为了实现元件的生成，自定义了一个基类，然后每种元件里实现各自功能

CMDOut 就是替换自定义函数的功能；DrawMe是实现显示的功能，DrawSel是画选中的小方格；
下面是单色图文实现DrawMe显示的代码，其实跟单片机里实现一样的思维。支持垂直和水平扫描

单片机里，我的点阵显示代码如下

有人会问，文字虽然也是点阵的单色图文，不同大小的文字要怎么处理？
这个比较简单，加载单色图文时是要设置长宽大小的，软件只负责显示，指令你可以改成显示汉字或ASCII的指令，跟你的库对应起来即可
功能慢慢完善吧，今天突破比较多了

ID:97678 · 发表于 2024-6-16 07:39

高手，真的很需要！加油！！！

ID:471574 · 发表于 2024-6-17 20:54

今天把单色图文的功能进一步完善，并增加了彩色图片的功能，元顺序功能已经完成；针对单色图文，我这里重点说明一下：
一、单色图文，即是点阵图或点阵文字，点阵图和点阵文字均可以通过取模软件生成数据；
二、单色图文的数据，可以取模软件生成的TXT或C文件数据，软件会使用正则获取0x开头的文本，转化为十六进制数据；
三、支持“垂直扫描，从上到下，再从左到右”或“水平扫描，从左到右，再从上到下”的取模数据；
四、点阵图，要人工设置长宽尺寸；
五、点阵文字，在取模时直接把整体内容生成（要按顺序），比如软件要显示“51单片机”，取模先取字符“51”保存，然后再取中文“单片机"保存，建立两个”单色图文“的元件，一个显示51，一个显示单片机；（正常单片机中，中文和字符是两套驱动方式，因为它们字的宽度不一样）；
六、如果要把中英文用一个”单色图文“的元件来显示，建议取模采用”垂直扫描，从上到下，再从左到右“取模方式，因为他们的高度是一致的，取模后，人工按顺序合并，即把”51“的数据放在前面，后面再放”单片机“的数据；
七、目前暂不支持打乱顺序的字库显示，会考虑增加此功能；
针对彩色图片，这个功能单色屏不支持，16bit彩屏和24bit彩屏支持；
下图是”单色图文“和”彩色图片“的测试（2倍显示比例）

（1倍显示比例，修改后可以完美缩放，坐标值是按屏幕大小160x128来的，就是说无论放大多少，鼠标位置都是正确的值，
X：0-159 ，Y：0-127，即在160x128屏幕内）

明天我会先把我的单片机程序的代码先放出来供参考，值得注意的，你不一定要用我的单片机代码，完全用你自己的代码也是可以完美使用本软件，所以我这个软件自定义函数功能是非常方便跟你自己的库关联起来的，这个是本软件跟其他GUI软件差异的地方。说实在，如果只兼容我自己的库，我也可以把软件做成跟其他GUI软件一样，自动生成代码，放到单片机运行，但这样就跟其他软件一样了，没有必要。我相信大多数人，都喜欢自己写库，才有DIY的精神。
预计本周软件的基本功能会完，大家有什么高端一点的GUI界面也可以发出来，我这边挑战一下，给大家看下生成的效果。本软件基本功能完成后，计划找3个志愿的网友，协助内测一下软件功能，欢迎报名。

ID:378108 · 发表于 2024-6-19 14:45

期待完善

ID:44037 · 发表于 2024-6-19 15:03

谢谢分享期待完善

ID:468878 · 发表于 2024-6-19 15:13

厉害厉害，支持一下。虽然我不怎么玩单片机了。

ID:471574 · 发表于 2024-6-19 17:29

今天先把我的单片机库（GD32F103+ST7735S）放上来给大家参考一下，功能有不清楚的可以问我。主要显示框架为：
ST7735硬件驱动库->Graphic画图库 + FontData.h字体/图片数据库->GUI画面显示库
库说明：
1、ST7735硬件驱动库，针对不同的驱动芯片替换底层驱动
2、Graphic画图库,实现不同的显示指令，发数据给硬件；
3、FontData.h 字体/图片数据库,即把取模的数据封装成结构/数组，供显示指令调用；
4、GUI画面显示库,不同画面的显示指令，我的软件生成的画面自定义指令就是更新这个库；
这个框架有个好处，硬件不同时，只改/换硬件驱动库，要增加指令功能时，只改Graphic画图库，要改取模数据，更新FontData.h的结构；增加修改画面，改GUI画面显示库；
目前Graphic画图库支持如下功能
void Draw_SetTextSpace(uint16_t space); //设置字符的间隔
void Draw_SetOrigin(uint16_t x_pos,uint16_t y_pos); //设置相对原点坐标
void Draw_SetFonts(Font_TypeDef HZ,Font_TypeDef ASCII,uint8_t index); //设置文字属性

void DrawPoint(uint16_t x, uint16_t y, uint16_t color); // 画点
void DrawLine(uint16_t x1, uint16_t y1, uint16_t x2, uint16_t y2, uint16_t color);  // 画线
void DrawCircle(int xc, int yc,int r,uint16_t color, uint8_t fill);//画圆
void DrawRect(uint16_t x1, uint16_t y1, uint16_t x2, uint16_t y2,uint16_t color, uint8_t fill);//画矩形
void DrawFill(uint16_t x1, uint16_t y1, uint16_t x2, uint16_t y2, uint16_t color); //填充区域
void DrawPic(uint16_t x,uint16_t y,uint16_t width,uint16_t height,const uint8_t pic[]);  //显示填充彩色图片
void DrawPicStruct(uint16_t x,uint16_t y,Picture_TypeDef pic);  //根据结构体数据，显示填充彩色图片
void DrawPointData(const uint8_t *StrData, uint16_t x, uint16_t y, uint16_t sizex, uint16_t sizey, uint16_t fcolor, uint16_t bcolor, uint8_t TransparentMode); // 根据位置大小输出点阵数据图

void DrawStr(uint8_t *strText,Font_Combination fonts, uint16_t x, uint16_t y,uint16_t fcolor, uint16_t bcolor, uint8_t TransparentMode); //文字显示（中英文混合）
void DrawHZ(uint8_t *strText,Font_TypeDef fontname, uint16_t x, uint16_t y,uint16_t fcolor, uint16_t bcolor, uint8_t TransparentMode);  //汉字显示
void DrawAscii(uint8_t *strText,Font_TypeDef fontname, uint16_t x,uint16_t y,uint16_t fcolor,uint16_t bcolor, uint8_t TransparentMode); //ASCII字符显示
void DrawNumber(long number,uint8_t pointnums,Font_TypeDef fontname,uint16_t x,uint16_t y,uint16_t fcolor,uint16_t bcolor,uint8_t TransparentMode); //数字显示
void DrawAsc_ByTable(unsigned char *str,Font_TypeDef fontname,uint16_t x,uint16_t y,uint16_t fcolor,uint16_t bcolor, uint8_t TransparentMode); //通用ASCII库字符显示

大家有空先熟悉下吧，我抽时间再解说和优化一下

ID:482794 · 发表于 2024-6-19 21:34

期待完善

ID:471574 · 发表于 2024-6-20 19:19

这两天出差客户这边，在忙设备3D设计，软件编程停了一下，本周基本功能可以如期

ID:774081 · 发表于 2024-6-21 13:39

很有意义的研究，厉害！

ID:471574 · 发表于 2024-6-28 08:23

软件已经编好了，一直没时间上来更新动态。今晚更新，有需要的请留邮箱

ID:471574 · 发表于 2024-6-28 20:14

终于完工了，完整的软件界面如下：
画面支持：单色屏、16bit彩屏，24bit彩屏，缩放，多画面项目

元件支持：单色图文、彩色图片、直线、圆、矩形
直线、圆、矩形为指令动态生成（可参考我的单片机Graphic库），因此支持拖拉改变大小和点位；
多排列元件先后顺序、可多选移动、锁定。。。。

指令库为方便生成指令列表使用，每个人根据自己的库函数来建立指令库；

工具：主要是颜色收藏和应用功能；

ID:433219 · 发表于 2024-6-29 08:27

楼煮，做稳定后，再商品化，就是市面上的“串口屏”了，，，，

ID:97678 · 发表于 2024-7-3 07:24

我想要，可以发给我一份吗？
1575046299@QQ.com

ID:125430 · 发表于 2024-7-8 16:46

楼主威武，大写的服，佩服的五体投地！

ID:245466 · 发表于 2024-7-8 21:13

楼主的效率很高啊，这么快就搞出第一版了!

ID:97678 · 发表于 2024-7-9 07:51

zyhlove813 发表于 2024-6-28 08:23
软件已经编好了，一直没时间上来更新动态。今晚更新，有需要的请留邮箱

1575046299@qq.com 给我发一份。谢谢！

ID:641483 · 发表于 2024-7-9 12:34

zyhlove813 发表于 2024-6-28 20:14
终于完工了，完整的软件界面如下：
画面支持：单色屏、16bit彩屏，24bit彩屏，缩放，多画面项目

楼主大神威武，这工具对我还在摸索的小白来说就是神器，如果方便的话麻烦给转我一份：tinke@126.com 谢谢

ID:471574 · 发表于 2024-7-9 14:20

做了个字体取模工具，虽然网上有很多，自己练练手

ID:64089 · 发表于 2024-7-10 08:54

楼主腻害，说真的有时候也想自己搞，奈何水平有限，只能仰望，希望能得到一份，邮箱nsj21n@163.com，谢谢。

ID:935976 · 发表于 2024-7-11 17:01

楼主效率真高啊，我做东西都太慢，估计不熟的原因。

能发我一份吗？谢谢！

lsl3312004@126.com

ID:97678 · 发表于 2024-7-13 14:55

有使用教程吗？

ID:97678 · 发表于 2024-7-13 15:50

什么错误？

ID:97678 · 发表于 2024-7-13 15:56

这个是什么错误？

ID:97678 · 发表于 2024-7-13 16:32

不能保存项目？

ID:471574 · 发表于 2024-7-13 18:40

jovew 发表于 2024-7-13 15:56
这个是什么错误？

你没有添加单色图文的数据

ID:712493 · 发表于 2024-7-13 20:23

zyhlove813 发表于 2024-6-20 19:19
这两天出差客户这边，在忙设备3D设计，软件编程停了一下，本周基本功能可以如期

软件玩得那么好，没想3D也这么厉害羡慕一下

ID:44037 · 发表于 2024-7-14 11:26

zyhlove813 发表于 2024-6-28 08:23
软件已经编好了，一直没时间上来更新动态。今晚更新，有需要的请留邮箱

学习一下很好的构思 1549942696@qq.com

帐号		自动登录	找回密码
密码			立即注册

如果有这样的一款GUI软件,你需要吗?（持续更新....）

评分