转stemwin教程
本期教程讲解STemWin支持的滚动条控件。
54. 1滚动条控件介绍
54. 2 官方DIALOG_Scrollbar实例
54. 3 使用官方GUIBulder建立单选按钮控件
54. 4 总结
54.1 滚动条控件介绍
滚动条用于滚动列表框或任何其他类型的窗口。它们可以水平 （如下所示）或垂直创建。
通常，滚动条将附加到现有窗口，例如下图所示的列表框：
设置皮肤后显示效果如下：
1
|
|
|
|
|
|
|
54.1.1 滚动条支持的通知代码
以下事件是滚动条作为WM_NOTIFY_PARENT消息的一部分发送给其父窗口的：
消息 |
描述 |
WM_NOTIFICATION_CLICKED |
已单击滚动条。。 |
WM_NOTIFICATION_RELEASED |
已释放滚动条。 |
WM_NOTIFICATION_SCROLLBAR_ADDED |
滚动条刚刚被添加 （附加）至现有窗口。需要通知窗口，以便使其能初始化滚动条。 |
WM_NOTIFICATION_VALUE_CHANGED |
滚动条的值可以通过移动缩略图或按下箭头按钮进行更改 |
|
|
|
|
|
|
|
|
|
54.1.2 滚动条支持的键盘反应
如果控件具有输入焦点，则它将对下列各键做出反应：
按键 |
反应 |
GUI_KEY_RIGHT |
将滚动条的当前值增加1。 |
GUI_KEY_DOWN |
将滚动条的当前值增加1。 |
GUI_KEY_PGDOWN |
将滚动条的当前值增加1页。 |
GUI_KEY_LEFT |
将滚动条的当前值减小1。 |
GUI_KEY_UP |
将滚动条的当前值减小1。 |
GUI_KEY_PGUP |
将滚动条的当前值减小1页。 |
|
|
|
|
|
|
|
|
|
54.2 官方WIDGET_Scrollbar实例
官方的这个实例很好的演示了scrollbar的使用，这个例子在模拟器中的位置：
![]()
|
|
|
|
|
|
|
|
|
源码如下（程序中进行了详细的注释）：
复制代码
#include "GUI.h"
#include "SCROLLBAR.h"
#include "EDIT.h"
#include
/*******************************************************************
*
* defines
*
********************************************************************
*/
/* 制作行3列的方框*/
#define EDIT_MAX_X 10
#define EDIT_MAX_Y 3
/*******************************************************************
*
* static variables
*
********************************************************************
*/
static EDIT_Handle _aahEdit[EDIT_MAX_Y][EDIT_MAX_X];
static int _x,_y; /* 注意默认是初始化为的要不就不对了*/
/*******************************************************************
*
* _cbWindow
* 桌面窗口的回调函数，当接受到滚动条的WM_NOTIFICATION_VALUE_CHANGED消息时，移动所有的编辑框
*
*/
static void _cbWindow(WM_MESSAGE *pMsg) {
/*结构体WM_SCROLL_STATE的定义如下：
typedef struct {
int NumItems;
int v;
int PageSize;
} WM_SCROLL_STATE;
*/
WM_SCROLL_STATE ScrollState;
switch (pMsg->MsgId) {
case WM_NOTIFY_PARENT:
/* 接受到的是WM_NOTIFICATION_VALUE_CHANGED消息*/
if (pMsg->Data.v == WM_NOTIFICATION_VALUE_CHANGED) {
/* 消息时来自水平的滚动条*/
if (WM_GetId(pMsg->hWinSrc) == GUI_ID_HSCROLL) {
WM_GetScrollState(pMsg->hWinSrc, &ScrollState);
/* 根据当前滚动条的位置，移动编辑框*/
if (_x != ScrollState.v) {
int x, y;
for (y = 0; y < EDIT_MAX_Y; y++) {
for (x = 0; x < EDIT_MAX_X; x++) {
WM_MoveWindow(_aahEdit[y][x], _x - ScrollState.v, 0);
}
}
_x = ScrollState.v;
}
}
}
break;
case WM_PAINT:
GUI_SetBkColor(GUI_RED);
GUI_Clear();
break;
default:
WM_DefaultProc(pMsg);
}
}
/*******************************************************************
*
* _DemoScrollbarMove
*/
static void _DemoScrollbarMove(void) {
int x, y;
WM_HWIN hWindow;
SCROLLBAR_Handle hScroll;
/*基本设置*/
GUI_SetBkColor(GUI_BLUE);
GUI_Clear();
GUI_SetColor(GUI_WHITE);
GUI_SetFont(&GUI_Font24_ASCII);
GUI_SetTextAlign(GUI_TA_HCENTER);
GUI_DispStringAt("SCROLLBAR_Move - Sample", 160, 5);
GUI_SetTextAlign(GUI_TA_LEFT);
GUI_SetColor(0xFFFFFF);
GUI_SetFont(&GUI_Font8x16);
/* 创建窗口*/
hWindow = WM_CreateWindow(50, 90, 220, 79, WM_CF_SHOW, &_cbWindow, 0);
/* 创建窗口的子控件*/
hScroll = SCROLLBAR_CreateAttached(hWindow, 0);
/* 设置滚动条条目的数量*/
SCROLLBAR_SetNumItems(hScroll, 48 * EDIT_MAX_X);
/* 设置页尺寸
页面大小被指定为一页的项目数。如果用户使用键盘或通过在滚动条区域点击鼠
标向上或向下翻页，则窗口按照为一页指定的项目数向上或向下滚动。
*/
SCROLLBAR_SetPageSize(hScroll, 220);
/* 创建编辑区域*/
for (y = 0; y < EDIT_MAX_Y; y++) {
for (x = 0; x < EDIT_MAX_X; x++) {
/* 创建编辑框*/
_aahEdit[y][x] = EDIT_CreateAsChild(x * 48, y * 22, 48, 22,
hWindow, 13, WM_CF_SHOW, 5);
/* 设置对齐方式和字体*/
EDIT_SetTextAlign(_aahEdit[y][x], GUI_TA_RIGHT | GUI_TA_VCENTER);
EDIT_SetFont(_aahEdit[y][x], &GUI_Font8x16);
/* 启用编辑区的十进制编辑模式给出的数值可以在给定的范围内显示*/
EDIT_SetDecMode(_aahEdit[y][x], ((y * EDIT_MAX_X) + x) * 100, -99999, +99999, 2, 0);
}
}
while (1) {
GUI_Exec();
GUI_Delay(20);
}
/* delete window and clear display */
WM_DeleteWindow(hWindow);
GUI_Clear();
}
/*******************************************************************
*
* MainTask
*
* Demonstates the use of a scrollbar as child of a window
*
********************************************************************
*/
void MainTask(void) {
GUI_Init();
while(1) {
_DemoScrollbarMove();
}
}
|
|
|
|
|
|
|
|
|
实际显示效果如下：
![]()
|
|
|
|
|
|
|
|
|
54.3 使用官方GUIBulder建立单选按钮控件
这里用GUIBulder5.22建立一个如下的界面（分辨率480*272）：
|
|
|
|
|
|
|
|
|
框架窗口最右侧和最下面依附的两个滚动条是通过在框架窗口上面右击鼠标进行添加：
|
|
|
|
|
|
|
|
|
其它的两个水平和垂直滚动条直接添加即可，添加的时候默认是水平的滚动条，垂直的滚动条需要通过将水平滚动条按照如下方法进行设置（鼠标左键点击滚动条选中后，右击鼠标进行选择）：
|
|
|
|
|
|
|
|
|
将生成的代码直接复制到模拟器或者开发板上面运行，实际显示效果如下（生成的代码在本期教程配套的例子中）：
|
|
|
|
|
|
|
|
|
54.4 总结
本期教程主要是跟大家讲解了滚动条控件的基础知识。希望大家可以把本期教程中讲的这两个例子跑跑，然后自己设计一个相关的例子进行试验学习。教程中只是使用了部分的滚动条控件API，其它的API大家都可以试试。
|
|
|
|
|
|
|
|
|
/6 
工商网监
湘ICP备2023018690号
2421
淘帖
22817
发表评论
赞
回复
