0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看威廉希尔官方网站 视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

AWTK 开源串口屏开发(6) - 定时器的用法

ZLG致远电子 2024-01-13 08:24 次阅读

定时器是个常用的功能,AWTK 串口屏提供了丰富的定时器函数,用于定时器的启动、停止、暂停、恢复、修改和重置等功能,本文以计时器的例子来介绍定时器的基本用法。定时器也是一个常用的功能,在 AWTK 串口屏中,可以给每个控件(包括窗口)创建一个定时器,定时器到点后触发 v-on:timer 事件。在 AWTK 串口屏中,提供了 6 个定时器相关函数:

  • start_timer启动定时器。
  • stop_timer停止定时器。
  • suspend_timer暂停定时器。
  • resume_timer恢复暂停的定时器。
  • reset_timer重置定时器。
  • modify_timer修改定时器的时间。

这些函数第一个参数为控件的名字,如果不指定,则默认为当前控件。


1. 功能

本文以计时器的例子来介绍定时器的使用方法。在这里例子中,模型(也就是数据)里只有一个计时变量:

变量名

数据类型

功能说明

计时

整数


2. 创建项目

从模板创建项目,将 hmi/template_app 拷贝 hmi/timer 即可。

第一个项目最好不要放到其它目录,因为放到其它目录需要修改配置文件中的路径,等熟悉之后再考虑放到其它目录。路径中也不要中文和空格,避免不必要的麻烦。


3. 制作界面

用 AWStudio 打开上面 timer 目录下的 project.json 文件。里面有一个空的窗口,在上面加入下面的控件:

静态文本

  • 4 个按钮

做出类似下面的界面。

1b42bf1e-b1aa-11ee-aa22-92fbcf53809c.png

定时器设置在静态文本上,所以必须给它取一个在当前窗口内唯一的名称,这里就叫 “tick”。


4. 添加绑定规则

静态文本绑定到计时变量。添加自定义的属性v-data:value,将值设置为{计时}

绑定属性

绑定规则

说明

v-data:value

{计时}

变量要用英文大括号括起来。

v-on:timer

{fscript, Args=set(计时,计时+1)}

定时器事件,增加计时

启动按钮的点击事件启动定时器。

绑定属性

绑定规则

说明

v-on:click

{fscript, Args=start_timer(‘tick’, 1000);}

1000 表示定时器的时间间隔为 1000 毫秒。

暂停按钮的点击事件暂停定时器。

绑定属性

绑定规则

说明

v-on:click

{fscript, Args=suspend_timer(‘tick’)}

恢复按钮的点击事件恢复定时器。

绑定属性

绑定规则

说明

v-on:click

{fscript, Args=resume_timer(‘tick’)}

停止按钮的点击事件停止定时器。

绑定属性

绑定规则

说明

v-on:click

{fscript, Args=stop_timer(‘tick’);set(计时,0)}

停止定时器,并将计时清零

同样指定窗口的模型为 default。

绑定属性

绑定规则

说明

v-model

default

default 不需要用大括号括起来。


5. 初始化数据

修改资源文件 design/default/data/default_model.json, 将其内容改为:

{ "计时":0}

注意:

  • 如果文件内容有中文(非 ASCII 字符),一定要保存为 UTF-8 格式。
  • 重新打包资源才能生效。


6. 编译运行

运行 bin 目录下的 demo 程序,启动定时器后,计时自动增加。1b46d23e-b1aa-11ee-aa22-92fbcf53809c.png1b4a982e-b1aa-11ee-aa22-92fbcf53809c.gif

7. 注意

本项目并没有编写界面相关的代码,AWStudio 在 src/pages 目录下生成了一些代码框架,这些代码并没有用到,可以删除也可以不用管它,但是不能加入编译。

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 定时器
    +关注

    关注

    23

    文章

    3195

    浏览量

    112903
  • 开源
    +关注

    关注

    3

    文章

    3071

    浏览量

    41840
  • 串口屏
    +关注

    关注

    8

    文章

    501

    浏览量

    36766
收藏 人收藏

    评论

    相关推荐

    单片机定时器用法

    本章以CW32通用定时器为例介绍单片机定时器用法
    的头像 发表于 01-04 10:37 1006次阅读
    单片机<b class='flag-5'>定时器</b>的<b class='flag-5'>用法</b>

    【产品应用】用 AWTK 和 AWPLC 快速开发嵌入式应用程序 (3)- 定时器

    AWPLC是ZLG自主研发的PLC系统(兼容IEC61131-3),本文用一个用定时器实现的走马灯程序,来演示如何用AWTK和AWPLC快速开发嵌入式应用程序。背景AWTK全称
    的头像 发表于 11-02 10:02 540次阅读
    【产品应用】用 <b class='flag-5'>AWTK</b> 和 AWPLC 快速<b class='flag-5'>开发</b>嵌入式应用程序 (3)- <b class='flag-5'>定时器</b>

    串口LUA教程4-定时器的使用

    串口LUA教程4-定时器的使用
    发表于 04-29 13:08 10次下载

    AWTK 开源智能串口方案

    AWTK开源智能串口方案发布,旨在解决传统串口诸多痛点,为用户提供更开放、更易用、更强大的
    的头像 发表于 12-02 08:24 644次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b>智能<b class='flag-5'>串口</b><b class='flag-5'>屏</b>方案

    ​【AWTK开源智能串口方案】方案介绍和工作原理

    本篇文章介绍一下AWTK开源智能串口方案的基本原理和实际使用效果,包括主要特点、应用场景、工作原理以及简单的Demo演示。引言:AWTK-
    的头像 发表于 12-21 08:24 577次阅读
    ​【<b class='flag-5'>AWTK</b><b class='flag-5'>开源</b>智能<b class='flag-5'>串口</b><b class='flag-5'>屏</b>方案】方案介绍和工作原理

    AWTK 串口开发(4) - 数据采集

    数据采用是一个常用的功能。在AWTK开源串口中,内置数据采样模型,只需设计用户界面即可实现采样数据的显示和管理。1.功能数据采集是一个常用的功能,MCU
    的头像 发表于 12-30 08:24 247次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(4) - 数据采集

    AWTK 串口开发(5) - MCU端 SDK 用法

    AWTK开源智能串口,不但开放了串口端全部源码,还提供了MCU端SDK,大大加快MCU软件的
    的头像 发表于 01-06 08:24 232次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(5) - MCU端 SDK <b class='flag-5'>用法</b>

    AWTK开源智能串口方案】HMI端程序移植编译及运行

    本篇文章介绍一下AWTK开源智能串口方案的串口端(即HMI端)的编译运行步骤,并介绍如何将H
    的头像 发表于 01-18 08:24 501次阅读
    【<b class='flag-5'>AWTK</b><b class='flag-5'>开源</b>智能<b class='flag-5'>串口</b><b class='flag-5'>屏</b>方案】HMI端程序移植编译及运行

    AWTK 开源串口开发(9) - 用户和权限管理

    AWTK串口中,内置用户管理和权限控制的模型,无需编码即可实现登录、登出、修改密码、权限控制、创建用户、删除用户等功能,本文介绍一下用户管理和权限控制的基本用法。用户管理和权限控制
    的头像 发表于 02-19 12:10 325次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(9) - 用户和权限管理

    AWTK开源智能串口方案】MCU SDK使用与编译运行

    代码智能串口方案,本系列文章介绍如何从零开发HMI程序,包括搭建开发环境、创建HMI运行时工程、修改应用界面以及开发MCU程序。MCU端简
    的头像 发表于 02-19 12:11 695次阅读
    【<b class='flag-5'>AWTK</b><b class='flag-5'>开源</b>智能<b class='flag-5'>串口</b><b class='flag-5'>屏</b>方案】MCU SDK使用与编译运行

    AWTK开源智能串口方案】设计UI界面并上传到串口

    本篇文章将介绍如何使用AWStudio设计串口端的UI界面和添加绑定规则,以及怎么将资源文件上传到串口端。引言:AWTK-HMI是基于
    的头像 发表于 02-22 08:24 368次阅读
    【<b class='flag-5'>AWTK</b><b class='flag-5'>开源</b>智能<b class='flag-5'>串口</b><b class='flag-5'>屏</b>方案】设计UI界面并上传到<b class='flag-5'>串口</b><b class='flag-5'>屏</b>

    AWTK 开源串口开发(10) - 告警信息的高级用法

    告警信息是串口常用的功能,之前我们介绍了告警信息的基本用法,实现了告警信息的显示和管理。本文介绍一下实现查询告警信息和查看告警信息详情的方法。1.功能之前我们介绍了告警信息的基本用法
    的头像 发表于 02-24 08:23 176次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(10) - 告警信息的高级<b class='flag-5'>用法</b>

    AWTK 开源串口开发(11) - 天气预报

    AWTK串口内置了XML/JSON/INI等各种数据文件的模型,并支持用HTTP/HTTPS从网络获取数据。不用编写一行代码,即可实现天气预报、股票行情、航班查询和快递查询等功能。天气预报是一个很
    的头像 发表于 03-05 08:24 201次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(11) - 天气预报

    AWTK 开源串口开发(12) - 记事本应用

    传统的的串口中,开发一个记事本应用,即使可能,也是非常麻烦的事情。在AWTK串口中,内置文件
    的头像 发表于 03-09 08:23 199次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(12) - 记事本应用

    AWTK 开源串口开发(16) - 提供 MODBUS 服务

    AWTK串口内置MODBUS从站模型,不用编写一行代码即可让串口提供MODBUS服务,让远程设备通过MODBUS协议访问
    的头像 发表于 04-13 08:24 213次阅读
    <b class='flag-5'>AWTK</b> <b class='flag-5'>开源</b><b class='flag-5'>串口</b><b class='flag-5'>屏</b><b class='flag-5'>开发</b>(16) - 提供 MODBUS 服务