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

2、LVGL控件-标签、按钮

本篇文章目录导航

♠♠ LVGL控件-标签、按钮
♣♣♣♣ 一、LVGL标签部件
♦♦♦♦♦♦♦♦ 1.1 标签部件组成部分
♦♦♦♦♦♦♦♦ 1.2 如何创建标签部件以及设置文本?
♦♦♦♦♦♦♦♦ 1.3 如何改变文本的样式?
♦♦♦♦♦♦♦♦ 1.4 当文本长度超过部件大小时怎么显示?
♦♦♦♦♦♦♦♦ 1.5 文本如何对齐标签?
♦♦♦♦♦♦♦♦ 1.6 如何让标签文本变得艺术化(字体阴影效果,样式Style)?
♣♣♣♣ 二、LVGL按钮部件
 


#LVGL控件-标签、按钮
##一、LVGL标签部件

在LVGL中,标签部件主要用于文本显示,例如标题、提示信息等。

效果图:


 


###1.1 标签部件组成部分
主体(LV_PART_MAIN):使用所有典型的背景属性和文本属性。填充值可用于在文本和背景之间添加空间。
滚动条(LV_PART_SCROLLBAR):当文本大于组件的大小时显示的滑动条。
选中的文本(LV_PART_SELECTED):告诉selected text的样式。只能使用text_color和bg_color样式属性。
 


###1.2 如何创建标签部件以及设置文本?

创建标签部件

lv_obj_t *label = lv_label_create(parent);

设置文本的三种方式(\n表示换行):
1、直接设置文本,存储文本的内存动态分配:

lv_label_set_text(label, "hallo \n lvgl");

2、文本不存储在动态内存,而是在指定的缓冲区中(慎用):

lv_label_set_text_static(label, "hallo");

3、格式化显示文本,类似printf:

lv_label_set_text_fmt(label, "Value:%d", 50); 

实验小演示1:创建标签部件并设置文本。

void my_gui(void)
{
    lv_obj_t *label = lv_label_create(lv_scr_act());    /* 创建标签部件 */
    lv_obj_center(label);                               /* 居中标签部件 */

    lv_label_set_text(label, "hello \n Couvrir");       /* 设置标签文本 */
}

演示图片:


 


###1.3 如何改变文本的样式?
1、背景颜色(一般背景透明度默认为0,值范围0~255):

lv_obj_set_style_bg_color(label, lv_color_hex(0xffe1d4), LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(label, 255, LV_STATE_DEFAULT);

2、字体大小(需要lv_conf.h中打开对应的字体宏):

点击2、LVGL控件-标签、按钮——古月居可查看全文


http://www.kler.cn/a/280166.html

相关文章:

  • uni-app开发日志:schema2code生成的新增页和修改页因字段太多用分段器实现分段分类
  • abc 366 E+F(曼哈顿距离 x y 两个坐标分别计算)(贪心+01背包)
  • 微前端架构:使用不同框架构建可扩展的大型应用
  • Pytest框架直接右键运行 testcase.py,不执行最外层conftest
  • webserver.h详解
  • vector相关功能的底层实现
  • OpenHarmony Camera源码分析
  • ARM程序的组成和执行过程
  • vue3的nginx配置文件配置(nginx只配置前端vue3的nginx.conf文件)
  • 计算机专业的真正的就业情况
  • OpenCV绘图函数(2)绘制圆形函数circle()的使用
  • Godot《躲避小兵》实战之游戏开始界面制作
  • 关于crontab使用
  • C++细节整理
  • Element-UI自学实践(二)
  • Ai+若依(页面调整--去除若依的各种痕迹,采用自己的):【07篇】
  • java框架第一课(mybatis认识)
  • 浅谈FlashAttention优化原理
  • EazyDraw for Mac 矢量图绘制设计软件
  • 【机器学习】6. 线性回归、损失计算、最小二乘法、岭回归