发 帖  
原厂入驻New
[文章]

【emWin实战教程V2.0】第45章 BUTTON-按钮控件

2017-2-27 19:45:26  9256
分享
1
本章节为大家讲解STemWin支持的按钮控件,按钮控件还是非常实用的,实际项目中用到的地方很多,控件的本质就是窗口,或者说是具有特定外观效果的窗口,对于初学者来说,是务必要掌握好的一个控件。
        45.1 初学者重要提示
        45.2 按钮控件基础知识
        45.3 使用GUIBuilder创建按钮控件并用模拟器显示出来
        45.4 官方WIDGET_SimpleButton.c实例
        45.5 实验例程说明(RTOS)
        45.6 实验例程说明(裸机)
        45.7 总结
尹星 2017-2-27 19:45:47
45.1  初学者重要提示

1、对于初学者来说,学习按钮控件最先要解决的问题就是如何让按钮支持的点击消息,松手消息和移开消息跟用户的应用关联起来,初学者要带着此疑问来学习本章节。
2、本教程配套的emWin版本是5.32,从emWin5.28版本开始,皮肤色是自动使能的,所以部分按钮控件的API函数是失效的,主要是按钮控件的颜色设置函数。
回复

举报

尹星 2017-2-27 19:46:05
3、按钮控件的所有API函数在emWin手册中都有讲解,下图是中文版手册里面API函数位置:




回复

举报

尹星 2017-2-27 19:46:25
下图是英文版手册里面API函数的位置:

回复

举报

尹星 2017-2-27 19:46:42
45.2 按钮控件基础知识

        按钮控件还是非常实用的,实际项目中用到的地方很多,控件的本质就是窗口,或者说是具有特定外观效果的窗口。
不开启皮肤色时,按钮控件的显示效果如下:

回复

举报

尹星 2017-2-27 19:47:00
开启皮肤后显示效果如下:

回复

举报

尹星 2017-2-27 19:47:14
45.2.1   按钮控件支持的通知代码

        按钮控件支持的通知代码主要是用来处理按钮消息用的,按钮控件主要支持三种消息事件,点击消息,释放消息和移开消息(点击了按钮,且从按钮所在的区域移开了但没有释放)。比如用户通过触摸屏点击了按钮,窗口管理器会给按钮父窗口回调函数发送消息WM_NOTIFY_PARENT来通知父窗口,进而再区分是点击消息,释放消息还是移开消息,用户就可以在相应的消息代码里面加入要实现的功能。
        以下事件是作为WM_NOTIFY_PARENT消息的一部分由按钮控件发送给其父窗口,用来区分不同的按钮消息。

回复

举报

尹星 2017-2-27 19:47:26
45.2.2   按钮控件支持的键盘反应(输入聚焦)


        按钮控件支持输入聚焦,也支持外置键盘或者类似外置键盘的输入设备给按钮控件发消息。当前仅支持以下两种按键消息:
        (输入聚焦是一个重要的知识点,使用外置键盘或者类似外置键盘的输入设备要用到)

特别注意一点,对于按钮控件来说,要先聚焦到这个控件上了,给按钮控件发送按键消息才会有反应。
回复

举报

尹星 2017-2-27 19:47:50
45.2.3   按钮控件API函数


        按钮控件的API函数比较多,但调用都不难,大家只需看官方手册中的API函数说明就够用了,后面用到的函数中有需要特别注意的再跟大家进行讲解。
        本章节教程配套例子是将按钮控件配合对话框一起使用的,实际项目中也推荐大家这么做,可以很方便的进行界面管理。在对话框上面使用按钮控件是通过函数BUTTON_CreateIndirect ()来实现的。根据第41章41.7.1小节讲解的<WIDGET>_CreateIndirect()函数,GUI_WIDGET_CREATE_INFO结构体类型定义如下:
typedef struct {
GUI_WIDGET_CREATE_FUNC * pfCreateIndirect;    // 间接创建函数
const char * pName;                           // 控件名(不是所有控件都需要)
I16 Id;                                       // 控件ID
I16 x0, y0, xSize, ySize;                     // 控件的坐标位置和大小
I16 Flags;                                    // 控件用到的标志,没有就写0
I32 Para;                                     // 控件用到的参数,没有就写0
U32 NumExtraBytes;                            // 函数 <WIDGET>_SetUserData & <WIDGET>_GetUserData用到的
// 额外字节。
} GUI_WIDGET_CREATE_INFO;
回复

举报

尹星 2017-2-27 19:48:19
上面结构体成员里面的标记Flags和参数Para是可选的,函数BUTTON_CreateIndirect()都没有用到。这里举一个对话框资源列表里面创建按钮控件的例子,帮助大家更好的理解:
/*
*********************************************************************************************************
*                           宏定义
*********************************************************************************************************
*/
#define ID_FRAMEWIN_0 (GUI_ID_USER + 0x00)
#define ID_BUTTON_0   (GUI_ID_USER + 0x01)
#define ID_BUTTON_1   (GUI_ID_USER + 0x02)

/*
*********************************************************************************************************
*                           GUI_WIDGET_CREATE_INFO类型数组
*********************************************************************************************************
*/
static const GUI_WIDGET_CREATE_INFO _aDialogCreate[] =
{
{ FRAMEWIN_CreateIndirect, "Framewin", ID_FRAMEWIN_0, 0, 0, 800, 480, 0, 0x0, 0 },
  { BUTTON_CreateIndirect, "Button", ID_BUTTON_0, 35, 37, 159, 49, 0, 0x0, 0 },
  { BUTTON_CreateIndirect, "Button", ID_BUTTON_1, 36, 127, 159, 46, 0, 0x0, 0 },
};
回复

举报

尹星 2017-2-27 19:48:33
上面的对话框资源列表里面依次创建了框架窗口控件,两个按钮控件。第一个按钮控件的参数和GUI_WIDGET_CREATE_INFO结构成员的对应关系如下:

pfCreateIndirect = BUTTON_CreateIndirect;
pName = "Button";
Id = ID_BUTTON_0;
x0 = 35;
y0 = 37;
xSize = 159;
ySzie = 49;
Flags = 0;
Para = 0x0;
NumExtraBytes = 0;
回复

举报

尹星 2017-2-27 19:48:57
对于这个对应关系要注意以下两点:
1、这里的x0和y0坐标位置是相对于对话框资源列表中框架窗口的客户端窗口的位置坐标。
2、Id号,这里的Id号是用户自定义的,emWin在GUI.h文件中也定义了部分按钮Id号,用户是可以直接使用的:
#define GUI_ID_BUTTON0    0x170
#define GUI_ID_BUTTON1    0x171
#define GUI_ID_BUTTON2    0x172
#define GUI_ID_BUTTON3    0x173
#define GUI_ID_BUTTON4    0x174
#define GUI_ID_BUTTON5    0x175
#define GUI_ID_BUTTON6    0x176
#define GUI_ID_BUTTON7    0x177
#define GUI_ID_BUTTON8    0x178
#define GUI_ID_BUTTON9    0x179
回复

举报

尹星 2017-2-27 19:49:10
45.3使用GUIBuilder创建按钮控件并用模拟器显示出来

        首先需要大家按照第2章2.3.4小节的说明下载STemWin的软件包,其中GUIBuilder5.32位于路径:STM32Cube_FW_F4_V1.13.0\Middlewares\ST\STemWin\Software里面

回复

举报

尹星 2017-2-27 19:49:31
45.3.1   第一步:建立一个对话框
1、找到GUIBuilder后,打开这个软件,并按照如下方式建立一个对话框。

回复

举报

尹星 2017-2-27 19:49:52
2、修改框架窗口大小为800*480。


回复

举报

尹星 2017-2-27 19:50:05
3、下面设置对话框标题的字体,对齐方式,和显示的文本。首先,在建立的对话框上面右击鼠标,选择Set font。


回复

举报

尹星 2017-2-27 19:50:19
弹出如下界面,并选择字体GUI_FONT_32B_ASCII,点击OK。

回复

举报

尹星 2017-2-27 19:50:49
设置好字体以后再设置对齐方式,还是右击鼠标,选择Set text alignment,并选择居中

回复

举报

尹星 2017-2-27 19:51:32
配置完成后,上面的文本Framewin会居中显示,然后还是鼠标右击,选择Set title text,并更改Framewin为armfly,修改的地方在左下角:


设置好以后,对话框就算建立完毕。
回复

举报

尹星 2017-2-27 19:51:55
45.3.2   第二步:在对话框上面建立按钮


        按钮的建立方法和上面的对话框是一样的。按钮上面的字体大小和显示内容,大家可以任意设置。按钮上的文本不支持对齐方式设置,默认是居中显示,这里是显示字符LED1,字体GUI_FONT_24B_ASCII,建立后的效果如下所示:

回复

举报

评论

高级模式
您需要登录后才可以回帖 登录 | 注册

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容图片侵权或者其他问题,请联系本站作侵删。 侵权投诉
1234下一页
发文章
关闭

站长推荐 上一条 /8 下一条

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