BOTTON控件介绍及程序基本框架与皮肤自定义

1、内容介绍

Emwin程序基本框架
BOTTON控件触发条件
BOTTON控件自定义皮肤（适用所有支持自定义皮肤的控件）

2、源码介绍

2.1、对话框
WM_HWIN CreateWindow(void) {
WM_HWIN hWin;
hWin = GUI_CreateDialogBox(_aDialogCreate, GUI_COUNTOF(_aDialogCreate), _cbDialog, WM_HBKWIN, 0, 0); ①
return hWin;}
注解：①在使用GUIBuilder_V530软件生成c文件之后会看到GUI_CreateDialogBox，创建对话框非阻塞(创建对话框需要两个基本要素：资源表和对话框过程函数；前者定义所要包括的控件，后者定义控件的初始值及其行为。)
2.2、资源列表
#define ID_WINDOW_0 (GUI_ID_USER + 0x00)①
#define ID_BUTTON_0 (GUI_ID_USER + 0x01)
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; // 函数 _SetUserData &_GetUserData 用到的
// 额外字节。
} GUI_WIDGET_CREATE_INFO;
static const GUI_WIDGET_CREATE_INFO _aDialogCreate[] = {
{ WINDOW_CreateIndirect, “Window”, ID_WINDOW_0, 0, 0, 800, 480, 0, 0x0, 0 },
{ BUTTON_CreateIndirect, “Button”, ID_BUTTON_0, 60, 80, 100, 40, 0, 0x0, 10 },②
};
注解：①这块是定义的ID号，可自己定义，每个控件都有要有独立的ID且不能够重复
②对于这个资源列表，一般只需要关注坐标位置和大小，其它的可以直接用软件生成的不需要更改（更改也是没有问题的），这里按钮控件坐标x0=60、y0=80、xSize=100、 ySize=40。

2.3、过程函数
static void _cbDialog(WM_MESSAGE * pMsg) {
int NCode;int Id;
switch (pMsg->MsgId) {
case WM_INIT_DIALOG: ①
hItem = WM_GetDialogItem(ui_time_ratio_hWin, ID_BUTTON_0); ②
button_edit_skin_set(hItem,“123”,NULL,0); ③break;
case WM_NOTIFY_PARENT:④
Id = WM_GetId(pMsg->hWinSrc);NCode = pMsg->Data.v;
switch(Id) {
case ID_BUTTON_0:
switch(NCode) {
case WM_NOTIFICATION_CLICKED:⑤
break;
case WM_NOTIFICATION_RELEASED: ⑥
break;}
break;}
break;
default:
WM_DefaultProc(pMsg);break;}}
注解：①创建对话框后立即进入，一般用于初始化控件。
②获取对话框句柄
③按钮设置，按钮显示外观内容等
④告知父窗口，其子窗口中发生了某些改变
⑤点击消息 WM_NOTIFICATION_CLICKED，如果需要按钮按下后执行某项功能，就可以在这个消息里面加入对应功能。
⑥释放消息 WM_NOTIFICATION_RELEASED，如果需要按钮释放后执行某项功能，就可以在这个消息里面加入对应功能。按钮还有一个移开消息，并不常用，这里不介绍了
2.4、按钮设置
void button_edit_skin_set(BUTTON_Handle hItem,char *str,void *dataSrc,unsigned short judge)
{
user_data_t udata;
udata.data = dataSrc;
udata.judge = judge;
BUTTON_SetUserData(hItem,&udata,sizeof(user_data_t)); ①
BUTTON_SetFont(hItem, &GUI_Font_Micro_20); ②
BUTTON_SetText(hItem,str); ③
BUTTON_SetSkin(hItem, _cbButtonEditUser); ④
}
注解：①设置 BUTTON 控件的额外数据
②选择文本字体
③设置文本
④ 针对按钮控件设定指定按钮皮肤
2.5、皮肤色自定义回调函数
static int _cbButtonEditUser(const WIDGET_ITEM_DRAW_INFO * pDrawItemInfo)
{ //提示：最后绘制的图形会覆盖新的图形
WM_HWIN hWin;
hWin = pDrawItemInfo->hWin;
user_data_t udata;
BUTTON_GetUserData(hWin,&udata,sizeof(user_data_t)); ①
switch (pDrawItemInfo->Cmd) {
case WIDGET_ITEM_DRAW_BACKGROUND: ②
GUI_DrawGradientRoundedH((pDrawItemInfo->x0), pDrawItemInfo->y0, (pDrawItemInfo->x1), pDrawItemInfo->y1,0, UCLOR_WHITE, UCLOR_WHITE); //画圆角矩形
//下边两条线
GUI_SetColor(0xC1C1C1);
GUI_DrawHLine(pDrawItemInfo->y1,pDrawItemInfo->x0,pDrawItemInfo->x1);
//左边两条线
GUI_SetColor(0x5C5C5C);
GUI_DrawVLine(pDrawItemInfo->x0,pDrawItemInfo->y0 - 2,pDrawItemInfo->y1);
GUI_SetColor(0xE4E8E3);
GUI_DrawVLine(pDrawItemInfo->x0 + 1,pDrawItemInfo->y0 - 2,pDrawItemInfo->y1 - 1);
GUI_SetColor(0x000000);//上边两条线
GUI_DrawHLine(pDrawItemInfo->y0,pDrawItemInfo->x0,pDrawItemInfo->x1);
GUI_SetColor(0x808080);
GUI_DrawHLine(pDrawItemInfo->y0 + 1,pDrawItemInfo->x0,pDrawItemInfo->x1);
break;default:
return BUTTON_DrawSkinFlex(pDrawItemInfo); }return 0;}

注解：①提取用 BUTTON_SetUserData() 设置的数据。
②不同的控件，支持的命令类型有所不同，按钮控件项目下面命令，通过 BUTTON_SetSkin （在按钮设置函数里面）就可以重新
定义按钮的皮肤色。另外要注意，自定义皮肤色回调函数时，按钮控件是有按下，聚焦，启用和禁止四种
状态的皮肤色，要根据需要设置相应的状态。
WIDGET_ITEM_CREATE 控件创建后立即发送此命令
WIDGET_ITEM_DRAW_BACKGROUND 绘制背景命令
WIDGET_ITEM_DRAW_BITMAP 绘制位图命令
WIDGET_ITEM_DRAW_TEXT 绘制文本命令1、内容介绍
Emwin程序基本框架
BOTTON控件触发条件
BOTTON控件自定义皮肤（适用所有支持自定义皮肤的控件）