【emWin实战教程V2.0】第57章 PROGBAR-进度条控件

转最新版本教程

转最新版本教程
本章节为大家讲解STemWin支持的进度条控件，进度条属于易学易用的控件，主要用于显示进度更新效果。
57.1 初学者重要提示
57.2 进度条控件基础知识
57.3 使用GUIBuilder创建进度条控件并用模拟器显示出来
57.4 官方WIDGET_Progbar.c实例
57.5 实验例程说明（RTOS）
57.6 实验例程说明（裸机）
57.7 总结

lee_st · 2017-3-15 17:29:48

配置完成后，上面的文本Framewin会居中显示，然后还是鼠标右击，选择Set title text，并更改Framewin为armfly，修改的地方在左下角：

图片:57.11.png

设置好以后，对话框就算建立完毕。

lee_st · 2017-3-15 17:30:07

57.3.2 第二步：在对话框上面建立进度条控件

进度条控件的建立方法和上面的对话框是一样的。先将进度条控件拖到对话框上面，建立后的效果如下所示：

lee_st · 2017-3-15 17:30:29

对于建立的进度条控件，用户可以任意拖动，并通过鼠标调整其大小，调整方法如下：先左击选中相应控件，会出现绿色的边框，在边框的地方拖动鼠标即可修改大小

lee_st · 2017-3-15 17:30:45

这里我们将进度条调整的稍大些，具体大小，大家可以任意设置，不限制。并鼠标右击此控件，选择Set font，将字体设置为GUI_FONT_16_ASCII。设置完毕后效果如下：

lee_st · 2017-3-15 17:31:02

57.3.3 第三步：建立好后点击File-save

保存方法如下：

保存后生成的文件在GUIBluder5.32软件所在的文件夹里面：

lee_st · 2017-3-15 17:31:14

57.3.4 第四步：在模拟器上运行GUIBuilder生成的代码

在模拟器上面如何演示GUIBuilder生成的代码已经在第6章的6.3小节详细讲述了，这里不再赘述。
可以在模拟器上面运行的完整代码如下，此代码对应的例子是V6-587_STemWin实验_Progbar进度条控件（模拟器）：
（由于GUIBuilder创建进度条控件的功能有限，我们这里添加新的代码做了进度条的动态更新效果）

lee_st · 2017-3-15 17:31:23

/*********************************************************************
*                                                                    *
*                SEGGER Microcontroller GmbH & Co. KG                *
*        Solutions for real time microcontroller applications        *
*                                                                    *
**********************************************************************
*                                                                    *
* C-file generated by:                                               *
*                                                                    *
*        GUI_Builder for emWin version 5.32                          *
*        Compiled Oct  8 2015, 11:59:02                              *
*        (c) 2015 Segger Microcontroller GmbH & Co. KG               *
*                                                                    *
**********************************************************************
*                                                                    *
*        Internet: www.segger.com  Support: support@segger.com       *
*                                                                    *
**********************************************************************
*/

// USER START (Optionally insert additional includes)
// USER END

#include "DIALOG.h"

/*********************************************************************
*
*       Defines
*
**********************************************************************
*/
#define ID_FRAMEWIN_0 (GUI_ID_USER + 0x00)
#define ID_PROGBAR_0  (GUI_ID_USER + 0x01)

// USER START (Optionally insert additional defines)
// USER END

/*********************************************************************
*
*       Static data
*
**********************************************************************
*/

// USER START (Optionally insert additional static data)
// USER END

/*********************************************************************
*
*       _aDialogCreate
*/
static const GUI_WIDGET_CREATE_INFO _aDialogCreate[] = {
  { FRAMEWIN_CreateIndirect, "Framewin", ID_FRAMEWIN_0, 0, 0, 800, 480, 0, 0x64, 0 },
  { PROGBAR_CreateIndirect, "Progbar", ID_PROGBAR_0, 39, 34, 174, 35, 0, 0x0, 0 },  //--------------（1）
  // USER START (Optionally insert additional widgets)
  // USER END
};

/*********************************************************************
*
*       Static code
*
**********************************************************************
*/

// USER START (Optionally insert additional static code)
// USER END

/*********************************************************************
*
*       _cbDialog
*/
static void _cbDialog(WM_MESSAGE * pMsg) {
  WM_HWIN hItem;
  int Value;
  // USER START (Optionally insert additional variables)
  // USER END

  switch (pMsg->MsgId) {
  case WM_INIT_DIALOG:
    //
    // Initialization of 'Framewin'
    //
    hItem = pMsg->hWin;
    FRAMEWIN_SetText(hItem, "armfly");
    FRAMEWIN_SetTextAlign(hItem, GUI_TA_HCENTER | GUI_TA_VCENTER);
    FRAMEWIN_SetFont(hItem, GUI_FONT_32B_ASCII);
    //
    // Initialization of 'Progbar'
    //
    hItem = WM_GetDialogItem(pMsg->hWin, ID_PROGBAR_0); //--------------（2）
    PROGBAR_SetFont(hItem, GUI_FONT_16_ASCII);          //--------------（3）
PROGBAR_SetMinMax(hItem, 0, 100);                   //--------------（4）
    // USER START (Optionally insert additional code for further widget initialization)
    // USER END
    break;

  case WM_TIMER:                                        //--------------（5）
    hItem = WM_GetDialogItem(pMsg->hWin, ID_PROGBAR_0);
     Value = PROGBAR_GetValue(hItem);                    //--------------（6）
    if (Value == 100)
    {
       PROGBAR_SetValue(hItem, 0);                    //--------------（7）
    }
     else
     {
       PROGBAR_SetValue(hItem, Value + 1);             //--------------（8）
     }
     WM_RestartTimer(pMsg->Data.v, 100);              //--------------（9）
    break;

  // USER START (Optionally insert additional message handling)
  // USER END
  default:
    WM_DefaultProc(pMsg);
    break;
  }
}

/*********************************************************************
*
*       Public code
*
**********************************************************************
*/
/*********************************************************************
*
*       CreateFramewin
*/
WM_HWIN CreateFramewin(void);
WM_HWIN CreateFramewin(void) {
  WM_HWIN hWin;

  hWin = GUI_CreateDialogBox(_aDialogCreate, GUI_COUNTOF(_aDialogCreate), _cbDialog, WM_HBKWIN, 0, 0);
  return hWin;
}

// USER START (Optionally insert additional public code)
// USER END

/*********************************************************************
*
*       MainTask
*/
void MainTask(void)
{
     WM_HWIN hDlg;
     WM_HTIMER hTimer;

     /* 初始化 */
     GUI_Init();

     /* 窗口自动使用存储设备 */
     WM_SetCreateFlags(WM_CF_MEMDEV);

     /* 创建对话框，使用GUIBulder5.32生成的对话框创建函数 */
     hDlg = CreateFramewin();

     hTimer = WM_CreateTimer(WM_GetClientWindow(hDlg), 0, 100, 0); //--------------（9）

     while(1)
     {
         GUI_Delay(50);
     }
}

/*************************** End of file ****************************/

lee_st · 2017-3-15 17:31:38

创建的这个例子相对比较容易，主要实现了在对话框上面创建进度条控件，每100ms更新一次，进度条进更新到100%后，重新从0%开始，如此循环。
1.    在对话框的资源列表中创建一个进度条控件。
2.    通过函数WM_GetDialogItem获得对话框上ID为ID_PROGBAR_0的进度条控件句柄。
3.    通过函数PROGBAR_SetFont设置进度条控件的字体。

lee_st · 2017-3-15 17:31:47

4.    通过函数PROGBAR_SetMinMax设置进度条的最小值是0，最大值是100，方便我们演示。
5.    定时器时间溢出消息。
6.    通过函数PROGBAR_GetValue获得进度条当前的数值。
7.    当进度条的数值达到最大值100时，重新设置为从0开始，调用函数PROGBAR_SetValue即可重新设置数值。

lee_st · 2017-3-15 17:31:57

8.    当进度条的数值为达到最大值100时，每次加1。
9.    通过函数WM_RestartTimer复位定时器，从而可以再次开启定时器，溢出时间设置为100ms。
10.  为对话框创建定时器，定时器溢出时间是100ms。

lee_st · 2017-3-15 17:32:12

实际显示效果如下，分辨率800*480：

对于这个创建和演示过程，强烈建议初学者实际动手操作。

lee_st · 2017-3-15 17:32:26

57.4 官方WIDGET_Progbar.c实例讲解

这个例子在模拟器中的位置：

lee_st · 2017-3-15 17:32:38

主要功能介绍：
这个例子比较容易理解，适合初学者学习参考，主要实现了在桌面窗口创建两个进度条控件，并演示了5种动态效果。
程序代码如下：

lee_st · 2017-3-15 17:32:47

#include "GUI.h"
#include "PROGBAR.h"
#include

/*********************************************************************
*
*       Defines
*
**********************************************************************
*/
//
// Recommended memory to run the sample with adequate performance
//
#define RECOMMENDED_MEMORY (1024L * 5)

/*******************************************************************
*
*       static code
*
********************************************************************
*/
/*******************************************************************
*
*       _DemoProgBar
*/
static void _DemoProgBar(void) {
  int i;
  PROGBAR_Handle ahProgBar[2];

  GUI_SetBkColor(GUI_BLACK);
  GUI_Clear();
  GUI_SetColor(GUI_WHITE);
  GUI_SetFont(&GUI_Font24_ASCII);
  GUI_DispStringHCenterAt("WIDGET_Progbar - Sample", 160, 5);
  GUI_SetFont(&GUI_Font8x16);
  GUI_DispStringAt("Progress bar", 100,80);
  //
  // Create the progbars
  //
  ahProgBar[0] = PROGBAR_Create(100,100,100,20, WM_CF_SHOW); //--------------（1）
  ahProgBar[1] = PROGBAR_Create( 80,150,140,10, WM_CF_SHOW);
  //
  // Use memory device (optional, for better looks)
  //
  WM_EnableMemdev(ahProgBar[0]);
  WM_EnableMemdev(ahProgBar[1]);
  PROGBAR_SetMinMax(ahProgBar[1], 0, 500);                 //--------------（2）
  PROGBAR_SetFont(ahProgBar[0], &GUI_Font8x16);            //--------------（3）
  GUI_Delay(500);
  while(1) {
    PROGBAR_SetFont(ahProgBar[0], &GUI_Font8x16);
    if (LCD_GetDevCap(LCD_DEVCAP_BITSPERPIXEL) <= 4) {    //--------------（4）
      PROGBAR_SetBarColor(ahProgBar[0], 0, GUI_DARKGRAY); //--------------（5）
      PROGBAR_SetBarColor(ahProgBar[0], 1, GUI_LIGHTGRAY);
    } else {
      PROGBAR_SetBarColor(ahProgBar[0], 0, GUI_GREEN);
      PROGBAR_SetBarColor(ahProgBar[0], 1, GUI_RED);
}

    PROGBAR_SetTextAlign(ahProgBar[0], GUI_TA_HCENTER);  //--------------（6）
PROGBAR_SetText(ahProgBar[0], NULL);                 //--------------（7）

    for (i=0; i<=100; i++) {                             //--------------（8）
      PROGBAR_SetValue(ahProgBar[0], i);                 //--------------（9）
      PROGBAR_SetValue(ahProgBar[1], i);
      GUI_Delay(5);
}

    PROGBAR_SetText(ahProgBar[0], "Tank empty");        //--------------（10）
    for (; i>=0; i--) {
      PROGBAR_SetValue(ahProgBar[0], i);
      PROGBAR_SetValue(ahProgBar[1], 200-i);
      GUI_Delay(5);
}

    PROGBAR_SetText(ahProgBar[0], "Any text...");     //--------------（11）
    PROGBAR_SetTextAlign(ahProgBar[0], GUI_TA_LEFT);
    for (; i<=100; i++) {
      PROGBAR_SetValue(ahProgBar[0], i);
      PROGBAR_SetValue(ahProgBar[1], 200+i);
      GUI_Delay(5);
}

    PROGBAR_SetTextAlign(ahProgBar[0], GUI_TA_RIGHT);  //--------------（12）
    for (; i>=0; i--) {
      PROGBAR_SetValue(ahProgBar[0], i);
      PROGBAR_SetValue(ahProgBar[1], 400-i);
      GUI_Delay(5);
}

    PROGBAR_SetFont(ahProgBar[0], &GUI_FontComic18B_1); //--------------（13）
    PROGBAR_SetText(ahProgBar[0], "Any font...");
    for (; i<=100; i++) {
      PROGBAR_SetValue(ahProgBar[0], i);
      PROGBAR_SetValue(ahProgBar[1], 400+i);
      GUI_Delay(5);
    }
    GUI_Delay(500);
  }
}

/*********************************************************************
*
*       Public code
*
**********************************************************************
*/
/*********************************************************************
*
*       MainTask
*/
void MainTask(void) {
  GUI_Init();
  //
  // Check if recommended memory for the sample is available
  //
  if (GUI_ALLOC_GetNumFreeBytes() < RECOMMENDED_MEMORY) {
    GUI_ErrorOut("Not enough memory available.");
    return;
  }
  while (1) {
    _DemoProgBar();
  }
}

lee_st · 2017-3-15 17:33:01

1.    通过函数PROGBAR_Create创建进度条控件，这里创建了两个。
2.    通过函数PROGBAR_SetMinMax设置进度条控件ahProgBar[1]的最小值是0，最大值500。
3.    通过函数PROGBAR_SetFont设置进度条控件ahProgBar[0]的字体。
4.    函数LCD_GetDevCap的作用在官方手册中没有说明，猜测这个的作用就是返回显示屏的颜色深度。

lee_st · 2017-3-15 17:33:14

5. 通过函数PROGBAR_SetBarColor设置进度条的颜色。此函数的第二个参数是用来设置进度区域和未进度到区域的颜色，配置为0的时候设置的是进度区域的颜色，配置为1的时候设置的是未进度到区域的颜色。比如下面这种效果：进度区域是绿色，未进度到区域是红色。

这个函数只有在未使用皮肤色的时候才有效。

lee_st · 2017-3-15 17:33:27

6.    通过函数PROGBAR_SetTextAlign设置进度条控件ahProgBar[0]上显示的文本水平居中。
7.    通过函数PROGBAR_SetText设置进度条控件上显示的文本。
8.    这一小段实现进度控件的第1种动态显示效果。
9.    通过函数PROGBAR_SetValue设置进度条的数值。

lee_st · 2017-3-15 17:33:36

10.  这一小段实现进度控件的第2种动态显示效果。
11.  这一小段实现进度控件的第3种动态显示效果。
12.  这一小段实现进度控件的第4种动态显示效果。
13.  这一小段实现进度控件的第5种动态显示效果。

lee_st · 2017-3-15 17:34:16

实际显示效果如下：

lee_st · 2017-3-15 17:34:32

57.5  实验例程说明（RTOS）

实验目的：
      1.    本实验主要学习进度条控件的使用。
      2.    emWin功能的实现在MainTask.c文件里面。
实验内容：
      1.    K1按键按下，串口打印任务执行情况（波特率115200，数据位8，奇偶校验位无，停止位1）。
      2.    K2按键按下，实现截图功能，将图片以BMP格式保存到SD卡中。
      3.    GUI任务在对话框上面创建了进度条控件，每100ms更新一次，进度条进更新到100%后，重新从0%开始，如此循环。
      4.    各个任务实现的功能如下：
            App Task Start 任务：实现按键和触摸扫描。
            App Task MspPro任务：实现截图功能，将图片以BMP格式保存到SD卡中。
            App Task UserIF  任务：按键消息处理。
            App Task COM 任务：暂未使用。
            App Task GUI 任务：GUI任务。

搜索历史

【emWin实战教程V2.0】第57章 PROGBAR-进度条控件

相关推荐

85 条评论

评论

精选推荐

热门帖

站长推荐 /6