Day16 单元格样式(背景色/下划线/删除线等)

返回目录

 

以下知识源码位置: [Git:  https://gitee.com/zhouweng/mini_sheet  version=deddbc44ab5083115dac689e665f3b45c15a713a]

源代码回滚版本，参考这里[ https://blog.csdn.net/u010593516/article/details/113767587 ]

 

今天，我们增加单元格样式，包括背景色、下划线、删除线等，具体的效果如下：

 ===>>>

 

 

 

1.修改文件

1.1.draw.js: cellTextRender()增加 删除线和下划线的逻辑，实际就是根据单元格的位置，调用drawOneLine()画一条线

1.2.getdata.js: 我们首先把checkstatusByCell()更名为 getStatusByCell() ，这样描述函数的功能更加准确，然后我们新增三个方法:

    getStatusByFlow(): 从data数据流提取单元格信息;

    getCellTextInfo(): 获取单元格文本内容的渲染信息;

    getFontStyleByCell(): 获取单元格的字体样式信息;

1.3.util.js: 增加方法 luckysheetfontformat() 实现斜体、粗体、字体大小

1.4.index.html:我们把A1单元格，增加了字体颜色、下划线、删除线和粗体，并修改字体大小；B1单元格修改背景色

 

2.项目优化

2.1. resize.js: 因为主要完成界面的处理，所以从controller移动到revew目录, 对应handler.js和sheetmanage.js引用调整

 

 

今天内容就到这里，目前版本的mini_sheet代码量已经突破3K。