当前位置: 首页 > news >正文

touchGFX控件学习四、scalableImage、flex button控件

一、效果展示

在这里插入图片描述

二、控件介绍

1、scalableImage

用于表示位图缩放版本的小工具。只需更改小部件的宽度/高度即可调整图像大小。缩放图像的质量取决于使用的渲染算法。渲染算法可以动态更改。请注意,缩放图像是在运行时完成的,可能需要大量计算。
缩放算法有两种NEAREST_NEIGHBOR和BILINEAR_INTERPOLATION

2、flex button

TouchGFX中的Flex按钮是一个可以感知触摸事件并在触发Flex按钮时发送回调的小部件。灵活按钮可适应用户的需求。它可以结合其他按钮类型的行为和外观,但作为一种折衷,它占用了更多的RAM。然而,在大多数情况下,这将是一个微不足道的数额。Flex Button最多可以由4个视觉元素组成:BoxWithBorder、Icon、Text和Image。

三、touchGFX工程搭建

1、添加图片资源

在这里插入图片描述

2、界面搭建

在这里插入图片描述

a、scalableImage1设置

在这里插入图片描述

b、btnSmall设置

在这里插入图片描述

c、btnBig设置在这里插入图片描述

d、box1设置

在这里插入图片描述

e、添加两个interactions

在这里插入图片描述
在这里插入图片描述

四、源码工程修改

找到Screen1View.hpp文件添加函数申明,这个函数必须和添加的函数同名因为要发送重载
在这里插入图片描述
找到Screen1View.cpp文件实现两个函数,并添加代码

在这里插入图片描述

void Screen1View::btn_small_click()
{
    this->scalableImage1.setWidthHeight(this->scalableImage1.getWidth()-10, this->scalableImage1.getHeight()-10);
    this->scalableImage1.invalidate();
    this->box1.invalidate();
}

void Screen1View::btn_big_click()
{
    this->scalableImage1.setWidthHeight(this->scalableImage1.getWidth()+10, this->scalableImage1.getHeight()+10);
    this->scalableImage1.invalidate();
    this->box1.invalidate();
}

工程编译,烧录看看效果喽

相关文章:

  • Redis【缓存雪崩,缓存穿透,缓存击穿】详解
  • 【2022 年】 Python3 爬虫教程 - 爬虫是什么?
  • 长安链源码学习 vm-docker-go
  • 网课题库接口API—小白专用版本
  • STM32单片机的 Hard-Fault 硬件错误问题追踪与分析
  • 【精品】SpringBoot中整合Redis的简单封装及应用
  • C++ STL --- list的使用
  • 聚焦金融行业未来,博睿数据亮相第五届中国银行CIO峰会
  • 57.【Java 接口】
  • 【SCI期刊调研】
  • 【Dart 入门教程】(一) Dart 简介与安装
  • 十堰小程序开发,免费试用60天
  • 20220923_数据库过程_直销员计算语句
  • Mybatis知识总结一
  • 基于springboot校园疫情防控系统
  • [NodeJS] 关于Buffer
  • Android优雅地处理按钮重复点击
  • Dubbo 整合 Pinpoint 做分布式服务请求跟踪
  • electron原来这么简单----打包你的react、VUE桌面应用程序
  • ES2017异步函数现已正式可用
  • ES6简单总结(搭配简单的讲解和小案例)
  • HTTP中GET与POST的区别 99%的错误认识
  • interface和setter,getter
  • java多线程
  • linux安装openssl、swoole等扩展的具体步骤
  • niucms就是以城市为分割单位,在上面 小区/乡村/同城论坛+58+团购
  • python学习笔记 - ThreadLocal
  • quasar-framework cnodejs社区
  • underscore源码剖析之整体架构
  • Vue.js-Day01
  • webgl (原生)基础入门指南【一】
  • 从零开始的webpack生活-0x009:FilesLoader装载文件
  • 买一台 iPhone X,还是创建一家未来的独角兽?
  • 那些被忽略的 JavaScript 数组方法细节
  • 前端攻城师
  • 深入浅出Node.js
  • 手机端车牌号码键盘的vue组件
  • 学习ES6 变量的解构赋值
  • 一道面试题引发的“血案”
  • 用 Swift 编写面向协议的视图
  • 智能合约Solidity教程-事件和日志(一)
  • ​iOS实时查看App运行日志
  • ​LeetCode解法汇总2670. 找出不同元素数目差数组
  • (01)ORB-SLAM2源码无死角解析-(56) 闭环线程→计算Sim3:理论推导(1)求解s,t
  • (2)(2.10) LTM telemetry
  • (Redis使用系列) SpirngBoot中关于Redis的值的各种方式的存储与取出 三
  • (二十一)devops持续集成开发——使用jenkins的Docker Pipeline插件完成docker项目的pipeline流水线发布
  • (附源码)springboot 房产中介系统 毕业设计 312341
  • (附源码)springboot教学评价 毕业设计 641310
  • (附源码)计算机毕业设计SSM疫情下的学生出入管理系统
  • (六) ES6 新特性 —— 迭代器(iterator)
  • (四)Linux Shell编程——输入输出重定向
  • (原+转)Ubuntu16.04软件中心闪退及wifi消失
  • (原創) 如何讓IE7按第二次Ctrl + Tab時,回到原來的索引標籤? (Web) (IE) (OS) (Windows)...
  • (正则)提取页面里的img标签