4 {4 R/ w( U$ P% F       UI界面上还得有个油表，大部分都是机械指针。这里暂时不使用机械指针，还是使用circleProgress 和 TextArea控件。
# X  j8 Y8 ]: n! f       计划实现的功能就是手滑动circleProgress实现加油，TextArea数字也跟着直观指示。
       两个控件的值范围是0-100L，后来想想，一般油箱就50L，不一般的就比较大了。
8 e, k+ W- @/ w& W       书归正传，这里实现只需要在view里实现即可。
# |7 j) b9 r! k; l+ o) [8 `8 r* L       定义界面如图1所示：

图1
% K$ c0 i9 V7 h  `      在View.cpp里实现功能，函数实现如下所示：
: q$ m2 c: y  S+ f( T( E

1. int x = evt.getNewX();    // 手指当前位置 X
   
2. 
   
3.     int minX = circleProgress2.getX();
   
4.     int maxX = minX + circleProgress2.getWidth();
   : O. V$ N" v& a6 n: l5 A
5. 
   4 E" |% L: A1 H
6.     int pos = x - minX;
   
7.     if (pos < 0) pos = 0;
   3 O! H2 U6 K8 p4 K. _
8.     if (pos > (maxX - minX)) pos = (maxX - minX);
   
9. 
   / k4 K1 ]+ z* T* t: @, A# G# A2 |
10.     int value = pos * 100 / (maxX - minX);  // 映射到 0~100
      P$ f) L  N, Z
11. 
    
12.     // 更新 CircleProgress
    
13.     circleProgress2.setValue(value);
    , e; B, B) u+ t! J. {2 l
14. 
    
15.     // 更新文本
    
16.     Unicode::snprintf(textArea4Buffer, TEXTAREA1_SIZE, "%d", value);
    7 M, g/ J. n. |8 N+ }
17.     textArea4.invalidate();

复制代码

2 z  K9 |% N, p: p( Q2 I: t! o
4 K, P8 E: T: s; V) Q* T
7 {9 D: H' i$ \! F5 I
      实际展示效果如图2所示：
) H" s; a) r+ l6 C8 Z: O
8 z8 q# i1 i9 f4 Y图2
& y' ~+ u% _- E. s+ B& E

不错不错