LVGL+OneOS!

LVGL,一款很火的GUI开发库,一个高度可裁剪、低资源占用、界面美观且易用的嵌入式系统图形库。本身并不依赖特定的硬件平台,任何满足LVGL硬件配置要求的微控制器均可运行LVGL

OneOS,中国移动针对物联网领域推出的轻量级操作系统,具有可裁剪、跨平台、低功耗、高安全等特点,支持ARM Cortex-M/R/A、MIPS、RISC-V等主流CPU架构,兼容POSIX、CMSIS等标准接口,支持Micropython语言开发,提供图形化开发工具,能够有效提高开发效率并降低开发成本,帮助客户开发稳定可靠、安全易用的物联网应用。

最近,浏览OneOS专区的时候,发现有网页在写OneOS+LVGL的有效结合。也就是说,OneOS适配了LVGL了?想着,yeah,有时间一定要试试。

有趣的GUI开发方式

我们可以直接写代码来生成图片,但更有趣且容易的方式是使用拖拽的方式,直观快速地生成代码,从而生成图片。一直对LVGL有些许好感,刚好今年发布了SquareLine Studio,所以体验一下!

SquareLine Studio是一个可视化的拖放式UI编辑器,可以快速轻松地为嵌入式和桌面应用程序创建漂亮的图形用户界面。它面向爱好者、专业人士、程序员和设计师。

SquareLine Studio官方网址:SquareLine Studio

体验SquareLine 生成代码

下载安装好SquareLine 以后,拖拽体验下。

然后,export导出生成源代码。

最后,把源码放入板级项目中去,这里以stm32f469-st-disco为例。

并在main.c文件中调用ui_init接口。

static void user_task(void *parameter)
{
int i = 0;
for (i = 0; i < led_table_size; i++)
{
os_pin_mode(led_table[i].pin, PIN_MODE_OUTPUT);
}
ui_init();

直接编译,发现报错了。。。。什么情况!

application\heart\ui.h(13): error:  #59: function call is not allowed in a constant expression

百度了一下,发现是c++ 17扩展了预处理器,使其能够检查是否包含特定的头文件。所以,直接把它屏蔽了。。。

然后,加大了任务的栈。显示如下,颜色深度没有匹配,有点失真。。。:

源码

https://gitee.com/miracle_get/squareline

squareline搭档OneOS图形组件之可视化GUI开发的更多相关文章

  1. HT图形组件设计之道(三)

    上篇我们通过定制了CPU和内存展示界面,体验了HT for Web通过定义矢量实现图形绘制与业务数据的代码解耦及绑定联动,这类案例后续文章还会继续以便大家掌握更多的矢量应用场景,本篇我们先切换个话题, ...

  2. HTML5拓扑图形组件设计之道(一)

    HT for Web(http://www.hightopo.com/guide/readme.html)提供了涵盖通用组件.2D拓扑图形组件以及3D引擎的一站式解决方案,正如Hightopo官网所表 ...

  3. HT图形组件设计之道(一)

    HT for Web简称HT提供了涵盖通用组件.2D拓扑图形组件以及3D引擎的一站式解决方案,正如Hightopo官网所表达的我们希望提供:Everything you need to create ...

  4. java容器Container和组件Component之GUI

    GUI全称Graphical User Interfaces,意为图形用户户界面,又称为图形用户接口,GUI指的就是采用图形方式显示的计算机操作用户界面,打个比方吧,我们点击QQ图标,就会弹出一个QQ ...

  5. 使用 Eclipse 可视化插件 windowbuilder 进行Java GUI开发(插件安装的两种方法)

    对于Java GUI开发 其实最方便的方法是用插件制作,当然先了解完代码原理是最好的. eclispe安装windowbuilder有两种方式,一种是离线安装,一种是在线安装. 一.第一种在线安装: ...

  6. 数百个 HTML5 例子学习 HT 图形组件 – 3D建模篇

    http://www.hightopo.com/demo/pipeline/index.html <数百个 HTML5 例子学习 HT 图形组件 – WebGL 3D 篇>里提到 HT 很 ...

  7. 数百个 HTML5 例子学习 HT 图形组件 – 3D 建模篇

    http://www.hightopo.com/demo/pipeline/index.html <数百个 HTML5 例子学习 HT 图形组件 – WebGL 3D 篇>里提到 HT 很 ...

  8. 数百个 HTML5 例子学习 HT 图形组件 – WebGL 3D 篇

    <数百个 HTML5 例子学习 HT 图形组件 – 拓扑图篇>一文让读者了解了 HT的 2D 拓扑图组件使用,本文将对 HT 的 3D 功能做个综合性的介绍,以便初学者可快速上手使用 HT ...

  9. 数百个 HTML5 例子学习 HT 图形组件 – 拓扑图篇

    HT 是啥:Everything you need to create cutting-edge 2D and 3D visualization. 这口号是当年心目中的产品方向,接着就朝这个方向慢慢打 ...

随机推荐

  1. 源码解析Synchronous Queue 这种特立独行的队列

    摘要:Synchronous Queue 是一种特立独行的队列,其本身是没有容量的,比如调用者放一个数据到队列中,调用者是不能够立马返回的,调用者必须等待别人把我放进去的数据消费掉了,才能够返回. 本 ...

  2. Bugku CTF练习题---加密---聪明的小羊

    Bugku CTF练习题---加密---聪明的小羊 flag:KEY{sad23jjdsa2} 解题步骤: 1.观察题目,发现其中的信息 2.经过题目判断,得知该题属于栅栏密码的一种,并且介绍中表明了 ...

  3. Metalama简介5.配合VisualStudio自定义重构或快速操作功能

    使用基于Roslyn的编译时AOP框架来解决.NET项目的代码复用问题 Metalama简介1. 不止是一个.NET跨平台的编译时AOP框架 Metalama简介2.利用Aspect在编译时进行消除重 ...

  4. 在博客文章中使用mermaid 定义流程图,序列图,甘特图

    概述 Mermaid(美人鱼)是一套markdown语法规范,用来在markdown文档中定义图形,包括流程图.序列图.甘特图等等. 它的官方网站是 https://mermaid-js.github ...

  5. Yapi Docker 部署

    参考 https://github.com/Ryan-Miao/docker-yapi , 并使用该代码的脚本构建yapi image. 部署mongodb docker run \ --name m ...

  6. HAVING,多表查询思路,可视化软件navicat,多表查询练习题,

    HAVING "where"是一个约束声明,在查询数据库的结果返回之前对数据库中的查询条件进行约束,即在结果返回之 前起作用,且"where"后面不能写&quo ...

  7. 服务器上详细前后端分离项目搭建(springboot+vue)

    介绍:本文用的经典的前后端分离开源项目ruoyi Gitee链接地址:https://gitee.com/y_project/RuoYi 一.拉取项目: 利用Git把项目拉取到本地,也可以直接利用id ...

  8. maven install resources failed: newPosition < 0: (-1 < 0)

    添加以下代码在 pom.xml 中,具体参阅这里 <build> <plugins> <plugin> <groupId>org.apache.mave ...

  9. 零基础学Java第五节(面向对象一)

    本篇文章是<零基础学Java>专栏的第五篇文章,文章采用通俗易懂的文字.图示及代码实战,从零基础开始带大家走上高薪之路! 本文章首发于公众号[编程攻略] 类与对象 在哲学体系中,可以分为主 ...

  10. 基于 GraphQL 的 BFF 实践

    随着软件工程的发展,系统架构越来越复杂,分层越来越多,分工也越来越细化.我们知道,互联网是离用户最近的行业,前端页面可以说无时无刻不在变化.前端本质上还是用户交互和数据展示,页面的高频变化意味着对数据 ...