nimotea 发表于 2023-10-11 15:44:00

旋转星空背景实现

本帖最后由 nimotea 于 2023-10-11 15:45 编辑

背景


在某些炫酷大屏场景下,需要使用带动效的星空背景作为大屏背景,以提高看板的整体炫酷深邃感。(gif 比较大,加载较慢)


但是一般这种 gif 图片比较难找,而且如果要做一些定制化改造会比较麻烦,需要使用一些专业制图工具来修改,有没有什么简单的方法呢.

方案


首先可以下载本帖提供的静态html文件 "starBG.html", 这个html使用原生js实现了星空旋转的效果。然后我们需要把这个 html 放置自己的Wyn 安装目录下,以安装地址为 "D:/wyn" 为例,需要找到 "D:/wyn/Server/wwwroot/" 目录,我们需要把 starBG.html 放置到这个目录下。这样当Wyn 启动后,我们就可以使用 http://localhost:51980/starBG.html 来访问html 内容了。


接着,我们需要使用到 Wyn 组件中的 外部扩展组件

然后我们配置 外部扩展的 网络地址为 : http://localhost:51980/starBG.html ,使用 外部扩展作为大屏的背景组件,即能实现旋转星空背景的效果。




注意


① 外部扩展左右上侧的间隔部分可以通过,扩展本身的 标题属性(是否显示),以及外观样式的内外边距属性来控制。
② 在使用外部扩展组件时,一定要先打开启用重叠功能,否则组件本身会顶走其他图表的位置。




结束

gddsb 发表于 2023-10-19 17:13:30

:i0tw::i0tw::i0tw::i0tw::i0tw:

Eden.Sun 发表于 2023-10-19 17:51:07

gddsb 发表于 2023-10-19 17:13


您在使用过程中遇到什么问题,可以发帖解决哦!:jy74a:

ZenosZeng 发表于 2023-12-22 08:33:31

这个效果不错啊。

楼主,能否再提供一版透明背景色的效果。
页: [1]
查看完整版本: 旋转星空背景实现