UI界面上还得有个油表，大部分都是机械指针。这里暂时不使用机械指针，还是使用circleProgress 和 TextArea控件。
% N+ L# Z2 W, V1 F       计划实现的功能就是手滑动circleProgress实现加油，TextArea数字也跟着直观指示。
$ M3 I/ X. E) R2 J. c4 Z1 Z+ I       两个控件的值范围是0-100L，后来想想，一般油箱就50L，不一般的就比较大了。
       书归正传，这里实现只需要在view里实现即可。
: t) [. A# c1 o. a, u       定义界面如图1所示：

图1
. N5 T0 t  L; U: H2 i6 X+ q' R$ p# c      在View.cpp里实现功能，函数实现如下所示：

1. int x = evt.getNewX();    // 手指当前位置 X
   ' y9 f7 e7 j6 d
2. 
   
3.     int minX = circleProgress2.getX();
   + y& A" Q) [: `% d; r9 c4 e
4.     int maxX = minX + circleProgress2.getWidth();
   ) i# c, k' n% o
5. 
   
6.     int pos = x - minX;
   
7.     if (pos < 0) pos = 0;
   ( ]9 b. ]. f' f5 d. ^
8.     if (pos > (maxX - minX)) pos = (maxX - minX);
   : r% {* d0 V/ F/ ~( q  B( D! |
9. 
   + M0 v! [9 {/ ]' U3 B
10.     int value = pos * 100 / (maxX - minX);  // 映射到 0~100
    
11. 
    + H5 c1 v) w  J/ Q, c6 Y" E
12.     // 更新 CircleProgress
    - z; X: _2 y2 M: j& j. N8 S: [
13.     circleProgress2.setValue(value);
    
14. 
    8 O/ e) f$ r7 }( t5 @1 v
15.     // 更新文本
    
16.     Unicode::snprintf(textArea4Buffer, TEXTAREA1_SIZE, "%d", value);
    
17.     textArea4.invalidate();

复制代码

. D1 V. V5 ~7 ^0 I# @6 H( D: O
      实际展示效果如图2所示：

图2
: w5 L: t; H0 |/ u% j

不错不错