反馈已提交

网络繁忙

修改单元格字体接口

  • 文档创建者：RosieY
  • 历史版本：5
  • 最近更新：RosieY 于 2023-01-06

    • 版本

    版本功能变动
    11.0

    和 10.0 区别：

    新增 addEffect 接口

    11.0.7移动端， APP\H5 版本 11.0.70 及以后支持该接口。

    addEffect

    方法addEffect(type, opts)

    鼠标点击或者悬浮时，单元格或所在行字体变化

         参数

    type: string,

    opts: {

    style: {
    bold: boolean，
    italic: boolean，
    fontFamily: string，
    strikeThrough: boolean，
    fontSize: number，
    subscript: boolean，
    underLine: {
    style: string，
    color: number
    }，
    textShadow: boolean，
    supscript: boolean，
    color: number
    }，

    trigger: string，

    single: boolean

    }

    type：变化范围，字符串

    • setCellFont：鼠标点击/悬浮时单元格字体变化

    • setRowFont：鼠标点击/悬浮时单元格所在行字体变化

    opts：变化属性，json 格式

    1）style: 字体格式，json 格式

    • bold: 是否加粗，true 加粗，false 正常

    • italic: 是否斜体，true 斜体，false 正常

    • fontFamily: 字体，字符串

    • strikeThrough：是否有删除线，true  有，false 无

    • fontSize: 字号，数字

    • subscript: 是否靠上显示，true 是，false 否

    • underLine: 下划线样式，json 格式

              style: 线型，字符串，solid 实线 ，dashed 虚线

              color: number 颜色，十六进制颜色代码

    • textShadow: 文字是否有阴影效果，true 是，false 否

    • supscript: 是否靠下显示，true 是，false 否

    • color: number 字体颜色，十六进制颜色代码

    2）trigger: 鼠标的操作，不写时默认为鼠标悬浮

    • mouseover ：鼠标悬浮

    • mousedown：鼠标点击

    3）single：恢复逻辑，布尔型，默认 true

    • true：鼠标点击/悬浮其他位置时恢复

    • false：鼠标再次点击/悬浮此位置时恢复

       返回值void
         示例

    见示例章节

      应用示例

    鼠标悬浮单元格时，字体显示为红色加粗 14 号，离开时恢复：

    更多示例见示例章节。

    2021-09-10_16-06-01.gif

       移动端APP\H5 版本 11.0.70 及以后支持该接口。

    以下内容为接口示例，分单元格字体变化、单元格所在行字体变化，分别对应 type 参数的两个值。

    单元格字体变化

    addEffect 第一个参数 type 值为 setCellFont 时，鼠标点击或者悬浮单元格，单元格字体格式变化。

    代码示例

    示例1：若获取到的报表块对象定义为 report ，鼠标悬浮时字体显示为红色加粗 14 号，离开时恢复

    report.addEffect('setCellFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mouseover',
    	single: true
    });

    示例2：若获取到的报表块对象定义为 report ，鼠标点击单元格时字体显示为红色加粗 14 号，再次点击时恢复

    report.addEffect('setCellFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mousedown',
    	single: false
    });

    示例3：普通报表中，鼠标悬浮单元格时字体显示为红色加粗 14 号，离开时恢复

    _g().addEffect('setCellFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mouseover',
    	single: true
    });

    示例4：普通报表中，鼠标点击单元格时字体显示为红色加粗 14 号，再次点击时恢复

    _g().addEffect('setCellFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mousedown',
    	single: false
    });

    示例5：决策报表中，鼠标悬浮单元格时字体显示为红色加粗 14 号，离开时恢复

    _g().getWidgetByName('report0').addEffect('setCellFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mouseover',
    	single: true
    });

    示例6：决策报表中，鼠标点击单元格时字体显示为红色加粗 14 号，再次点击时恢复

    _g().getWidgetByName('report0').addEffect('setCellFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mousedown',
    	single: false
    });

    应用示例

    示例1：鼠标点击单元格时字体显示为红色加粗 14 号，离开时恢复

    点击可下载模板：鼠标悬浮单元格字体变化.cpt

    2021-09-10_16-06-01.gif

    示例2：鼠标点击单元格时字体显示为红色加粗 14 号，再次点击时恢复

    点击可下载模板：鼠标点击单元格字体变化.cpt

    2021-09-12_11-25-03.gif

    单元格所在行字体变化

    addEffect 第一个参数 type 值为 setRowFont 时，鼠标点击或者悬浮单元格，单元格所在行字体格式变化。

    代码示例

    示例1：若获取到的报表块对象定义为 report ，鼠标悬浮单元格时，所在行字体显示为红色加粗 14 号，移动到其他行恢复：

    report.addEffect('setRowFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mouseover',
    	single: true
    });

    示例2：若获取到的报表块对象定义为 report ，鼠标点击单元格时字体显示为红色加粗 14 号，再次点击时恢复

    report.addEffect('setRowFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mousedown',
    	single: false
    });

    示例3：普通报表中，鼠标悬浮单元格时字体显示为红色加粗 14 号，离开时恢复

    _g().addEffect('setRowFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mouseover',
    	single: true
    });

    示例4：普通报表中，鼠标点击单元格时字体显示为红色加粗 14 号，再次点击时恢复

    _g().addEffect('setRowFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mousedown',
    	single: false
    });

    示例5：决策报表中，鼠标悬浮单元格时字体显示为红色加粗 14 号，离开时恢复

    _g().getWidgetByName('report0').addEffect('setRowFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mouseover',
    	single: true
    });

    示例6：决策报表中，鼠标点击单元格时字体显示为红色加粗 14 号，再次点击时恢复

    _g().getWidgetByName('report0').addEffect('setRowFont', {
    	style: {
    		bold: true,
    		fontSize: 14,
    		color: 'red'
    	},
    	trigger: 'mousedown',
    	single: false
    });

    应用示例

    示例1：鼠标悬浮单元格时，所在行字体显示为红色加粗 14 号，移动到其他行恢复

    点击可下载模板：鼠标悬浮单元格所在行字体变化.cpt

    2021-09-12_11-37-58.gif

    示例2：鼠标点击单元格时，所在行字体显示为红色加粗 14 号，再次点击恢复

    点击可下载模板：鼠标点击单元格所在行字体变化.cpt

    2021-10-25_15-47-29.gif

    附件列表


    主题： 二次开发
    上一篇：表格历史接口
    下一篇：修改行高列宽接口
    • 有帮助
    • 没帮助
    • 只是浏览

    售前咨询电话

    400-811-8890转1

    在线技术支持

    请前往「服务平台」，选择「在线支持」

    热线电话：400-811-8890转2

    总裁办24H投诉

    热线电话：173-1278-1526

    文 档反 馈

    鼠标选中内容，快速反馈问题

    鼠标选中存在疑惑的内容，即可快速反馈问题，我们将会跟进处理。

    不再提示

    10s后关闭