KearneyKang 发表于 2020-7-15 15:52:56

JSviewer如何进行主题色的个性化设置

本帖最后由 KearneyKang 于 2021-1-27 18:21 编辑

可能在把AR集成到Web项目中的开发人员,都动过这样的心思,就是如何进行Viewer主题色调的调整,已达到跟原有项目UI的匹配。现在我们就来详细说说如何进行主题色的编辑。
首先我们打开我们的 主题编辑器 这是ActiveReports JS的一个主题编辑器,但是没关系在ActiveReports的JSviewer渲染中这个方法是可以复用的。





颜色、字体成你满足你需要的样式之后,下载对应的CSS文件,点击下载


主题设计器主要分为以下组成元素:

主题
是指针对整个Viewer的主题色调。

颜色
Viewer 的底色

边框
设置边框的圆角

字体类型
设置Viewer的字体样式




设置完成,下载对应的CSS文件,直接添加到项目中,进行一个CSS的引用进行。 (我这里给下载的CSS文件重新命名为my-custom-theme.css)


项目中引用
<link href="Scripts/my-custom-theme.css" rel="stylesheet" />

预览结果:










页: [1]
查看完整版本: JSviewer如何进行主题色的个性化设置