6.TouchGFX界面应用之定时器机制

来自丢石头百科


在TouchGFX有一个类似于滴答定时器的函数,handleTickEvent()。 这一节我们使用handleTickEvent函数让图形动起来。


182527i8bs8s7zish7fcbn.png

在形状中找圆,设置圆画板大小为500X500,起点坐标为260,50,圆心在画板坐标的250,250,设置圆弧的开始角度和终止进度,设置圆弧的半径和圆弧线的宽度(0表示全部填充),这样这个圆弧就创建好了,


182527kgqsg2supuw4quvx.png


182527zf90n7nes99z2sw9.png


我们再在圆弧的外面画一个完整的圆


182527vqw88y9kw1wr1fkd.png

生成代码,在Screen2View.hpp的Screen2View中加入两个变量和handleTickEvent函数,声明这个函数后,在程序执行时,会自动定时调用或者函数。


文件:182527yab1ekdd3no3nabg.png

在Screen2View.cpp中定义这个函数,设置圆弧的开始和终止角度,每次加6度,一圈是360度正好加60次结束,连续起来就感觉在转圈圈,在Screen2View构造函数里面赋初值。


182527lmifi2kzgfjmo6ms.png



182528kl7quxtgup1973ck.png

circle1.setArc为设置圆弧的角度,函数原型如下,


182528zxvzj2gjquxuu8xh.png

运行模拟器,查看效果。然后编译下载到开发板,


182528yfz4d28hjhwrd1g4.png

我们还可以添加文字来显示他转了多少圈,先添加一个文本框,取消自动设置大小,文本款尽量拉大一点防止数据显示不完整,设置字体居中,显示设置通配符,设置buff长度10个字节。


182528qd5jjhsch2q2hii2.png



182528ano734ukjb40ubun.png


添加显示代码,显示minute的值,没有添加数据溢出处理

Unicode::snprintf(textArea1Buffer, TEXTAREA1_SIZE,"%d", minute);

textArea1.invalidate();


182528k7srcfcyssgrnvyn.png

运行测试如下,发现与预期不符。


182528l6y9sbxdyllllexx.png

那是因为我们没有添加通配符范围,在修改字体的地方添加通配符范围。


182528q8xyi3ob8tre3myg.png

重新生成代码,编译烧录。


182527imxa6q1njnqq9a9s.gif

这样是不是感觉有点单调,那好可以再加一个圆弧,设置成红色初始角度


182528h1jjj06jug7gjjbw.png



182528lsbgrse55683xsr3.png


void Screen2View::handleTickEvent()

{

count++;

if(count >= 60){

count = 0;

minute++;

Unicode::snprintf(textArea1Buffer, TEXTAREA1_SIZE,"%d", minute);

textArea1.invalidate();

}

circle1.invalidate();

circle1.setArc(count * 6, count * 6 + 30);

circle1.invalidate();


circle_Red.invalidate();

circle_Red.setArc(count * 6 + 180, count * 6 + 30 + 180);

circle_Red.invalidate();

} 编译下载就可以看到两个圆弧对立转


182527j62iuduykjnk6ii6.gif

.