前言
前些日子到手了一块raspberry pico和2.2寸屏ILI9341,想通过ILI9341显示屏让pico的实验做起来更加丰富多彩。下图是我的实验成果:
实验说明
实验中我使用的材料如下:
- raspberry pico
- 2.2寸屏ILI9341
- 滑动变阻器
实验预期效果
pico在2.2寸屏ILI9341显示一个量规实时显示滑动变阻器的数值。
接线
测试代码
/**
* Copyright (c) 2008-2021 深圳百问网科技有限公司<http://lvgl.100ask.net>
*
* SPDX-License-Identifier: BSD-3-Clause
*/
#include "pico/stdlib.h"
#include "hardware/adc.h"
#include "lvgl_src/lvgl.h"
#include "ili9341/ili9341.h"
#include "ili9341/lv_port_disp.h"
//extern void ili9341_init();
//extern void lv_port_disp_init(void);
static void lv_100ask_adc_gauge_anim(lv_obj_t * gauge, lv_anim_value_t value);
static void lv_100ask_widget_test_init(void);
static void lv_100ask_widget_test_init(void)
{
lv_anim_t a; // 表盘动画
lv_anim_init(&a);
lv_obj_t * adc_gauge = lv_gauge_create(lv_scr_act(), NULL);
lv_gauge_set_range(adc_gauge, 0 ,3000);
lv_gauge_set_critical_value(adc_gauge, 2400); // 设置临界值,超过临界值部分的颜色为 scale_end_color
lv_obj_set_drag_parent(adc_gauge, true);
lv_obj_set_size(adc_gauge, 200, 200);
lv_obj_align(adc_gauge, NULL, 0, 0, 0);
lv_obj_set_style_local_margin_top(adc_gauge, LV_GAUGE_PART_MAIN, LV_STATE_DEFAULT, LV_DPX(30));
lv_obj_set_style_local_value_font(adc_gauge, LV_LABEL_PART_MAIN, LV_STATE_DEFAULT, &lv_font_montserrat_14); // 设置文字大小
lv_obj_set_style_local_value_str(adc_gauge, LV_GAUGE_PART_MAIN, LV_STATE_DEFAULT, "ADC");
lv_obj_set_style_local_value_align(adc_gauge, LV_GAUGE_PART_MAIN, LV_STATE_DEFAULT, LV_ALIGN_CENTER);
lv_obj_set_style_local_value_ofs_y(adc_gauge, LV_GAUGE_PART_MAIN, LV_STATE_DEFAULT, LV_DPX(80));
lv_obj_t * label = lv_label_create(adc_gauge, NULL);
lv_obj_set_style_local_text_font(label, LV_LABEL_PART_MAIN, LV_STATE_DEFAULT, &lv_font_montserrat_10); // 设置文字大小
lv_obj_align(label, adc_gauge, LV_ALIGN_CENTER, 0, lv_obj_get_width(adc_gauge)/4);
lv_anim_set_var(&a, adc_gauge);
lv_anim_set_exec_cb(&a, (lv_anim_exec_xcb_t)lv_100ask_adc_gauge_anim);
lv_anim_set_values(&a, 0, 1);
lv_anim_set_time(&a, 500);
lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);
lv_anim_start(&a);
}
/*
* 函数名: static void lv_100ask_adc_gauge_anim(lv_obj_t * gauge, lv_anim_value_t value)
* 输入参数: 动画对象
* 输入参数: 传递给动画的数据
* 返回值: 无
* 函数作用: 更新展示ADC检测值
*/
static void lv_100ask_adc_gauge_anim(lv_obj_t * gauge, lv_anim_value_t value)
{
adc_select_input(0);
uint adc_value = adc_read();
//adc_value = f_value*1000;
lv_gauge_set_value(gauge, 0, adc_value);
char tmpchar[32] = {0};
lv_snprintf(tmpchar, sizeof(tmpchar), "AD:%d\nVoltage:%f v", adc_value, (float)(adc_value * (3.3 / 4096)));
lv_obj_t * label = lv_obj_get_child(gauge, NULL);
lv_label_set_text(label, tmpchar);
lv_obj_align(label, gauge, LV_ALIGN_IN_BOTTOM_MID, 0, -lv_obj_get_height(label));
}
int main() {
stdio_init_all();
// possibly set ili9341_config parameters if your pins/spi port don't match
ili9341_init();
lv_init();
lv_port_disp_init();
adc_init();
// Make sure GPIO is high-impedance, no pullups etc
adc_gpio_init(26);
//lv_obj_t * scr = lv_obj_create(NULL, NULL);
//lv_scr_load(scr);
lv_100ask_widget_test_init();
while (true) {
sleep_ms(5); /*Sleep for 5 millisecond*/
lv_task_handler();
lv_tick_inc(5); /*Tell LVGL that 5 milliseconds were elapsed*/
}
}
LVGL中文手册
lvgl官方的教程是英文的,这个是我在做项目时顺便做出来的中文教程站点(持续更新维护),不仅仅只是照搬lvgl官方文档的翻译,同时总结了我们在实际开发中遇到的各种细节,让这个文档更加适合我们在实际开发中的需求。
- lvgl官方原版教程: https://docs.lvgl.io
- lvgl中文教程(中文手册):http://lvgl.100ask.net