Files
minigui-docs/programming-guide/MiniGUIProgGuidePart2Chapter11.md
Vincent Wei 0a727c6de7 tune format
2019-10-28 15:09:35 +08:00

10 KiB
Raw Blame History

第二部分 第十章 进度条控件

Chapter 10 of Part 2 Progress Bar Control

进度条控件简介

Brief Introduction of Progress Bar Control

进度条控件ProgressBar是GUI系统中不可或缺的的重要控件之一可以直观的表示出某项的进度在进行文件复制、软件安装、文件传输时经常用到。mGNCS中的进度条控件基于MiniGUI 3.0中内置的进度条控件进行了增强和重构,增加了渲染器的设置,使其更加易用,更加绚丽。

Progress bar control is an essential control in GUI system, which can visually show progress of an item and is often used in file copying, software installation and file transmission. Progress bar control in mGNCS is strengthened and reconstructed based on the built-in progress bar control in MiniGUI 3.0, and setting of renderer is added, making it easier to use and more splendid.

  • Class hierarchical relation of progress bar
  • mWidget

mProgressBar

mProgressBar

  • 控件窗口类: NCSCTRL_PROGRESSBAR

  • 控件英文名: ProgressBar

  • 简介: 用于表示进度,在进行文件复制、软件安装、文件传输时经常用到。

  • 示意图:

  • Control window class: NCSCTRL_PROGRESSBAR

  • Control English name: ProgressBar

  • Brief introduction: Used to show progress, often used in file copying, software installation and file transmission.

  • Schematic diagram:

mProgressBar风格

Style of mProgressBar

继承自mWidget的风格 | 风格ID | miniStudio属性名 | 说明 || | NCSS_PRGBAR_HORIZONTAL | -- | miniStudio中将这两种风格分成了两个控件来使用 分别对应为| Horz ProgressBar | | NCSS_PRGBAR_VERTICAL | -- | ^ | Vert ProgressBar | | NCSS_PRGBAR_BLOCKS | BlockChunk->TRUE | 块状进度 | prog_block.png | | NCSS_PRGBAR_SMOOTH | BlockChunk->FALSE | 平滑进度,与上面的块状进度相对 | prog_smooth.png | | NCSS_PRGBAR_SHOWPERCENT | ShowPercent | 显示当前进度值(百分比)| prog_per.png |

It is inherited from the style of mWidget | *Style ID* | *miniStudio property * | Explanation || | NCSS_PRGBAR_HORIZONTAL | -- | In miniStudio, the two styles are divided into two controls to use, respectively corresponding to| Horz ProgressBar | | NCSS_PRGBAR_VERTICAL | -- | ^ | Vert ProgressBar | | NCSS_PRGBAR_BLOCKS | BlockChunk->TRUE | Block progress | prog_block.png | | NCSS_PRGBAR_SMOOTH | BlockChunk->FALSE | Smooth progress, relative to the above block progress | prog_smooth.png | | NCSS_PRGBAR_SHOWPERCENT | ShowPercent | Display the current progress value (percentage)| prog_per.png |

mProgressBar属性

Property of mProgressBar

继承自mWidget的属性 | 属性名 |miniStudio属性名 | 类型 | RW | 说明 | | NCSP_PROG_MAXPOS | MaxPos | int | RW | 进度范围最大值 | | NCSP_PROG_MINPOS | MinPos | int | RW | 进度范围最小值 | | NCSP_PROG_CURPOS | CurPos | int | RW | 当前进度值 | | NCSP_PROG_LINESTEP | LineStep | int | RW | 步长 |

It is inherited from the property of mWidget | Property name |miniStudio property name | Type | RW | Explanation | | NCSP_PROG_MAXPOS | MaxPos | int | RW | Maximum value of the progress range | | NCSP_PROG_MINPOS | MinPos | int | RW | Minimum value of the progress range | | NCSP_PROG_CURPOS | CurPos | int | RW | Current progress value | | NCSP_PROG_LINESTEP | LineStep | int | RW | Step length |

mProgressBar事件

Event of mProgressBar

继承自mWidget的事件
%RED% 该控件类没有新增事件 %ENDCOLOR%

It is inherited from the event of mWidget
%RED% The control class does not have newly added event %ENDCOLOR%

mProgressBar方法

Method of mProgressBar

继承自mWidget的方法

It is inherited from the method of mWidget

---++++ increase %CODE{cpp}% int increase (mProgressBar *self, int delta);

---++++ stepIncrease %CODE{cpp}% int stepIncrease (mProgressBar *_this);

mProgressBar渲染器

Renderer of mProgressBar

---++++ classic渲染器 ---++++ Classic Renderer 继承自mWidget的classic渲染器
| 属性名 |miniStudio属性名 | 类型 | 示意图 | 说明 | | NCS_BGC_HILIGHT_ITEM | ChunkColor | DWORDARGB | classic_prog.png | 进度条的chunk部分的颜色本渲染器使用高亮item的颜色绘制 |

It is inherited from the classic renderer of mWidget
| Property name |*miniStudio property * | Type | Schematic diagram | Explanation | | NCS_BGC_HILIGHT_ITEM | ChunkColor | DWORDARGB | classic_prog.png | Color of chunk part of the progress bar, and this renderer uses the color of highlight item to draw |

---++++ fashion渲染器 ---++++ Fashion Renderer 继承自mWidget的fashion渲染器
| 属性名 |miniStudio属性名 | 类型 | 示意图 | 说明 | | NCS_BGC_PRGBAR_CHUNK | ChunkColor | DWORDARGB | fsh_prog.png | 进度条的chunk部分的基础颜色渲染器会根据这个颜色进行减淡、加深来绘制渐变效果的进度条 |

It is inherited from the fashion renderer of mWidget
| Property name |miniStudio property name | Type | Schematic diagram | Explanation | | NCS_BGC_PRGBAR_CHUNK | ChunkColor | DWORDARGB | fsh_prog.png | Foundation color of chunk part of the progress bar, and the renderer will lighten or darken according to this color to draw progress bar of gradual change effect |

---++++ flat渲染器 ---++++ Flat Renderer 继承自mWidget的flat渲染器
| 属性名 |miniStudio属性名 | 类型 | 示意图 | 说明 | | NCS_FGC_WINDOW | ChunkColor | DWORDARGB | flat_prog.png | 进度条的chunk部分的颜色,这里使用窗口前景色 |

It is inherited from flat renderer of mWidget
| Property name |miniStudio property name | Type | Schematic diagram | Explanation | | NCS_FGC_WINDOW | ChunkColor | DWORDARGB | flat_prog.png | Color of chunk part of the progress bar, here window foreground color is used |

---++++ skin渲染器 ---++++ Skin Renderer 参阅 Skin渲染器使用的图片资源规范(ProgressBar图片规范中[[MStudioMGNCSV1dot0PGAppB#m_ProgressBar)

Refer to [Appendix B](MStudioMGNCSV1dot0PGAppB#m_ProgressBar][ProgressBar Image Specification]] in Specification for Image Resource Used by Skin Renderer ([[MStudioMGNCSV1dot0PGAppB))

mProgressBar编程示例

Instance of mProgressBar

  • ProgressBar示例代码 progressbar.c

  • ProgressBar模板

  • ProgressBar Example code:progressbar.c

  • ProgressBar template

%CODE{cpp}% %INCLUDE{"%ATTACHURL%/progressbar.c.txt" pattern="^.?//START_OF_TEMPLATE(.?)//END_OF_TEMPLATE.*"}%

  • 在Timer消息中改变ProgressBar的属性值

  • In Timer message, change the property value of ProgressBar %CODE{cpp}% %INCLUDE{"%ATTACHURL%/progressbar.c.txt" pattern="^.?//START_OF_SET_PROPERTY(.?)//END_OF_SET_PROPERTY.*"}%


<< | Table of Contents | >>