自定义组件版编辑器——“插入函数”按钮添加自定义公式

收藏 · 2021-11-26 11:43 上传

本帖最后由 Derrick.Jiao 于 2021-11-26 11:43 编辑

有小伙伴想要在设计器的插入函数模板中添加自己的自定义函数。那么我们今天就来讲一下这部分应该如何实现。
image.png465754088.png

首先，我们先自定义一个函数，如何自定义函数可以参考学习指南这个demo
https://demo.grapecity.com.cn/sp ... om-functions/purejs

function FactorialFunction() {
this.name = "FACTORIAL";
this.maxArgs = 1;
this.minArgs = 1;
this.description = function () {
return (
{
description: "菲波那切数列",
parameters: [
{
name: 'number01',
repeatable: false,
optional: false
}
]
}
)
}
}
FactorialFunction.prototype = new GC.Spread.CalcEngine.Functions.Function();
FactorialFunction.prototype.evaluate = function (arg) {
var result = 1;
if (arguments.length === 1 && !isNaN(parseInt(arg))) {
for (var i = 1; i <= arg; i++) {
result = i * result;
}
return result;
}
return "#VALUE!";
};
var factorial = new FactorialFunction();
GC.Spread.CalcEngine.Functions.defineGlobalCustomFunction("FACTORIAL", new FactorialFunction());
spread.addCustomFunction(factorial)

复制代码

定义完这个函数后，我们需要找这个弹框对应的template。对应的是GC.Spread.Sheets.Designer.TemplateNames.InsertFunctionDialogTemplate。
image.png250490721.png

我们要添加函数的位置在这个数组中
image.png627873839.png

于是我们可以通过bindingPath找到这个位置，并且添加我们的自定义函数对象

function customFontFamilyInFormatDialogTemplate(templateNode) {
if (templateNode.bindingPath && templateNode.bindingPath === 'functionDesc.allFunction' && templateNode.items) {
templateNode.items.unshift({ text: "FACTORIAL", value: "FACTORIAL" })
return;
}
let nodes = templateNode.content || templateNode.children;
if (nodes && nodes instanceof Array) {
nodes.forEach((subNode) => customFontFamilyInFormatDialogTemplate(subNode));
}
}