95 Star 478 Fork 76

GVPliu / LCUI

2021-06-01 13:30
568 lc soft 1586692424 liu

问题修复

  • conditional jump or move depends on uninitialised value(s) (7174868)
  • gui: 水平滚动条未起作用 (#219) (31dee24)
  • gui: 当部件的定位为绝对定位时,尺寸计算错误 (35bfa3f)
  • gui: 组件在隐藏后未更新样式 (f0a6e30)
  • image: 图片后缀名检测方式错误 (46095e7)
  • util: 当 dict 的操作函数被编译器内联时会报错 ‘NULL’ 未声明 (c9c9901)
  • 移除错误的 CSSParser_GetRuleParser() 宏 (3bd6b71)
  • LCUI_PostSimpleTask() 中的变量命名冲突 (f0382d4)

新功能

  • font: 添加 TextStyle 的操作函数 (c0ccdf8)
最后提交信息为: chore(release): 2.2.0
2020-07-05 23:13
568 lc soft 1586692424 liu

问题修复

  • wasm-ld: error: duplicate symbol: self (2b0424c)
  • display: rect_array 未被释放 (224c433)
  • gui: 部件销毁后未标记无效区域 (8e1f136)
  • gui: TextView_SetTextW() 段错误 (#195) (a10df88)
  • ime: 设置输入框文本光标时段错误 (0b644e1)
  • linux: 在窗口处于最小尺寸时渲染会出现段错误 (#200) (#201) (fa23f89)
  • mainloop: 将事件触发器从 OpenMP 并行循环中移出以解决主线程阻塞问题 (#204) (#205) (6978f46)

新功能

最后提交信息为: chore(release): v2.1.0
2020-03-03 13:54
568 lc soft 1586692424 liu

问题修复

  • builder: 注释结点应该被忽略 (460ee00)
  • css: 使用了未初始化的值 (44486f1)
  • font: 字体路径获取错误 (#187) (6d54685)
  • font: FontBitmap_Free() 内存泄露 (c47a6c0)
  • gui: 根部件缺少 hover 和 active 状态 (02c03c7)
  • gui: 调整空窗口的尺寸时出现段错误 (#199) (56ce0b5)
  • gui: TextCaret 应该在销毁后移除定时器 (a58b12d)
  • linux: InitLinuxKeybord() 内存泄漏 (61cadc8)
  • timer: 在移除定时器后,其回调依然会被执行 (43233b3)
  • util: dict 类型未正确导出 (20abb19)
  • windows: 未默认启用触控支持 (bc7710a)
  • 纠正变量的使用 (513b3b9)
  • 光标的位置应该在处理部件事件之前更新 (83fc949)

代码重构

  • gui: 添加 widget_background.h (d69fbb0)
  • gui: 添加 widget_border.h (843232e)
  • gui: 添加 widget_shadow.h (08ed51c)
  • gui: 改进部件更新流程 (1a50aec)

新功能

  • builder: 在出错时输出详细内容 (f7ed3b8)
  • css: 添加 flexbox 相关属性解析器 (07d2911)
  • display: 添加 LCUIDisplay_EnablePaintFlashing() (298ffa4)
  • display: 闪烁已渲染的矩形区域 (#180) (#190) (5ad4fec)
  • display: 设置最小屏幕尺寸为 320x240 (317df70)
  • gui: 添加 CSSFontStyle_IsEquals() (80d4149)
  • gui: 添加弹性盒子布局 (3cbb246)
  • gui: 更改部件原型上的 runtask() 方法的参数和调用时机 (f058916)
  • gui: 重写部件布局系统 (24e89aa)
  • gui: 滚动条部件将会在容器销毁后重置 (61e0f2c)
  • gui: 在滚动条可见时设置容器的内间距 (a436f41)
  • gui: unwrap() 将会为没给子部件触发 link 和 unlink 事件 (48344bc)
  • gui: 更新TextView 尺寸变动规则 (ea7e9d2)
  • util: 使用内联函数代替全局变量 (0991d14)

性能改进

  • display: 主窗口尺寸改变后无需添加无效区域 (b0985a2)
  • display: OpenMP 将只在渲染区域较大时启用 (1e57d9d)
  • gui: 改进部件的无效区域收集方式 (e9ea262)
  • gui: 改进 TextEdit 部件的更新流程 (bbb7cbc)
  • gui: 改进 TextView 部件的更新流程 (6824735)
  • 为部件渲染添加 OpenMP 支持 (#118) (#189) (d858333)
  • 改进表面 (Surface) 的无效区域的收集方式 (c81da29)

不兼容变动

  • util: DictType_StringKey and DictType_StringCopyKey 已改用内联函数代替
  • display: 已移除 LCUIDisplay_ShowRectBorder()LCUIDisplay_HideRectBorder()
  • gui: 部件的阴影操作接口已改为私有
  • gui: 部件的背景操作接口已改为私有
  • gui: 部件的边框操作接口已改为私有
  • gui: TextView 部件必须在 UI 线程中操作
  • gui: 部件原型上的 runtask() 方法接受两个参数,并且会在每个任务被处理后调用
  • gui: 一些部件操作接口已重命名或已移除
最后提交信息为: docs: remove duplicate changelog
2019-10-09 12:53
568 lc soft 1586692424 liu

更新日志

问题修复:

  • C++ "operator" 关键字冲突 (5a5ba8c)
  • css: 设置字体样式解析器的 style_handler 后未起作用 (6869683)
  • display: X11Surface_SetCaptionW() 内存泄漏 (484c3d7)
  • font: 当 font_size > 18 时字体位图获取失败 (d6315c5)
  • gui: 部件的默认边框颜色应为透明 (transparent) (5164955)
  • gui: 当部件 pointer-events 为 none 时的事件目标选择问题 (0f26c8b)
  • gui: TextEdit 占位符未起作用 (d827767)
  • gui: mousemove 事件应在 mouseout 事件前触发 (5020b91)
  • gui: 部件属性值应始终有效 (4b0a2ed)
  • ime: 输入法候选词窗口定位问题 (#36, #175) (1107f91)
  • renderer: 部件内容区渲染不正确 (f8b0f8b)
  • util: Object_Operate() 中的对象类型判断不正确 (a326e8c)
  • util: ParseUrl() 解析结果不正确 (3f9450c)

新功能:

  • 添加 LCUI_GetVersion() (de40c7c)
  • 添加圆角边框渲染,改进盒阴影渲染 (#174) (f36d071)
  • 添加 include/LCUI.h 文件 (#173) (113af6a)
  • builder: 标签名称可以是一个已存在的部件类型名称 (4f6a01c)
  • css: 将 CSSFontStyle_* 系列函数改为公共函数 (568c915)
  • graph: 添加 LCUI_OverPixel() (d8075d9)
  • gui: 添加 canvas 部件 (e246843)
  • gui: 添加 Widget_CollectReferences() (811585b)
  • gui: 添加 Widget_Each() (2d7d1ee)
  • logger: 支持设置日志等级 (173b92f)
  • scrollbar: 从容器捕获 touch 和 mousewheel 事件 (f2f9162)

新的体验方式

想体验 LCUI 但又觉得编译太麻烦?试试下面这几种新的方式:

  1. 使用 LCUI 的标准开发工具 lcui-cli

    # 安装 lcui-cli
    npm install -g @lcui/cli
    
    # 创建一个名为 myapp 的 LCUI 项目
    lcui create myapp
    
    # 进入项目目录
    cd myapp
    
    # 运行这个项目
    npm run start
    
  2. 克隆并运行示例项目 lc-ui/lcui-quick-start

    # 克隆示例代码库
    git clone https://gitee.com/lc-ui/lcui-quick-start
    
    # 进入代码库
    cd lcui-quick-start
    
    # 安装 NodeJS 依赖包
    npm install
    
    # 安装适用于 x64 CPU 架构的 C/C++ 依赖库
    lcpkg install --arch x64
    
    # 以调试模式运行应用程序
    lcpkg run start --mode debug
    
  3. 使用 lckg 包管理工具:

    # 初始化 lcpkg 配置文件,告诉 lcpkg 你的项目相关信息
    lcpkg init
    
    # 从 GitHub 下载安装已编译好的 LCUI 库
    lcpkg install github.com/lc-soft/LCUI
    

注意: 这些工具是使用 JavaScript 语言编写的,在使用前请先安装 Node.js

圆角边框

在这之前,由于复杂度和时间成本的关系一直没有实现圆角边框,但这么搁置下去也不是办法,一个图形界面开发库连个圆角边框都无法实现的话那也太水了。直到最近,组件库的新组件需要圆角效果才决定把这个功能列入了开发计划。以下是现在的测试效果图:

输入图片说明

输入图片说明

现在的绘制算法还不是最优解,但作者已经被这个功能折腾得不想再继续改进下去了,感兴趣的可以试试优化它,让作者感受一下图形绘制算法的真正魅力。

Canvas 部件

Canvas 部件用于简化自定义图形的绘制流程,具体用法可参考 LC Design 的 Spinner 组件。现在只能当作帧缓存使用,所有绘制操作都需要手动编码实现,如果你希望有丰富的图形 API,可以等待熟悉 cario、skia、OpenGL 等图形库的贡献者贡献相关代码,简单的做法是将图形库的绘制对象转换成 LCUI 使用的图形对象,而复杂点的方法是参考 HTML 5 Canvas API 文档,基于其中一个图形库封装一套 C 语言版本的 API。

最后提交信息为: docs: update CHANGELOG.md
预览版本
2019-06-18 12:22
568 lc soft 1586692424 liu

更新日志

问题修复

新功能

  • gui: 为部件原型设置默认方法 (e68e8e5)
  • gui: 添加 TextEdit_BindProperty() (c9d8ded)
  • gui: 添加 Widget_BindProperty() (0d3fb68)
  • gui: 添加 Widget_SetStyleString() (5163363)
  • gui: 添加 Widget_SetText() (02714bf)
  • textedit: 添加 TextEdit_GetProperty() (512706e)
  • util: 添加对象包装和操作集 (241c652)
  • util: 添加 Object_ToString() (13465c7)
最后提交信息为: build: 1.2.0-beta version
预览版本
2019-03-10 18:05
568 lc soft 1586692424 liu

问题修复

  • builder: 在追加部件前应该将其初始化 (f12e00b)
  • gui: focus 事件和 "focusable" 属性解析问题 (d9a39a5)
  • gui: 当 pointer-events 为 none 时应该忽略鼠标事件 (fc54a64)
  • gui: TextEdit 应该在失去焦点后重置光标的位置 (8de4e71)
  • gui: TextEdit_SetTextW() 未清空之前的内容 (51eef68)
  • gui: Button 的高度与 TextEdit 不一致 (5a918da)
  • gui: 设置部件外边距时会导致宽度计算错误 (#167) (d14023e)
  • thread: LCUIThread_Join() 未等待线程退出 (4ddb833)
  • util: 解码后的字符串长度不应将结束符计算在内 (93f3d77)
  • worker: 运行任务时不应阻塞任务队列 (2b41f54)

新功能

  • gui: 添加支持自定义部件更新规则 (bdd1d1c)
  • gui: 添加支持限制最大的子部件渲染数量 (ec5e0d6)
  • gui: 添加 only_on_visible 规则,用于允许仅在部件可见时更新它 (93049c4)
  • gui: 添加 cache_children_style 规则,用于缓存子部件样式 (50cc6b2)
  • gui: 添加 first_update_visible_children 规则,用于优先更新可见的子部件 (4cd6fdc)
  • gui: 添加部件边框样式相关操作接口 (e8d52df)
  • gui: 添加 Widget_GetClosest() (e740138)
  • gui: 添加 Widget_SetHashList() (f466dee)
  • gui: 自动为事件名生成 id (fee31b0)
  • gui: Widget_SetAttribute() 将会调用 proto->setattr() (19992d1)
  • textview: 添加 TextView_SetColor() (3a7b53f)
  • util: 为 LCUIRect_ValidateArea() 添加返回值 (2fa6cf3)
  • util: 添加 strhash() (ebf843f)
  • util: 添加 strpool (c843df1)
  • util: 添加 strreplace() (409395d)
  • util: 在 Windows 上默认使用 OutputDebugString() 输出日志 (79ec21b)

性能改进

  • css: 更改样式表存储结构以减少内存占用 (9cc2957)
  • css: 减少重复的 DictType 内存分配 (01fd3f6)
  • gui: 改进部件销毁性能 (87aff87)
  • gui: 改进 Widget_Empty() 性能 (1654963)
  • gui: 减少部件的样式表的内存占用 (3790fbd)
  • gui: 移除 TextView 部件中的互斥锁 (6340d60)
  • gui: 使用 strlist 保存 classes 和 status (f611936)
  • gui: 更新部件列表的排序方法 (e9dbcea)
  • gui: 改用 LCUI_STYPE_INT 代替 LCUI_STYPE_VALUE (23090eb)
  • renderer: 改进渲染目标的选择方法 (1df08b6)
最后提交信息为: chore: update version
预览版本
2018-11-29 12:22
568 lc soft 1586692424 liu

问题修复

  • dirent: LCUI_ReadDirW() UNINITIALIZED READ (dd610ad)
  • display: 调整窗口尺寸时会暂停渲染 (#164) (8ad667a)
  • display: 一帧内有过多的重复的脏矩形 (b5d9040)
  • font: 在加载完字体文件后设置默认字体会失败 (9b4c005)
  • font: 在模块被重新初始化后,字体编号未重置 (d75b4ca)
  • gui: 当部件的显示角色改变后应该更新布局 (96c1cef)
  • gui: 当模块被销毁时应该清空废弃的部件 (1ad6be1)
  • gui: 块级元素的默认宽度应该为 100% (adcb9e7)
  • gui: 在销毁部件前应该解除结点 (3249490)
  • gui: unlink 事件被重复触发 (89faa5d)
  • gui: 部件背景图未渲染 (e76f3f9)
  • gui: Widget_AutoSize() 不应该改变静态的宽度或高度 (8bee9c2)
  • ime: 无法正确识别非 qwerty 键盘布局的按键输入 (#147) (4b1f050)
  • layout: "left: auto" 被计算为 "left: 0" (f4990da)
  • platform: linux 帧缓存驱动未被销毁 (#157) (87f79f0)
  • renderer: 当部件整体透明时,子级部件未正确渲染 (#160) (d13b554)
  • renderer: 有透明效果的部件,渲染不正确 (6668165)
  • textlayer: 中文文本断行错误 (1e5a262)
  • textlayer: isalpha() 断言失败 (cd39a46)
  • textview: 在改变 "content" 属性后没有效果 (d1ab50d)
  • textview: 设置文本后未更新自身尺寸 (31e0582)
  • util: LCUI_DirEntry::name 的值不正确 (367febe)
  • worker: 工作线程内存访问越界 (5a7e2c0)
  • 当不支持 jpeg 和 png 时连接器会报错 (2bbabe1)
  • PACKAGE_VERSION 未定义 (70660de)
  • 当系统中存在窗口管理系统时应该隐藏鼠标指针 (acf9454)
  • LCUI_GetAppId() 返回值不正确 (46ec607)
  • 在 FreeBSD 上编译时,"linux/input.h" 文件不存在 (7d95f3f)
  • 在 FreeBSD 上编译时,ENODATA 未定义 (2cd0b27)
  • 未解析的外部符号 _Graph_IsValid (1328a2d)

新特性

  • builder: <resource> 支持加载 xml 文件 (d5e162c)
  • display: 自动禁用窗口最大化按钮 (#164) (82fad1b)
  • event: 添加 ctrl_key 和 shift_key 成员至 LCUI_KeyboardEvent (6f5f17c)
  • gui: 添加 Widget_SetOpacity() (e6ad163)
  • gui: 添加 Widget_SetVisibility() (145d9ee)
  • gui: 添加 Widget_SetVisible() 和 Widget_SetHidden() (2f581b8)
  • gui: LCUIWidget_ClearTrash() 返回值为实际销毁的部件数量 (6262f20)
  • linux: 为 x11 系统添加鼠标滚轮事件处理 (#54) (1061592)
  • linux: 使用 fontconfig 定位字体文件路径 (2932246)
  • textview: 在加载新的字体文件后刷新所有 textview 部件 (3fcfa99)
  • util: 添加 OpenUri() (ec20c99)
  • 添加 LCUI_MAX_FRAMES_PER_SEC 宏定义 (6fa2995)
  • 添加 LCUI_MAX_FRAME_MSEC 宏定义 (7abc901)

改进

  • charset: 改进 utf-8 和 unicode 字符串转换 (1efd856)
  • graph: 添加新的图片缩放方式 (issue #39) (bbfb9af)
最后提交信息为: style: update file encoding
预览版本
2018-05-08 12:37
568 lc soft 1586692424 liu

更新日志

问题修复

  • font: 因字体缓存位置计算错误而导致的 DeleteFont() 段错误 (5465c6b)
  • timer: 定时器线程在被创建后可能会立刻退出 (0b01f88)
  • util: 在 Unix 系统下编译会报错:'struct dirent' has no member named 'd_reclen' (#141) (0416c42)

新特性

  • platform: 添加 linux 平台的帧缓存(FrameBuffer)驱动 (6015838)
  • platform: 添加 linux 平台的键盘驱动 (ad3348e)
  • platform: 添加 linux 平台的鼠标驱动 (0ff7b70)

其它改动

  • 更改代码风格
  • 添加 .clang-format 配置文件
  • 为部分待改进的代码添加 FIXME 注释

发行说明

本次更新主要添加了对 Linux 的帧缓存(FrameBuffer)的支持,在没有 Xwindow 服务支持的字符终端模式下,LCUI 会改用 Linux 的帧缓存来输出图形内容,并直接从鼠标设备(/dev/input/mice)和标准输入(stdin)中读取用户输入。不过,这些支持并不完善,而作者也没有打算继续完善这块功能,理由很简单:没什么用,懒得浪费时间。如果你有丰富的 Linux 开发经验,可以向此项目提供改进方案,与其他人分享你的技术。

LCUI 的源代码中还有很多待改进的代码,包括:打算改、没时间改、懒得改和不想改的代码,其中有一部分代码已经用 FIXME 注释标记,这些注释中有的会说明为什么改进它,以及怎么改进它,如果你感兴趣,可以留意源代码中的 FIXME 注释内容,或者直接搜索 FIXME 注释,看看有哪些是可以帮上忙的。

fixme

更新日志中只列出了主要的改动,如需了解更多细节,请自行查看代码提交记录,或许以下命令会对你有所帮助。

# 只查看包含新特性(Feature)的提交信息
$ git log --pretty=format:"%h %ad %s %d" --date=short --grep "^feat"

ad3348ea 2018-04-22 feat(platform): add linux keyboard driver
0ff7b70e 2018-04-22 feat(platform): add linux mouse driver
6015838d 2018-04-22 feat(platform): add linux framebuffer driver
8c1d1056 2018-02-20 feat(widget-event): add "link" event, rename "remove" event to "unlink"
f032f6ff 2018-02-20 feat(timer): add LCUITimer_SetTimeout() and LCUITimer_SetInterval()
30de5b82 2018-02-11 feat(css): add parsing support for "border-left: 0;"
9193c0a5 2018-01-19 feat(textview): add word-break property support
cb7749d3 2018-01-16 feat(widget): add "disabled" attribute processing
7aaac407 2018-01-14 feat(widget): add `http://` and `file:` url support for anchor widget
9532d89a 2018-01-14 feat(widget): allow multiple widgets to have the same id
0616d855 2018-01-13 feat(mainloop): set mainloop to processing only one task  per frame
adc8ba30 2018-01-07 feat(textlayer): add i tag support (#115)
# 只查看包含功能代码改动的提交信息(包括新功能、修复、重构、改进)
$ git log --pretty=format:"%h %ad %s %d" --date=short --grep "^\(feat\|fix\|refactor\|perf\)"

3a888110 2018-05-05 refactor(display): change to right type
b00139bc 2018-05-05 refactor: rename is_inited and is_working to active
090d1c40 2018-05-05 refactor: rename COLOR_TYPE_* to LCUI_COLOR_TYPE_*
de3bb33e 2018-05-05 refactor(graph): rename some functions
b113cf21 2018-04-23 refactor: SVT_* -> LCUI_STYPE_*
cb3c2a89 2018-04-23 refactor(input): LCUIKEY_* -> LCUI_KEY_*
4bf3f91f 2018-04-23 refactor(display): LCDM_* -> LCUI_DMODE, DET_* -> LCUI_DEVENT_*
0b01f88f 2018-04-22 fix(timer): timer thread may quit after it is created
5465c6bc 2018-04-17 fix(font): segmentation fault in DeleteFont()
78eeca61 2018-04-17 refactor(ime): add LCUIIME_ToUpperCase()
2538d79b 2018-04-15 refactor(platform): update ime selection in the linux
ad3348ea 2018-04-22 feat(platform): add linux keyboard driver
0ff7b70e 2018-04-22 feat(platform): add linux mouse driver
6015838d 2018-04-22 feat(platform): add linux framebuffer driver
eb04b2c3 2018-04-07 refactor(cursor): add LCUICursor_Paint(), remove unused code
0416c421 2018-03-27 fix(util): 'struct dirent' has no member named 'd_reclen' (#141)
7d577b0b 2018-03-13 refactor(textlayer): add "LCUI_" prefix for some type names
最后提交信息为: chore: v1.0.0-beta.3
预览版本
2018-03-19 22:34
568 lc soft 1586692424 liu

问题修复

  • 一些内存泄露问题 (#135) (9995b23)
  • gui: 部件大小计算错误 (095f4b8)
  • renderer: 部件内容区域计算错误 (#122,#123) (0f81863)
  • renderer: 部件内容溢出 (#144) (2a923a6)
  • thread: 线程在退出后未释放之前申请的内存资源 (402bc03)
  • widget: 滚动条未取消事件冒泡 (#145) (7dd60ac)
  • widget: Scrollbar_BindBox() 在滚动条初始化后未能正常工作 (196f47c)
  • widget: Widget_GetOffset() 返回的结果未包含内间距 (0a893f4)
  • widget-event: 部件触控事件中的触点坐标未根据全局缩放比例进行转换 (a40eda2)
  • worker: 工作线程获取新任务前未进入阻塞状态 (#134) (8dae96f)

新特性

  • css: 添加支持解析 "border-left: 0;" (30de5b8)
  • timer: 添加更具语义的 LCUITimer_SetTimeout() 和 LCUITimer_SetInterval() (f032f6f)
  • widget-event: 添加 "link" 事件, 重命名 "remove" 事件为 "unlink" (8c1d105)

改进

  • widget: 重命名滚动条的属性名称和 CSS 选择符 (d397914)
预览版本
2018-02-07 10:37
568 lc soft 1586692424 liu

新特性

  • font: 添加支持按字重(font-weight)和风格(font-style)选择字体
  • textlayer: 添加 [bgcolor] 标签支持,用于设置文本背景色 (#110)
  • textlayer: 添加 [i] 标签支持,用于设置文本为斜体 (#115)
  • textlayer: 添加 [b] 标签支持,用于设置文本为粗体 (#112)
  • textlayer: 使用 FreeType 字体引擎默认的方式获取空格宽度
  • widget: 为 textview 添加内容修剪支持,启用后会去除文本首尾空白符 (#97)
  • widget: 添加锚点(anchor)组件 (#105)
  • widget: 为 textview 添加 word-break 属性支持,用于设置单词断行方式 (#71)
  • widget: 添加 WTT_RESIZE_WITH_SURFACE 任务类型,用于将表面(surface)大小与部件同步 (#104)
  • widget: 添加 Widget_UnbindEventByHandlerId() 函数,用于根据事件处理器标识号取消事件绑定
  • css: 添加 font-face 规则解析器,可用于在 css 代码中定义字体信息 (#95)
  • css: 为 url() 的解析器添加支持处理相对路径 (#98)
  • css: 添加针对 justify-content 的属性解析器 (#117)
  • css: 为 border 的属性解析器添加支持解析 "border: 0"
  • css: 为 line-height 的属性解析器添加支持解析 "line-height: 1"
  • layout: 添加简单的 flex 显示方式和 justify-content 属性支持 (#117)
  • bulder:<widget> 添加短名称 <w> (#103)
  • core: 添加 LCUIWorker 用于处理异步任务 (#106)

问题修复

  • textlayer: 文本没有垂直居中对齐 (#100)
  • widget: textview 的高度计算错误 (#111)
  • css: 样式表选取问题,同名选择器会共用同一优先级 (#113)
  • graphic: Graph_FillRectARGB() 段错误 (#110)
  • linux: 设置 "--enable-video-ouput=no" 选项后会导致链接器报错
  • renderer: 部件位置为非整数时,在渲染时边框会时有时无 (#108)

改进

  • layout: 改进部件尺寸计算
  • layout: 改进块(block)和内联块(inline-block)元素的布局处理
  • font: 改进字体数据的存储和操作方式
  • mainloop: 设置每帧运行任务队列中的所有任务
  • mainloop: 设置每帧至少更新一次部件树

如需了解更多代码变更细节,请查看此次拉取请求,包含 121 次提交,净增 3.8K 行代码。当前版本还存在已知且未修复的问题,你可以在问题列表里找到它们。

布局

居中和靠右是比较常用的对齐方式,比如对话框中的按钮组:

lcui-modal

之前版本中如果要实现这种效果,需要修改定位方式和右间距:position: absolute; right: 0;,一个按钮还好,多个按钮就得靠包装一个容器来定位,而且父级元素的宽高不会被撑开,始终为 0。为此,添加了简单的弹性(flex)布局支持,配合 justify-content 属性可以设置子级元素的对齐方式。justify-content 属性值有三种:flex-start、center 和 flex-end,效果是将每一行元素向左对齐、居中对齐、向右对齐。

lcui-flex-layout

字体

之前的版本只能根据字族(font-family)名称选择一种字体,即使这个字族包含不同粗细程度、风格的字体也只会选择常规(Regular)字体,连给界面中的标题加粗都很麻烦。为此,改进了字体数据的存储和操作方式,添加支持按字重(font-weight)和风格(font-style)选择字体,CSS 解析器也添加了相关的解析支持。

由于大多数字体都不会包含所有粗细程度和风格的字形,所以会存在找不到的情况,而本次更新的版本只是改进了存储和访问方式,并未实现字形自动加粗和倾斜功能,为解决这个问题就添加了一个回退机制,回退机制的设计参考自 MDN 文档,如需了解具体规则可查看此文档内容。

文本渲染

既然字体已经支持使用粗体和斜体,那么文本层(TextLayer)也就顺势加上了 [i][b] 标签的支持,方便测试字体效果。有了 color、i、b 这几个标签,界面中的代码块也就能加点特效:

lcui-code-highlight

考虑到文本中会引用命令行和代码,为了凸显这些文本,需要能够设置背景色,于是就添加了 [bgcolor] 标签支持,比如内容为 [bgcolor=#ddeeff]make install[bgcolor] 的文本,渲染效果会是这样:

lcui-text-bgcolor

对于英文文本,如果在换行时直接截断单词则会影响阅读体验,需要将溢出的单词整个换到下一行显示,控制这个规则的属性是 word-break,默认值为 normal,不中断单词,当值为 break-all 时会在任意字符间断行。

lcui-text-word-break

CSS

一篇文档会需要用到各种字体来提升阅读体验,比如:等宽字体、中文字体、西文字体,用 LCUI 呈现这样的文档的话会有些麻烦,需要手动在 XML 或 C 代码中引入这些字体文件,而作者在为 LCUI 开发 CSS 组件库时也遇到同样的问题,如果能在 CSS 中预先定义好各种字体的信息就能够省去这些麻烦。

CSS 标准中的 @font-face 规则可以解决这个问题,于是 LCUI 就增加了对 @font-face 规则的解析支持,方便通过 CSS 代码来控制加载哪些字体。@font-face 能够定义包括字族、风格、粗细程度、文件路径等在内的字体信息,然而这些属性中只有文件路径有用,在解析完规则后会直接加载该文件路径里的字体文件,因为 LCUI 的字体管理还不支持预先声明字体信息和按需加载字体文件这两个功能。

部件

添加了锚点(Anchor)部件,功能与 HTML 中的 <a> 元素类似,支持 href、target、key 属性,当该部件被点击后会判断 href 内容,如果是 https://http://file: 类型的链接,则调用系统默认的打开方式打开它;如果是普通的文件路径则会将之视为 xml 文件载入它,载入成功后会将新元素追加至 target 指定的 id 的元素内。简而言之,可以靠该部件实现“点击按钮切换界面”的功能。

lcui-anchor-widget

版本迭代

代码库的 Git 提交信息格式已经采用 Angular 提交信息规范 进行规范,方便为以后的版本收集改动内容。

版本号一直停留在 1.0.0 会浪费版本号的价值,但到目前为止,LCUI 内部函数命名还不够稳定,在后续版本更新中有可能会更名和移除,如果你有丰富的接口命名和模块化设计经验,可以向 LCUI 提交你的改进方案,以让 LCUI 尽早发布 1.0.0 版本。

预览版本
2017-07-11 11:45
568 lc soft 1586692424 liu
  • 调整代码结构
  • 改进 TextView 部件
  • 改进 TextEdit 部件的光标定位与文本渲染
  • 改进部件的盒形阴影(box-shadow)绘制
  • 添加适用于 UWP 应用的驱动支持,示例应用代码在这里
  • 改进对高分屏的支持
    • 添加 dp、sp 度量单位,功能与 Android 中的同名单位相似
    • 添加缩放支持,可根据屏幕像素密度设置合适的缩放比例
  • 完善自动化构建和测试
    • 添加单元测试
    • 添加代码覆盖率测试
    • 引入 valgrind 内存检查工具
  • 解决所有内存泄露和内存访问越界问题
  • 解决部件布局功能中存在的一些问题
  • 解决 jpeg 图像读取器有时会读取失败的问题
  • 其它已知 BUG 修复

如需了解更多代码变更细节,请查看此次拉取请求,包含 88 次代码提交,涉及 174 个文件,净增 6K+ 行代码。

UWP 的支持

这个版本已经引入 UWP 应用的驱动支持,基于 DirectX 11,封装了 UWP C++ 接口调用代码,源代码参考自 Visual Studio 提供的 DirectX 11 示例应用(通用 Windows),你可以在 src/platform/windows 目录下找到实现代码,示例应用代码在 build/windows/LCUIApp/App.cpp,编译生成 LCUIApp 项目即可查看运行效果。

2017-07-02-17-22

该驱动代码单独放在 LCUIUWPApp 项目中,编译生成的是动态库(dll),需要与 LCUIUWP 项目一起使用。由于该项目只是做了简单的封装,没有对灵活性和扩展性做过多的考虑,因此,如果你有其它需求(例如在应用挂起、恢复时做一些操作),请手动修改该项目的代码。

对高分屏的适应

如今高分屏在手机和笔记本上日渐普及,作为一个图形界面开发库,如果还停留在以像素(px)为单位设置界面元素的位置和大小的话,那么在各种分辨率下的视觉体验会惨不忍睹,因此,LCUI 在此次版本更新中添加了高分屏适配方案,原理很简单,让界面元素支持比例缩放,这样就能够根据屏幕像素密度以合适的缩放比例呈现界面内容。

test-scaling-support

除此之外,还添加了 dp 和 sp 度量单位,这两个度量单位参考自 Android,效果大致一样,相信 Android 程序员们对其最为熟悉,此处就不做详细说明了。

注:目前 LCUI 并不支持自动检测 dpi 来设置缩放比例,你需要手动设置缩放比例,这个问题会在后续版本中解决。

自动化构建和测试

在以往的版本中,每次代码改动都有可能影响到正常功能,遇到这种情况只能人工手动运行程序来检查各项功能是否运作正常,既麻烦又浪费时间。在此次版本更新后这个情况会有所改善,部分主要功能模块已经有了对应的单元测试,在每次更新代码后,可以方便的根据自动化构建和测试结果来得知是否存在新 BUG。

auto-building-and-testing

有时一两处存在内存越界的代码可能不会影响到正常的运行结果,一旦数量多起来的时候就很容易让程序崩溃,更为奇特的是程序并不是固定在某个情况下崩溃的。为确保单元测试能够得到正常的结果,LCUI 引入了 valgrind 内存检查工具,并将内存检查结果作为测试是否通过的条件之一,以前堆积的内存访问越界和内存泄漏问题在这个版本中已经全部解决。

商业许可

和其它 GPL 软件的套路一样,LCUI 添加了收费的商业授权许可,允许闭源商用,附带一点点技术支持服务。当然,这主要是为以后的可持续发展做些准备,现阶段并不指望有多少人会用。商业授权的收费并不贵,可能还不及某些实习生的半个月工资,你可以当作是聘用了个实习生花了几天时间写的界面库。

CSS 框架

手写 CSS 代码和调整界面布局终究是一件麻烦的事情,就像 Web 前端程序员不用现成的 CSS 框架写网站一样,除了业务逻辑还要浪费时间写 CSS 代码调整页面效果。作者计划为此开发一个新的项目,包含 CSS 框架、常用界面组件、国际化支持(i18n)等,如果你是 Web 前端大佬,踩过一些坑,用过一些主流的 CSS 框架,可以在这里与作者交流心得体会,包括但不仅限于:工程目录划分、CSS 代码命名、编码规范、SCSS 技巧、界面配色及视觉效果这类内容。

贡献

相信很多人已经习惯看到那些活跃的开源项目,即使自己什么都不用做,它也能积极的发展下去,然而 LCUI 并不是那种有强大社区力量或雄厚资金支持的开源项目,所以,如果你有什么需求,请先阅读以下内容。

  • 遇到问题时请尽量花时间自己独立解决,实在无法解决的话,请再花些时间准备好详细的问题描述,然后按照下面给出的方法提交问题。
  • 普通的使用问题,请在开源中国社区(问答板块)SegmentFaultStackoverflow 上提交问题并 @ 作者,这样作者在帮助你解决问题后至少能赚点积分/声望值,还能让搜索引擎多收录一条 LCUI 相关的内容,帮助其他遇到类似问题的人们。
  • BUG、新功能建议、代码改进建议等核心开发相关的问题请提交至 GitHub 的 Issues 页面中。虽然作者英语比较渣,但还是建议你使用英语撰写内容,就当是一起学习英语吧。
  • 如果你想提交自己的代码改进方案,请先向作者确认这个方案是否符合要求,确认之后再开始编写代码,务必遵循现有代码风格。在代码完成后,请提交拉取请求(Pull Request),让作者决定是否拉取你的分支里的代码并合并至主分支,必要的话请补充单元测试。
  • 文档相关问题、需求及改进建议,请提交至 LCUI-Guide 项目里。
最后提交信息为: Add v1.0-alpha2 changelog
预览版本
2017-04-18 14:02
568 lc soft 1586692424 liu

由于本次更新改动很大,所以版本号从 1.0 开始,主要更新内容如下:

  • 改进 bmp、jpeg、png 图片的读取接口
  • 添加滚动条(Scrollbar)部件
  • 改进按钮(Button)部件
  • 改进文本显示(TextView)部件
  • 改进文本编辑(TextEdit)部件
  • 改进部件的类型、事件、布局及样式处理
  • 改进图形界面的性能
  • 添加触控支持
  • 添加 CSS 和 XML 支持
  • 移除 Linux 的帧缓冲(FrameBuffer)支持
  • 添加对 Linux 的 XWindow 的支持
  • 添加对 Windows 通用应用平台(UWP)的简单支持
  • 改进对 Windows 的支持
  • 添加部分文档
  • 修复部分已知BUG

原计划在此版本中添加缩放功能,用于适应各种分辨率的屏幕,但由于涉及到的地方比较多,所以该特性已经推迟到后续的版本中。

以下将针对几个主要改动做些简单的说明,如需要体验具体效果可以下载 LCUI 的功能旗舰级应用: LC's Finder

XML 和 CSS

本次比较大的改动是加入了对 XML 和 CSS 支持,为此 LCUI 的部件布局和样式处理也做了些整改,基本算是重写了一遍。相信写过图形界面应用的程序员们都会有这样的体验,只用编程语言来描述界面内容是一件很麻烦的事情,写了一坨代码却只是实现一些简单的布局和效果,可读性差且不易维护。XML 和 CSS 能够解决这种问题,界面的布局和结构可以用 XML 描述,目前支持的标签很少,书写起来会比较简单,就像下面这样。

<?xml version="1.0" encoding="UTF-8" ?>
<lcui-app>
  <resource type="text/css" src="helloworld.css"/>
  <resource type="application/font-ttf" src="C:/Windows/Fonts/comic.ttf"/>
  <ui>
    <widget id="text-hello" type="textview" class="text-hello">Hello, World!</widget>
    <widget id="edit" type="textedit">Hello, World!</widget>
    <widget id="btn-ok" type="button">Submit</widget>
  </ui>
</lcui-app>

至于 CSS,你可以用它来描述界面元素的视觉效果,受限于现有条件,目前只支持简单的 CSS 样式,并且某些 CSS 样式的实际效果会根据 LCUI 的现有情况做一定的调整,属于定制版的 CSS。除了一些简单的样式外,你还可以靠 CSS 来使用图标字体,例如: FontAwesomeMaterial Design Icons,当然,这些图标字体附带的 CSS 文件并不能直接在 LCUI 中使用,需要做些修改,具体可以参考这篇文章

对于比较复杂的界面,CSS 代码也会比较多,如果觉得这堆 CSS 代码写起来很麻烦,可以试试使用 sasslessstylus 这类 CSS 预处理器来简化编码,就像下面这样。

build-app-with-css

当 CSS 代码比较多的时候,会很容易出现样式污染问题,在没有浏览器自带的开发人员工具情况下,这个问题处理起来会比较麻烦,但也不是没有办法,LCUI 提供了 Widget_PrintStyleSheets() 函数,可以打印出指定部件应用到的所有样式表内容,结果类似于下面这样。

selector(1612994007) stylesheets begin

[helloworld.css][rank: 11]
textview.text-hello {
	margin-top: 25px;
	margin-right: 25px;
	margin-bottom: 25px;
	margin-left: 25px;
	padding-top: 25px;
	padding-right: 25px;
	padding-bottom: 25px;
	padding-left: 25px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #000000;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #000000;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #000000;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #000000;
	background-color: #fafafa;
	color: #8cc63f;
	font-family (+): "Comic Sans MS";
	font-size (+): 18px;
	text-align (+): center;
}

[<none>][rank: 1]
* {
	position: static;
	display: block;
	width: auto;
	height: auto;
	此处省略部分内容 ...
	background-color: rgba(255,255,255,0);
}
[selector(1612994007) final stylesheet] {
	此处省略部分内容 ...
}
selector(1612994007) stylesheets end

UWP 支持

此版本虽然支持编译成 Windows 通用库/运行时组件,但并未包含 UWP 版的消息循环、键盘、鼠标、触控和图形输出的支持代码,这块的代码目前还在 LC's Finder 项目内,如有需要可以套用该项目的相关代码,后续版本会将这块的代码整理进来。

最后提交信息为: RegisterClass -> RegisterClassW
C
1
https://gitee.com/lc-soft/LCUI.git
git@gitee.com:lc-soft/LCUI.git
lc-soft
LCUI
LCUI

搜索帮助