3.TouchGFX界面应用之按钮与响应

2020-06-28来源: eefocus关键字:TouchGFX  界面应用  按钮与响应

上一节我们TouchGFX 添加了背景和文字显示,这次我们添加按键和按键动作,实现一个什么功能呢,那就再学习一个组件进度条,实现两个按键控制进度条。


找到按钮,我使用两个带文字的按钮和任意找一个进度条

修改按钮中间的值,我设置为80和20,

另外为了区分两个按钮需要对两个按键取一个特别的名字,取名字要按照C语言函数命名规则,那就默认的名字后面加一个20把,另一个一样也是默认名字后面加一个80,那那个进度条叫什么呢,反正就一个就默认把,然后在右边interactions添加一个interaction(互动?)

设置当20按钮被点击时候设置进度条值为20,同样在加一个互动设置当80按钮被点击时候设置进度条值为80

设置好我们运行一下,鼠标点两个按钮发现进度条值被改变了,好,本章,,,,,,继续。

这样设置是不是太差劲了只能在80和20之间跳,那可不可以一点点慢慢加或者慢慢减呢,当然可以。

但是那样按钮这样取名字就不是很好看了,我们重新来取名字,不然叫UP和DOWN,把按键名字和里面字一起改了。

然后把互动里面也一起修改了,改成调用新的虚函数(它代表的意思是响应按钮按下消息的代码是在一个称为 DOWN_Function() 的虚函数),把UP也一起改了。

画重点来了,在我们TouchGFX 工程目录下有一个 simulatormsvs 文件夹,里面有一个Application.sln的文件使用Visual Studio 打开,在Visual Studio 旁边有一个这样的工程,可以看看你们有一些什么文件。

在Screen1ViewBase.hpp中有自动生成函数原型

virtual void DOWN_Function()

virtual void UP_Function()

两个函数,但是这个文件是不让你修改的,并且告诉你.//覆盖此函数并在ScreenlView中实现,这个函数怎么写呢,定义一个变量然后,然后每次按按钮被按下执行加1或者减1,所以我们在Screen1View.hpp中声明这个函数和这个变脸。

然后在Screen1View.cpp中定义这个函数,加1或者减1并且打印数据,保存代码,请养成一个随手保存代码的习惯。

回到TouchGFX运行试一试,注意如果你的点运行很长时间没有运行模拟器那么你代码有问题,注意软件左下角提示

运行模拟器按下按钮发现弹出一个命令行的对话框。每次按下按钮都输出对应的值。把这些值限制在0到100,并且送给进度条显示。

将两个函数改成如下,运行即可,circleProgress1为进度条名字,setValue是设置其值,invalidate是更新显示,在Visual Studio 里面对函数按下F12可以查看函数原形和说明。还有一个BUG为第一次按下按钮发现进度条是跳过去的,这个BUG留给你们解决。

void Screen1View::DOWN_Function()

{

count--;

if (count < 0) {

count = 100;

}

touchgfx_printf("count %drn", count);

circleProgress1.setValue(count);

circleProgress1.invalidate();

}

void Screen1View::UP_Function()

{

count++;

if (count > 100) {

count = 0;

}

touchgfx_printf("count %drn", count);

circleProgress1.setValue(count);

circleProgress1.invalidate();

}

实验效果

最后附上工程:

http://www.waveshare.net/w/upload/7/7e/TouchGFX%E7%95%8C%E9%9D%A2%E5%BA%94%E7%94%A8%E4%B9%8B%E6%8C%89%E9%92%AE%E4%B8%8E%E5%93%8D%E5%BA%94.7z


关键字:TouchGFX  界面应用  按钮与响应 编辑:什么鱼 引用地址:http://news.eeworld.com.cn/mcu/ic501350.html 本网站转载的所有的文章、图片、音频视频文件等资料的版权归版权所有人所有,本站采用的非本站原创文章及图片等内容无法一一联系确认版权者。如果本网所选内容的文章作者及编辑认为其作品不宜公开自由传播,或不应无偿使用,请及时通过电子邮件或电话通知我们,以迅速采取适当措施,避免给双方造成不必要的经济损失。

上一篇:4.TouchGFX界面应用之STM32显示移植
下一篇:2.TouchGFX界面应用之Hello world

关注eeworld公众号 快捷获取更多信息
关注eeworld公众号
快捷获取更多信息
关注eeworld服务号 享受更多官方福利
关注eeworld服务号
享受更多官方福利

推荐阅读

2.TouchGFX界面应用之Hello world
打开TouchGFX 4.10.0 Designer先选择开发板或者屏幕,移动鼠标到Simulator,会出现一个 CHANGE 按钮:打开如下图,如果你是ST官方板,那么你可以直接选择对应的开发板,如果你不是那选择对应分辨率的屏幕,我选择的是1024X600的屏幕。你可以选择一些UI,这些UI都带着一些有意思的图片和一些有意思的小东西,但是选择一些UI就意味着可能内存不够,我这里不选择,使用白板。还有管脚的路径,选择路径不能有中文和空格以及数字开头,选择好之后开始,第一次使用可能需要下载数据包。下图是主界面其中1:  主显示界面2:提供的组件(你也可以自定义组件)3:组件参数设置4:输出代码或者仿真我们先做一个做一个
发表于 2020-06-28
2.TouchGFX<font color='red'>界面</font><font color='red'>应用</font>之Hello world
4.TouchGFX界面应用之STM32显示移植
TouchGFX前面几个教程都是在模拟器上跑都没有下到开发板子上过那就不好玩了啊,那我接下来将如何移植到stm32上面运行,我这里以非官方板为例。我们使用的是STM32CubeMX软件生成我的版本是5.2,使用STM32F746IGT6为核心的开发板为Open746I-C:http://www.waveshare.net/shop/Open746I-C.htm,使用7寸电容触摸屏:http://www.waveshare.net/shop/7inch-Capacitive-Touch-LCD-F.htm 分辨率为1024×600。先打开或者重新创建一个STM32CubeMX驱动LCD的工程。开启一个TIM1为TouchGFX框架作为
发表于 2020-06-28
4.TouchGFX<font color='red'>界面</font><font color='red'>应用</font>之STM32显示移植
5.TouchGFX界面应用之多屏幕
这一节我们在TouchGFX可以创建多个界面,在组件的上面新建一个界面,同样先铺好背景。放置一个用于切换屏幕的按钮取个名字,在添加显示的文字设置互动,改变屏幕,切换到屏幕2 ,添加切换动画为幻灯片,切换方向东(上北下南,左西右东),这个动画也可以不加,如果你的屏幕比较大,显示出来的效果不是很好,显示有卡顿。当然你也可以超频来提高运行速度来解决这个问题。在屏幕二任意放一点东西,再放置一个回到屏幕1 的按钮。这个是自带的功能所以不需要修改任何代码,启动模拟器,查看功能是否有问题,如果没问题,添加到Keil工程,注意:添加屏幕,图片,字体等等都需要添加或者修改keil工程文件,不然编译会报错。编译如果报错看错误是什么,如果提示函数未定义
发表于 2020-06-28
5.TouchGFX<font color='red'>界面</font><font color='red'>应用</font>之多屏幕
6.TouchGFX界面应用之定时器机制
在TouchGFX有一个类似于滴答定时器的函数,handleTickEvent()。这一节我们使用handleTickEvent函数让图形动起来。在形状中找圆,设置圆画板大小为500X500,起点坐标为260,50,圆心在画板坐标的250,250,设置圆弧的开始角度和终止进度,设置圆弧的半径和圆弧线的宽度(0表示全部填充),这样这个圆弧就创建好了,我们再在圆弧的外面画一个完整的圆生成代码,在Screen2View.hpp的Screen2View中加入两个变量和handleTickEvent函数,声明这个函数后,在程序执行时,会自动定时调用或者函数。在Screen2View.cpp中定义这个函数,设置圆弧的开始和终止角度,每次加6度,
发表于 2020-06-28
6.TouchGFX<font color='red'>界面</font><font color='red'>应用</font>之定时器机制
7.TouchGFX界面应用多屏幕传参
上一节使用TouchGFX的handleTickEvent机制做了的计数器,但是有一个缺陷,在切换屏幕后再切换回来计数器归零了,如果我想这个计数器在任意时刻都在计数,哪怕切换的屏幕还是在计数。首先需要知道为什么计数器会归零,原因是TouchGFX使用的是MVP框架,在MVP框架中所有数据仅能保存在称为 Model 的类对象中,Presenter是视图(View)与Model之间的纽带,View只能通过Presenter来读取数据。这个框架可以在VC工程中可以看出。MVP框架所有需要保存的数据必须再Model 的类对象,我们之前说明的数据都是再View类里面,所以在切换屏幕后所有的数据全部丢失了。前面说了数据都是再View类切换屏幕后
发表于 2020-06-28
7.TouchGFX<font color='red'>界面</font><font color='red'>应用</font>多屏幕传参
何立民专栏 单片机及嵌入式宝典

北京航空航天大学教授,20余年来致力于单片机与嵌入式系统推广工作。

换一换 更多 相关热搜器件
电子工程世界版权所有 京ICP证060456号 京ICP备10001474号 电信业务审批[2006]字第258号函 京公海网安备110108001534 Copyright © 2005-2020 EEWORLD.com.cn, Inc. All rights reserved