activiti-modeler 流程图修改样式（颜色形状等）

最新推荐文章于 2024-08-31 11:14:17 发布

qq_26618715

最新推荐文章于 2024-08-31 11:14:17 发布

阅读量3.5k

点赞数 2

分类专栏： activiti activiti-modeler 文章标签： angular css

本文链接：https://blog.csdn.net/qq_26618715/article/details/109852912

版权

本文介绍了如何修改activiti-modeler的工作流页面样式，以提升视觉效果。通过编辑stencilset.json文件，可以调整流程图形的大小、颜色、形状等属性。特别是填充颜色(fill)和边框颜色(stroke)，以及利用AI生成SVG获取'd'值。当改变启动项大小时，别忘了调整连线点的位置。完整解决方案参考了CSDN上fgstudent的文章。

摘要由CSDN通过智能技术生成

activiti-modeler 流程图修改样式（颜色形状等）

activiti-modeler很强大，但是原生的UI确实有点不那么好看。为了把工作流的页面展示改得好看些，碰壁了很久，终于找到了修改activiti-modeler 样式的方法。应用的资源很多，页面的大部分样式是通过css修改，但是工作流的样式则需要在另一个文件修改：stencilset.json。
在这里插入图片描述

stencilset.json

这个json里面配置了工作流页面展示的大部分样式，包括大小，颜色，图形，位置等。

{
        "type" : "node",
        "id" : "StartNoneEvent",
        "title" : "启动",
        "description" : "A start event without a specific trigger",
        "view" : "<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"no\"?>\n<svg\n   xmlns=\"http://www.w3.org/2000/svg\"\n   xmlns:oryx=\"http://www.b3mn