学习ESP32——使用SquareLine_Studio自定义一个UI界面学习ESP32——使用SquareLine_Studio自定义一个UI界面
  BUniBU6Nn1a2 2023年12月01日 23 0


打开SquareLine_Studio软件,先生成一个项目,这里我选择乐鑫官方的板子

 

选择File→Project Settings选择导出的地址,点击APPLY CHANGES

 

完成后,先下载字体和图标

进入阿里矢量图标官网

 

学习ESP32——使用SquareLine_Studio自定义一个UI界面学习ESP32——使用SquareLine_Studio自定义一个UI界面_#if

 

 

注册登录之后点击 资源管理 → 我的项目

 

新建项目

 

右上角搜索图标,字体,加入自己的项目

 

添加完成后,下载到本地。

只取用.tft文件,放入SquareLine_Studio项目中的assets文件夹中

 

 

导入完成之后,把刚刚下载的图标字体放进工程

 

创建自己的图标和字体库,Symbols里可以选择自己会用到的字

 

创建完成之后就可以显示中文字体

 

导入图标和刚刚的操作一样,在Range里面把图标对应的unicode码依次写上

 

把需要的文字和图标摆好后,导出

 

将SquareLine项目中的以下文件导入文件到自己的工程,直接放在main文件夹内

 

打开VScode编译工程,在程序里调用ui.h函数,并初始化。(此处用的是lvgl的Music例程)

编译,修改报错。

#include "ui.h"


// lv_demo_music();//music演示例程
ui_init(); // ui初始化
字体报错,搜索,定位到报错的地方,这里是移植的版本问题

 

把#if LV_VERSION_CHECK(8, 0, 0) 替换成 #ifLV_VERSION_CHECK(7, 4, 0) || LVGL_VERSION_MAJOR >= 8,点击全部替换。

 

修改完成后再次编译,继续修改报错

在这里增加一条定义,将LV_COLOR_16_SWAP 定义为1

这里是动画的代码,我们没有使用,先屏蔽

 

成功编译,下载

 

成功下载到开发板,并显示ui界面

【版权声明】本文内容来自摩杜云社区用户原创、第三方投稿、转载,内容版权归原作者所有。本网站的目的在于传递更多信息,不拥有版权,亦不承担相应法律责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@moduyun.com

  1. 分享:
最后一次编辑于 2023年12月01日 0

暂无评论

推荐阅读
BUniBU6Nn1a2