1、系统图标使用指南一配置视图图标行按钮和列按钮操作一样,只是显示位置不同,此处拿列按钮示例。不理解的请参考知识库中“行按钮”及“列按钮”说明。平台提供的视图图标库路径:tbp-web-appWebContentstyledefaultimagesicons,需要使用的时候,在 eOMP工具中,视图工具树-视图模型列按钮集合:现已“阅读”按钮为例 通过“添加按钮”按钮新增行按钮,中文处编辑“阅读” ,图标处编辑“icon-view”,再回到表单 URL 中,即可看到刚刚添加的行按钮 。同样,视图需要使用其他图标的时候,只需在目录中找到相应的图标,然后在eOMP 工具中配置图标名,格式为“icon”
2、+“- ” +“图标文件名” (忽略文件名后缀) 。二配置表单按钮平台提供的表单图标库路径:tbp-web-appWebContentstyleuuricons,需要使用的时候,在 eOMP 工具中,表单工具树其他配置按钮配置:现已“删除”按钮为例通过“新增按钮”添加,中文处编辑“删除” ,图标处编辑“icon-add” ,再回到视图 URL 中,即可看到刚刚添加的按钮 。同样,视图需要使用其他图标的时候,只需在目录中找到相应的图标,然后在eOMP 工具中配置图标名,格式为“icon”+“- ”+“图标文件名” (忽略文件名后缀) 。三解决配置好但是无法显示及自定义图标支持不常用的图标可能不支
3、持,导致无法显示,需手动添加。现已 tbp-web-appWebContentstyledefaultimagesiconspencil.png 为例 。1.先配好按钮2. 发现无法显示3.IE 下 F12 进入开发人员工具,选择“单击选择元素” ,并选中刚才的铅笔4.观察开发工具中显示的信息这就是刚才配的按钮图标 右边的样式信息中 icon-css 中并没有包含 icon-pencil,所以才无法显示如果我们点击能显示的“阅读”就能看到 icon.css 中包含的信息5.找到 icon.css。这里找到的是tbp-web-appWebContentstyledefaultcssicon.cs
4、s在其中添加如下代码:.icon-pencilbackground:url('/images/icons/pencil.png') no-repeat !important;这样,清除缓存刷新后,我们要的图标就出来了同理,需要使用自定义图标的话,也是在 icon-css 中添加如下代码:.icon-asdfbackground:url('/images/icons/asdf.xxx') no-repeat !important;icon-asdf 中,asdf 为你需要自定义的图标文件名,例如“map” ,则为 icon-map;url 为你的图标与此 icon
5、-css 文件的相对路径,此处表示该 icon.css 绝对路径下往上一层目录下 imagesicons 下的路径。四常用图标信息1.视图中常用图标icon-add icon-apply icon-attachment icon-back icon-cancleicon-config icon-log icon-folder icon-save icon-wordicon-search-row icon-delete icon-print icon-redo icon-undo2.表单中常用图标icon-add icon-about icon-back icon-btn_down icon-btn_collapseicon-btn_expand icon-btn_left icon-btn_right icon-btn_up icon-deleteicon-butCollapse icon-butExpand icon-doc icon-find icon-folder