【ESP32之旅】U8g2 在线仿真和UI调试

news2024/9/19 10:35:04

前言

几乎每个玩屏幕的电子DIYer都知道万能的屏幕驱动中间件u8g2库,这个库提供了强大的驱动适配和ui设计能力。但是官方没有一个好用的ui设计和仿真软件,在设计UI布局的时候对单片机频繁的烧录调试浪费了大量的时间。最近在论坛看到有一个第三方维护的在线u8g2 UI设计软件u8g2-simulator,尝试了下发现其非常好用,极大的节约了UI设计的时间。

在这里插入图片描述

不知道为什么原作者删除了自己的仓库并且停止了自己服务器上的部署,现在已经无法访问https://p3dt.net/u8g2sim/这个地址。但是比较庆幸的是可以在自己的电脑上进行部署。

本机部署

简单拜读了一下作者的代码,主要是通过JavaScript来完成界面的显示和输入的解析,因此我们需要安装nodejs来作为JavaScript的运行环境。然后安装依赖库即可完成部署。

NodeJs 安装

这里直接参考文档即可:

Node.js 安装配置 | 菜鸟教程 (runoob.com)

注意这里使用的NodeJs的版本需要是16,过高的版本将会出现诸如加密依赖等异常错误,望周知。

部署

npm i -g mycp			# windows 下没有cp指令因此需要安装此库,linux下不需要安装

npm install 
npm install sass
npm run start			# 运行

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

出现上图的提示信息就说明部署已经完成,在浏览器上输入http://localhost:8081即可运行。

在这里插入图片描述

代码使用的是C++ Arduino风格的API,可以使用 (u)int(8,16,32)_t , float , double 这种风格类型进行变量定义。如果需要在C代码上运行可能需要自己对照API在自己代码中进行逐一替换。

问题汇总

在部署过程中可能会遇到以下小问题:

  • 端口占用:Windows下如何查看某个端口被谁占用 | 菜鸟教程 (runoob.com)

  • web界面点击无效:原作者的仓库已经很久没人维护了,我在github上找到了另外一个后续维护,可以在我的仓库找到他的分支并且使用,地址如下 songzhishuo/u8g2-simulator: A simulator to test small helper functions using U8G2. (github.com)

参考

  • Ezzzzzzzzzzzzzz/u8g2-simulator: A simulator to test small helper functions using U8G2. (github.com)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/656608.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

nginx映射后,公网通过域名无法访问到静态资源

今天发生一件奇怪的事情,首先是阿里云的数字DV证书中pgj.bw580.com和acc.bw580.com无缘无故的消失了, 接着查看https://pgj.bw580.com/css/chunk-ceb11154.aefc15d8.css,在跳板机中可以访问到该资源,但是通过外网能够访问。 通过防…

MySQL 中各种锁的详细介绍

❤ 作者主页:欢迎来到我的技术博客😎 ❀ 个人介绍:大家好,本人热衷于Java后端开发,欢迎来交流学习哦!( ̄▽ ̄)~* 🍊 如果文章对您有帮助,记得关注、点赞、收藏、…

P109认识和改造世界

认识世界的根本目的在于改造世界 认识和改造世界之间的辩证关系 感觉只喜欢考 必然和自由的辩证关系 人类创造历史的两个基本活动 : 认识和改造世界所以认识和改造世界的基础是实践 认识改造和三大界之间的联系 改造客观世界和改造主观世界之间的关系 认识世界…

台电x80HD 安装linux系统,可调电压电源供电,外网访问、3D打印klipper固件

一、系统安装 参照https://blog.csdn.net/gangtieren/article/details/102975027安装 安装过程遇到的问题: 1、试了 linux mint 21 、ubuntu20.04 、ubuntu22.04 都没有直接安装成功,u盘选择安装进入系统后一直黑屏,只有ubuntu18.04 选择后稍…

基于Eclipse+Java+Swing+Mysql实现学生成绩管理系统

基于EclipseJavaSwingMysql实现学生成绩管理系统 一、系统介绍二、功能展示1.登陆2.成绩浏览3.班级添加4.班级维护5.学生添加6、学生维护 三、数据库四、其它1.其他系统实现五.获取源码 一、系统介绍 学生:登陆、成绩浏览 管理员:登陆、班级添加、班级维…

多分支merge忽略文件合并

该文章已同步收录到我的博客网站,欢迎浏览我的博客网站,xhang’s blog 1. .gitattributes 文件的作用 .gitattributes 文件是 Git 版本控制系统中的一个配置文件,它用于指定 Git 如何处理文件的二进制数据,以及如何标识文件的类…

字节月薪23k软件测试工程师:必备的6大技能(建议收藏)

软件测试 随着软件开发行业的日益发展,岗位需求量和行业薪资都不断增长,想要入行的人也是越来越多,但不知道从哪里下手,今天,就给大家分享一下,软件测试行业都有哪些必会的方法和技术知识点,作…

夏天到了,给数据中心泼点“冷水”

气温上升,还有什么能比“工作没了”,更能让人一瞬间心里拔凉拔凉的呢? 这个“薪尽自然凉”的故事,就发生在数据中心。 前不久,某电商平台正在购物高峰期,结果IDC冷冻系统故障,机房设备温度快速升…

智能电动汽车充电桩系统及硬件电路研究 安科瑞 许敏

摘要:随着充电桩技术的发展,以及人们对电动汽车快速充电的需求,很多厂商开始对智能充电桩进行研究。以电动 汽车智能充电桩的发展现状为背景,进行了智能电动汽车充电桩系统硬件电路的研究。 关键词:充电桩&#xff1b…

文件转换工具类—基于jodconverter和pdfbox实现的可以自定义各类文件转换和水印

源码获取&#xff1a;原文地址 概览 需要依赖 <dependency><groupId>org.jodconverter</groupId><artifactId>jodconverter-local</artifactId><version>4.4.6</version> </dependency> <dependency><groupId>or…

【MyBatis学习】占位符,sql注入问题,like模糊匹配等可能出现一定的问题,赶快与我一同去了解,避免入坑吧 ! ! !

前言: 大家好,我是良辰丫,今天还是我们的mybatis的学习,主要内容有两个占位符,sql注入问题,like模糊匹配,以及多表查询等,不断提升我们的编程能力,加油哈! ! !&#x1f48c;&#x1f48c;&#x1f48c; &#x1f9d1;个人主页&#xff1a;良辰针不戳 &#x1f4d6;所属专栏&…

MP地面站下载和回放日志

参考 https://ardupilot.org/dev/docs/common-downloading-and-analyzing-data-logs-in-mission-planner.html#common-downloading-and-analyzing-data-logs-in-mission-planner 下载日志 首先连接上飞控 然后在下图页面下载日志&#xff1a; 点击下图下载日志 下载的日志会…

在CentOS 7上安装Python 3.9

前言 这是我在这个网站整理的笔记&#xff0c;关注我&#xff0c;接下来还会持续更新。 作者&#xff1a;RodmaChen 在CentOS 7上安装Python 3.9 一. 更新系统软件包二. 安装必要的软件包和依赖项三. 下载Python 3.9四. 解压和编译源代码五. 安装Python 3.9六. 验证安装 一. 更…

SpringCloud Alibaba-Seata分布式事务

SpringCloud Alibaba-Seata 1 常用事务解决方案模型1.1 DTP模型1.2 2PC1.3 3PC1.4 TCC 2 Seata2.1 Seata术语2.1 Seata AT模式2.1.1 AT模式及工作流程2.1.2 Seata-Server安装2.1.3 集成springcloud-alibaba 4.2 Seata TCC模式 3 Seata注册中心3.1 服务端注册中心配置3.2 客户端…

全国主要城市建筑轮廓(含层高)矢量数据分享及最新AI提取建筑分布方法介绍

今天要给大家带来的数据就是全国主要大中型城市的城市建筑轮廓矢量数据&#xff01;&#xff01;同时给大家一个傻瓜式的建筑物提取软件&#xff0c;以及其使用方法&#xff01;&#xff01; 第一部分&#xff1a;数据 一、数据基本情况 建筑轮廓数据实际上就是建筑的边界矢量…

easyX绘图设备相关函数(注释版)

0.前言 这里是limou3434的easyX博文系列&#xff0c;感兴趣可以看看我的其他内容。 本次我给您带来的是easyX的绘图设备相关函数&#xff0c;和上一篇一样&#xff0c;对于官方文档我给了一些自认为重要的注释和测试例子&#xff0c;来辅助您理解这些函数。 1.easyX库函数分…

【汤4操作系统】深入掌握操作系统-文件管理篇

第六章 文件管理 文件 数据项&记录&文件 数据项分为&#xff1a; 基本数据项&#xff1a;描述对象的某些属性&#xff0c;例如学生的年龄&#xff0c;姓名学号等组合数据项&#xff1a;由若干个基本数据项组合而成 记录&#xff1a;一组相关数据项的集合&#xff0…

光线追踪中的空间划分,辐射度量学简介

之前接触过四岔树&#xff0c;这里用到了KD-tree和BSP-Tree KD-Tree 对于如何划分&#xff1a; 首先需要知道需要沿着哪一条轴进行划分&#xff0c;划分的位置所有节点不存在父节点上&#xff0c;只存在于叶节点上 对于如何查找 光线穿过包围盒A&#xff0c;那么分别对其两…

4.4 超简单文书编辑器:nano

在Linux系统当中有非常多的文书编辑器存在&#xff0c;其中最重要的是vim。 nano使用很简单&#xff0c;可以直接加上文件名就能够打开一个旧文件或新文件。打开一个叫text.txt的文件名来看看&#xff1a; [ctrl]-G&#xff1a;取得线上说明&#xff08;help&#xff09;&…

Python案例——采集专栏文章保存成pdf

前言 嗨喽&#xff0c;大家好呀~这里是爱看美女的茜茜呐 环境使用: python 3.8 >>>>>> 运行代码 pycharm 2022.3 >>>>>> 辅助敲代码 wkhtmltopdf 软件 找助理邀课老师获取 模块使用: 内置模块 re >>>正则表达式 第三方模…