样式属性（Style properties）

最新推荐文章于 2025-08-12 09:50:16 发布
原创 最新推荐文章于 2025-08-12 09:50:16 发布 · 504 阅读 · 15 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#开发语言 #c语言 #ui

样式属性

https://lvgl.100ask.net/8.1/overview/style-props.html#

一、尺寸与位置（Size and position）
控制对象的大小、位置、变换等基础布局属性。

属性名说明默认值继承性布局影响扩展绘制
width设置对象宽度，支持像素值、百分比（基于父对象内容区宽度）和 LV_SIZE_CONTENT（自适应内容）0否是否
min_width设置最小宽度，支持像素值和百分比（基于父对象内容区宽度）0否是否
max_width设置最大宽度，支持像素值和百分比（基于父对象内容区宽度）0否是否
height设置对象高度，支持像素值、百分比（基于父对象内容区高度）和 LV_SIZE_CONTENT（自适应内容）0否是否
min_height设置最小高度，支持像素值和百分比（基于父对象内容区高度）0否是否
max_height设置最大高度，支持像素值和百分比（基于父对象内容区高度）0否是否
x设置对象X坐标（需结合对齐方式），支持像素值和百分比（基于父对象内容区宽度）0否是否
y设置对象Y坐标（需结合对齐方式），支持像素值和百分比（基于父对象内容区高度）0否是否
align设置对齐方式（决定X/Y坐标参考点），可选值包括各类LV_ALIGN开头的对齐方式0否是否
transform_width向两侧扩展宽度，支持像素值和百分比（基于对象自身宽度）0否是否
transform_height向两侧扩展高度，支持像素值和百分比（基于对象自身高度）0否是否
translate_x在X轴移动对象（布局后应用），支持像素值和百分比（基于对象自身宽度）0否是否
translate_y在Y轴移动对象（布局后应用），支持像素值和百分比（基于对象自身高度）0否是否
transform_zoom缩放图像类对象，256（LV_IMG_ZOOM_NONE）为原始大小，128为缩小50%，512为放大100%0否是否
transform_angle旋转图像类对象，单位为0.1度（如450表示45度）0否是否

二、内边距（Padding）
控制对象内容区与边界的间距，或子对象之间的间距。

属性名说明默认值继承性布局影响扩展绘制
pad_top顶部内边距（缩小内容区域顶部空间）0否是否
pad_bottom底部内边距（缩小内容区域底部空间）0否是否
pad_left左侧内边距（缩小内容区域左侧空间）0否是否
pad_right右侧内边距（缩小内容区域右侧空间）0否是否
pad_row行间距（控制子元素垂直间距的布局参数）0否是否
pad_column列间距（控制子元素水平间距的布局参数）0否是否

三、杂项（Miscellaneous）
其他通用样式属性。

属性名说明默认值继承性布局影响扩展绘制
radius设置圆角半径，支持像素值（≥0）或LV_RADIUS_CIRCLE（最大圆角）0否否是
clip_corner是否裁剪圆角处溢出的内容（true/false）0否否是
opa透明度设置：0（完全透明）～256（完全不透明），支持预定义值（如LV_OPA_10）0否否是
color_filter_dsc为对象颜色添加滤镜效果0否否是
color_filter_opa滤镜强度（透明度规则同opa）0否否是
anim_time动画持续时间（毫秒），具体含义因组件而异0否否是
anim_speed动画速度（像素/秒），具体含义因组件而异0否否是
transition状态过渡动画描述（lv_style_transition_dsc_t结构体）0否否是
blend_mode背景混合模式：
LV_BLEND_MODE_NORMAL（正常）
LV_BLEND_MODE_ADDITIVE（叠加）
LV_BLEND_MODE_SUBTRACTIVE（减淡）		0否否是
layout设置对象布局方式，影响子对象排列0否是否
base_dir文本方向：
LV_BIDI_DIR_LTR（左到右）
LV_BIDI_DIR_RTL（右到左）
LV_BIDI_DIR_AUTO（自动）		0否是否

四、背景（Background）
控制对象背景的样式。

属性名说明默认值继承性布局影响扩展绘制
bg_color背景颜色设置0否否是
bg_opa背景透明度设置（遵循标准透明度规则）0否否是
bg_grad_color背景渐变色设置（仅在bg_grad_dir不为LV_GRAD_DIR_NONE时生效）0否否是
bg_grad_dir背景渐变方向设置
可选值：
LV_GRAD_DIR_NONE（无渐变）
HOR（水平渐变）
VER（垂直渐变）		0否否是
bg_main_stop背景色渐变起始点设置
（0表示左上角，255表示右下角，128表示中心）		0否否是
bg_grad_stop渐变色渐变起始点设置
（0表示左上角，255表示右下角，128表示中心）		0否否是
bg_img_src背景图片设置
支持：
lv_img_dsc_t指针
文件路径
LV_SYMBOL_xxx符号		0否否是
bg_img_opa背景图片透明度设置（遵循标准透明度规则）0否否是
bg_img_recolor背景图片重着色颜色设置0否否是
bg_img_recolor_opa背景图片重着色强度设置（遵循标准透明度规则）0否否是
bg_img_tiled背景图片平铺显示设置（布尔值：true/false）0否否是

五、边框（Border）
控制对象边框的样式。

属性名说明默认值继承性布局影响扩展绘制
bg_color背景颜色设置0否否是
bg_opa背景透明度设置（遵循标准透明度规则）0否否是
bg_grad_color背景渐变色设置（仅在bg_grad_dir不为LV_GRAD_DIR_NONE时生效）0否否是
bg_grad_dir背景渐变方向设置
可选值：
LV_GRAD_DIR_NONE（无渐变）
HOR（水平渐变）
VER（垂直渐变）		0否否是
bg_main_stop背景色渐变起始点设置
（0表示左上角，255表示右下角，128表示中心）		0否否是
bg_grad_stop渐变色渐变起始点设置
（0表示左上角，255表示右下角，128表示中心）		0否否是
bg_img_src背景图片设置
支持：
lv_img_dsc_t指针
文件路径
LV_SYMBOL_xxx符号		0否否是
bg_img_opa背景图片透明度设置（遵循标准透明度规则）0否否是
bg_img_recolor背景图片重着色颜色设置0否否是
bg_img_recolor_opa背景图片重着色强度设置（遵循标准透明度规则）0否否是
bg_img_tiled背景图片平铺显示设置（布尔值：true/false）0否否是

六、文本（Text）
控制文本类组件的样式。

属性名说明默认值继承性布局影响扩展绘制
text_color文本颜色0否否是
text_opa文本透明度（遵循与opa相同的透明度规则）0否否是
text_font文本字体（lv_font_t指针）0否是是
text_letter_space字符间距（单位：像素）0否是是
text_line_space行间距（单位：像素）0否是是
text_decor文本装饰。可选：LV_TEXT_DECOR_NONE（无）/UNDERLINE（下划线）/STRIKETHROUGH（删除线），可组合使用0否否是
text_align文本行对齐方式（不影响对象本身对齐）。可选：LV_TEXT_ALIGN_LEFT/CENTER/RIGHT/AUTO（根据文本方向自动对齐）0否否是

七、图像（Image）
控制图像类组件的样式。

属性名说明默认值继承性布局影响扩展绘制
img_opa设置图像透明度（遵循与opa相同的透明度规则）0否否是
img_recolor为图像混合重着色0否否是
img_recolor_opa设置图像重着色强度（遵循与opa相同的透明度规则）0否否是

八、轮廓（Outline）
控制对象轮廓的样式（轮廓指对象外围的线条，与边框有所区别）。

属性名说明默认值继承性布局影响扩展绘制
outline_width轮廓宽度（单位：像素）0否否是
outline_color轮廓颜色0否否是
outline_opa轮廓透明度（遵循opa透明度规则）0否否是
outline_pad轮廓与对象的间距（单位：像素）0否否是

九、阴影（Shadow）
控制对象阴影的样式。

属性名说明默认值继承性布局影响扩展绘制
shadow_width阴影宽度（单位：像素，≥0）0否否是
shadow_ofs_x阴影在X轴方向的偏移量（单位：像素）0否否是
shadow_ofs_y阴影在Y轴方向的偏移量（单位：像素）0否否是
shadow_spread阴影扩散范围（单位：像素，正值扩大，负值缩小）0否否是
shadow_color阴影颜色0否否是
shadow_opa阴影透明度（遵循opa透明度规则）0否否是

十、线条（Line）
控制线条类组件的样式。

属性名说明默认值继承性布局影响扩展绘制
line_width线条宽度（单位：像素）0否否是
line_dash_width虚线宽度（单位：像素，仅支持水平和垂直线）0否否是
line_dash_gap虚线间距（单位：像素，仅支持水平和垂直线）0否否是
line_rounded线条端点圆角效果（布尔值：true/false）0否否是
line_color线条颜色0否否是
line_opa线条透明度（遵循opa透明度规则）0否否是

十一、圆弧（Arc）
控制圆弧类组件的样式（如仪表盘、进度环等）。

属性名说明默认值继承性布局影响扩展绘制
arc_width圆弧宽度（像素单位）0否否是
arc_rounded圆弧端点样式：true=圆角，false=直角0否否是
arc_color圆弧颜色设置0否否是
arc_opa圆弧透明度设置（0=完全透明，256=完全不透明）0否否是
arc_img_src圆弧遮罩图像源（支持 lv_img_dsc_t 指针或文件路径）0否否是
Qt —— 样式表之“自定义属性“（附：源码）
04-03 1222
参考      可参考结合depends软件使用   关注 微信公众号搜索"Qt_io_"或"Qt开发者中心"了解更多关于Qt、C++开发知识.。 笔者 - jxd
Source Insight4.0 Style Properties（样式属性）配置
Kernel_Heart的博客
02-06 3509
习惯了Visual Studio的代码编辑套件VASSISTX的代码配色方案，于是将Source Insight4.0的代码配色方案也改成同样的。  配置对应的xml文件内容如下：（背景颜色为浅绿色保护眼睛：RGB 217，238，219） <SourceInsightConfiguration AppVer="4.00.0084" AppVerMinReader="
php的style属性值,jquery设置css样式、style属性 示例
weixin_30020909的博客
03-18 403
css虽然会在一开始我们就定义好了，但是有很多场景需要我们动态设置css，或者单独修改一个dom控件的style属性，今天分享一下我总结的jquery设置css及style样式的方法。一、CSS1、css(name)访问第一个匹配元素的样式属性。返回值 String参数name (String) : 要访问的属性名称示例：$("p").css("color"); //取得第一个段落的color样式...
CSS Font Properties 字体属性
weixin_43501588的博客
11-02 2724
@[字体 Font属性] font：复合属性，设置或检索对象中的文本特性 color：设置对象的文本颜色 font-family：设置用于对象中文本的字体类型 font-size：设置对象中的字体大小 font-style：设置对象中的字体样式 font-weight：设置对象中的文本字体的粗细 text-decoration：设置对象中的文本的装饰，如下划线、闪烁等 text-shadow：设...
Uncaught Error: The `style` prop expects a mapping from style properties to values, not a string
游海东的技术专栏
05-10 5203
1、错误描述 2、错误原因 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="../js/react.development.js"></script> <...
html+jquery+添加样式,jquery设置css样式、style属性 示范
weixin_33346418的博客
06-17 2070
jquery设置css样式、style属性 示例css虽然会在一开始我们就定义好了，但是有很多场景需要我们动态设置css，或者单独修改一个dom控件的style属性，今天分享一下我总结的jquery设置css及style样式的方法。一、CSS1、css(name)访问第一个匹配元素的样式属性。返回值 String参数name (String) : 要访问的属性名称示例：$("p").css("co...
jquery设置css样式、style属性 示例
热门推荐
luyaran的博客
11-14 8万+
css虽然会在一开始我们就定义好了，但是有很多场景需要我们动态设置css，或者单独修改一个dom控件的style属性，今天分享一下我总结的jquery设置css及style样式的方法。 一、CSS 1、css(name) 访问第一个匹配元素的样式属性。 返回值 String 参数 name (String) : 要访问的属性名称 示例： $("p").css("col
jquery设置css样式、style属性 示例（超强解析）
m0_48930261的博客
08-24 1766
jQuery一、CSS1、css(name)2、css(properties)3、css(name,value)二、位置1、offset()2、position()3、scrollTop()4、scrollTop(val)5、scrollLeft()6、scrollLeft(val)三、尺寸1、height()2、height(val)3、width()4、width(val)5、innerHeight()6、innerWidth()7、outerHeight(options)8、outerHeight(o
依赖属性(Dependency Properties)基础
FoolRabbit的专栏
01-13 4662
Windows Presentation Foundation (WPF) 提供了一组服务，这些服务可用于扩展common languageruntime (CLR) 属性的功能。 这些服务通常统称为 WPF 属性系统。 由 WPF 属性系统支持的属性称为依赖项属性。依赖属性是一种可以自己没有值，并能通过使用Binding从数据源获得值的属性(通俗的讲，就是依赖在别的属性上)。   依赖属
CSS Custom Properties 自定义属性
weixin_33717298的博客
04-21 642
2019独角兽企业重金招聘Python工程师标准>>> ...
remove-svg-properties:从 SVG 中删除属性和样式
07-24
从 SVG 中删除属性和样式 安装 使用安装 npm install remove-svg-properties --save 用法 var rsp = require ( ‘remove - svg - properties’ ) ; rsp . remove ( options ) ; 选项 以下值是defaults src : 带...
style-properties:JavaScript库，用于以统一和可用的格式获取有关元素样式属性的信息
05-16
样式属性 JavaScript库，用于使用统一格式的元素的样式属性。 文献资料 样式属性 参数 element 特性 属性的unit 单位，例如px，rgb 属性的value （ | ）的值 output 值和单位的有效字符串表示形式 例子 简单的属性...
vue计算属性+vue中class与style绑定(推荐)
10-15
本文将重点探讨Vue中的两个核心特性：计算属性（Computed Properties）以及如何在模板中绑定类（Class）和样式（Style）。这些特性极大地提升了Vue应用的可维护性和表现力。 ### Vue计算属性 计算属性是Vue中用于...
关于开发语言的一些效率 从堆栈角度理解一部分c java go python
yuezhilangniao的博客
08-09 566
堆和栈是操作系统内存概念，cc++直接用系统堆栈，javago通过内存逃逸分析来确定哪些放到堆栈，python直接用堆，这句话对吗？说说你的理解
C/C++二维数组创建&内存分配
Charles Ren's Tech Blog
08-08 285
data -> [0][1][2][3][4][5][6][7][8][9][10][11] // 连续。适用场景：行列已知，需要整块连续内存，效率高，易与 C API 交互。适用场景：行列都在运行期确定，且每行长度可不同（锯齿数组）。行与行之间内存不连续，缓存命中率低。需要多个 new，释放顺序易出错。
C语言中级_动态内存分配、指针和常量、各种指针类型、指针和数组、函数指针
sz1125218970的博客
08-07 660
动态内存分配是一个重要概念，要和静态数组对比着学习；指针和数组搭配在一起，让指针理解的难度上了一个台阶，尤其是二维数组搭配指针，要获取数组的值，什么时候“取地址”，什么时候“解引用”都需要深刻理解一些概念才能正确使用指针和数组。写这些东西，就是把自己学习的笔记记录下来，供自己日后翻找，若是与此同时能给别人提供些帮助，那就更好了。
Android UI组件系列（十五）：三种常用 Android 弹窗/菜单组件详解：PopupMenu、PopupWindow、ContextMenu
weixin_39339407的博客
08-12 754
在本篇文章中，我们将结合一个简单 Demo，一次性带你搞清楚三种最常用的“菜单与弹窗”组件： PopupMenu：轻量级点击菜单，适合显示系统风格的选项列表； PopupWindow：功能灵活的弹出框，支持自定义布局与样式； ContextMenu：长按触发的上下文菜单，适合为内容项添加额外操作。
让智能体像人一样工作：工具(MCP) × 协作(A2A) × 交互(AG‑UI) 三层协作架构
你必须十分努力，才能看起来毫不费力！
08-12 579
本文提出构建高效Agent系统的三层关键能力框架。工具层（MCP协议）赋予Agent调用工具执行任务的能力，使其从“会说”变为“真能做”；协作层（A2A协议）实现多个Agent间的分工协作，形成数字团队；交互层（AG-UI协议）建立人机沟通桥梁，确保Agent理解用户意图并给予反馈。三者共同构成Agent系统的“基础操作系统”，类比于人类员工所需的工具使用、团队协作和沟通理解能力。这种结构化设计使Agent从孤立工具进化为可管理、会协作、能反馈的数字组织，是Agent系统实现规模化的核心架构。
各版本IDEA体验
最新发布
疯狂的星光的专栏
08-12 242
IntelliJ IDEA版本功能对比：2022.2起可体验新版UI，2019及更早版本Git操作繁琐，2019-2022版本对常用插件支持最佳。2023.1起不再支持gitLabproject2020插件，但UI更流畅。2024.1集成GitLab插件需v14+服务器，禁用插件可切换旧登录方式但无法保存密码。整体趋势是功能增强但内存占用增加。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值