LCUI 1.3.0 开发日志

2019年07月14日  ·  432 字  ·  阅读

开发计划:

  • 重写圆角边框的渲染算法
  • 重写盒阴影的渲染算法

2019-09-21

已完成内容区裁剪功能。在这之前,如果不裁剪圆角部件的内容区域,子部件内容会溢出到边框外,例如:

widget content overflow

内容区裁剪和圆角的绘制方式差不多,都是用椭圆方程计算边界点然后把圆外像素点填充为透明,裁剪效果如下:

widget content crop

2019-09-14

lcui-quick-start 项目已经完成,效果如下图所示:

LCUI quick start

2019-09-08

圆角边框和阴影渲染已经改造完成。仔细看的话会发现与阴影重叠的圆角边框像是被削弱了 1px 像素,原因是用于圆角边框抗锯齿的像素与阴影的像素重叠,在绘制阴影时会覆盖掉边框像素。这种细节问题懒得继续搞了,暂时搁置,临时解决方案是在使用圆角边框时不使用阴影。

Box shadow

Border

2019-08-15

阴影的圆角处理方式是以像素点到圆心距离来判断是否需要填充像素,而边框的圆角处理方式则是根据当前行像素的 y 轴坐标计算边界点 x 坐标,两种方法的计算结果不一样,实际绘制出来的效果是左侧圆角边框被裁剪掉了 1px,右侧的圆角多出了 1px。

Border

文章版权归作者所有,未经许可不得转载。

问题反馈

对此文章有疑问?你可以点击 这里 反馈