请选择 进入手机版 | 继续访问电脑版
 找回密码
 立即注册

QQ登录

只需一步,快速开始

miou

注册会员

4

主题

15

帖子

74

积分

注册会员

积分
74
最新发帖
miou
注册会员   /  发表于:2021-6-23 16:31  /   查看:2957  /  回复:16
var style = new GC.Spread.Sheets.Style();
style.backgroundImage = imgUrl;
style.backgroundImageLayout = GC.Spread.Sheets.ImageLayout.zoom;

activeSheet.setStyle(i, j,style);

给单元格设置背景图能否设置背景图的大小和在单元格的位置,比如显示在单元格右上角或者右侧,缩小展示


16 个回复

倒序浏览
Lynn.Dou讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2021-6-23 16:46:10
沙发
本帖最后由 Lynn.Dou 于 2021-6-23 16:48 编辑

您好,
使用 backgroundImage  给单元格设置背景图无法设置图片的大小和位置。
您测试下单元格按钮是否满足您的需求。
建议您先通过 在线表格编辑器实际测试下:
如下图:
image.png241215514.png

image.png848907775.png

结果如下图:
image.png895948486.png
通过代码实现上述功能请参考学习指南:
https://demo.grapecity.com.cn/sp ... cell-buttons/purejs



回复 使用道具 举报
miou
注册会员   /  发表于:2021-6-23 18:22:23
板凳
var style = new GC.Spread.Sheets.Style();
style.cellButtons = [
        {
                useButtonStyle: false,
                imageType: GC.Spread.Sheets.ButtonImageType.custom,
                imageSrc: imgUrl,
                imageSize: {
                        height: 15,
                        width: 15
                },
                enabled: false
        }
];
activeSheet.setStyle(parseInt(i), parseInt(j),style);
var range = new GC.Spread.Sheets.Range(i,j,1,1);
activeSheet.cellStates.add(range,GC.Spread.Sheets.CellStatesType.readonly,style);
想设置单元格为只读,但是GC.Spread.Sheets.CellStatesType.readonly不起作用
回复 使用道具 举报
Lynn.Dou讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2021-6-24 09:21:40
地板
如下图API所示,在保护表单中锁定单元格时,单元格状态为 "readonly" 。API链接:https://demo.grapecity.com.cn/sp ... tml#.CellStatesType

image.png855433654.png
设置 单元格按钮所在的单元格 只读,请参考以下代码:
  1. var sheet = spread.getActiveSheet()
  2. var style = new GC.Spread.Sheets.Style();
  3. style.locked = true;
  4. style.cellButtons = [
  5.         {
  6.                 useButtonStyle: false,
  7.                 imageType: GC.Spread.Sheets.ButtonImageType.custom,
  8.                 imageSrc: "https://img0.baidu.com/it/u=3101694723,748884042&fm=26&fmt=auto&gp=0.jpg",
  9.                 imageSize: {
  10.                         height: 15,
  11.                         width: 15
  12.                 },
  13.                 enabled: false
  14.         }
  15. ];
  16. var defaultStyle = new GC.Spread.Sheets.Style();
  17. defaultStyle.locked = false;
  18. sheet.setDefaultStyle(defaultStyle, GC.Spread.Sheets.SheetArea.viewport);
  19. sheet.setStyle(1,1,style);
  20. sheet.options.isProtected = true;  
复制代码









回复 使用道具 举报
miou
注册会员   /  发表于:2021-6-24 10:56:27
5#
var style = new GC.Spread.Sheets.Style();
style.name = 'style1';
sheet.setStyle(row,col,style);
使用sheet.getStyle(row,col)获取到的style中name是空的。

activeSheet.addNamedStyle(style);
activeSheet.setStyleName(row,col,'style1');
使用sheet.getStyleName(row,col)也是获取到的空

怎样才能根据行列获取到单元格的样式名称?
回复 使用道具 举报
Lynn.Dou讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2021-6-24 11:06:33
6#

如果想给一个样式命名,可以使用命名样式。
具体请参考学习指南:https://demo.grapecity.com.cn/sp ... /basic-style/purejs
image.png279706114.png

示例代码:
  1. var style = new GC.Spread.Sheets.Style();
  2. style.name = 'style1';
  3. style.backColor = 'red';
  4. //add to sheet's named style collection.
  5. sheet.addNamedStyle(style);
  6. sheet.setStyle(1,1,sheet.getNamedStyle('style1'))
  7. sheet.getStyleName(1,1)
复制代码



image.png132601927.png

相关API:
https://demo.grapecity.com.cn/sp ... .html#addNamedStyle
https://demo.grapecity.com.cn/sp ... t.html#getStyleName

回复 使用道具 举报
miou
注册会员   /  发表于:2021-6-24 11:16:48
7#
保存之后,重新刷新页面再重新获取样式名称就是个空了
回复 使用道具 举报
Lynn.Dou讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2021-6-24 11:42:38
8#
上述代码是将命名样式存储在当前的sheet中,
您检查下刷新页面后,获取到的sheet是否正确。

另外,命名样式也可以存储在spread中,可以应用于所有表单:
spread.addNamedStyle(style);
在单元格中应用此样式和获取此样式代码同上。
您测试下讲命名样式添加在 spread ,看是否会出现此问题。

如果问题还未解决,请上传一个能复现此问题的demo,
并详细描述下复现步骤及您期待的效果,
这边实际测试下。
回复 使用道具 举报
miou
注册会员   /  发表于:2021-6-24 18:47:05
9#
设置单元格样式为只读
var sheet = spread.getActiveSheet()
var style = new GC.Spread.Sheets.Style();
style.locked = true;
style.cellButtons = [
        {
                useButtonStyle: false,
                imageType: GC.Spread.Sheets.ButtonImageType.custom,
                imageSrc: "https://img0.baidu.com/it/u=3101694723,748884042&fm=26&fmt=auto&gp=0.jpg",
                imageSize: {
                        height: 15,
                        width: 15
                },
                enabled: false
        }
];
var defaultStyle = new GC.Spread.Sheets.Style();
defaultStyle.locked = false;
sheet.setDefaultStyle(defaultStyle, GC.Spread.Sheets.SheetArea.viewport);
sheet.setStyle(1,1,style);
sheet.options.isProtected = true;
然后操作别的单元格,再回来点击设置为只读的单元格,再点击事件上设置
style.bind(GC.Spread.Sheets.Events.CellClick, function (sender, args) {
        if(!style.getNamedStyle("readOnly")){
                style.options.isProtected = false;
        }else if(style.getNamedStyle("readOnly") && style.options.isProtected == false){
                style.options.isProtected = true;
        }
});
为什么单元格上会显示出两个样式 image.png285083922.png ,点击其他可编辑的单元格,需要点击两次左边的一个只读图标会消失,再回来点击只读单元格,又会展示两个图标

目标:只显示一个图标即可
回复 使用道具 举报
Lynn.Dou讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2021-6-25 09:25:09
10#

if(!style.getNamedStyle("readOnly"))
是在什么时候添加的nameStyle?请提供下完整的代码。
仅从上述描述无法复现此问题。

附件为模板demo,在demo中添加自己的代码。
并详细的描述操作步骤,以便这边快速复现此问题。

模板.zip

2.75 MB, 下载次数: 46

回复 使用道具 举报
12下一页
您需要登录后才可以回帖 登录 | 立即注册
返回顶部