AWIROK软件编辑器自定义右键菜单

QQ896757558

AWIROK软件编辑器自定义右键菜单

function setupEditorActions(editor) {
// 定义 addAction 函数
function addAction(label, order, textToInsert) {
// 添加自定义右键菜单项的逻辑
}

// 定义 UIControl 函数
function UIControl(label, order) {
// 添加自定义右键菜单项的逻辑
}

// 调用 UIControl 函数以添加 "控件调用" 右键菜单项
UIControl('控件调用', 0);

// 调用 addAction 函数以添加 "if..." 右键菜单项
addAction('if...', 1,
`
if(){

}
`
);

// 调用 addAction 函数以添加 "if...else" 右键菜单项
addAction('if...else', 2,
`
if(){

}else{

}
`
);

// 调用 addAction 函数以添加 "for..i" 右键菜单项
addAction('for..i', 3,
`
for(let i=0;i<10;i++){

}
`
);
}

详细说明

1. 定义 setupEditorActions 函数

function setupEditorActions(editor) {

• 作用: 这是一个设置编辑器操作的函数，接受一个 editor 对象作为参数，该对象是 Monaco Editor 的实例。

2. 定义 addAction 函数

function addAction(label, order, textToInsert) {
    editor.addAction({
        id: 'menu-item-' + label,
        label: label,
        contextMenuGroupId: 'custom',
        contextMenuOrder: order,
        run: function (ed) {
            // 插入文本的逻辑
            const position = ed.getPosition();
            ed.executeEdits('', [{
                range: new monaco.Range(position.lineNumber, position.column, position.lineNumber, position.column),
                text: textToInsert,
                forceMoveMarkers: true
            }]);
        }
    });
}

• 作用: 这个函数用于向编辑器添加自定义右键菜单项。
• 参数:

• label: 菜单项的显示文本。
• order: 菜单项在组中的顺序。
• textToInsert: 当点击菜单项时要插入的文本。

• editor.addAction: 添加一个自定义操作到编辑器。

• id: 操作的唯一标识符，通常是菜单项的标签加前缀。
• label: 菜单项的显示文本。
• contextMenuGroupId: 菜单项所在的组，这里设置为 'custom'。
• contextMenuOrder: 菜单项在组中的顺序。
• run: 点击菜单项时执行的函数。在这个函数中，获取当前光标位置并插入指定的文本。

• getPosition: 获取当前光标的位置。
• executeEdits: 在指定位置插入文本。

• new monaco.Range: 定义插入文本的范围，这里是从当前光标位置开始，范围为零（即插入在光标位置）。
• text: 要插入的文本。
• forceMoveMarkers: 是否强制移动标记。

3. 定义 UIControl 函数

function UIControl(label, order) {
    editor.addAction({
        id: 'menu-item-' + label,
        label: label,
        contextMenuGroupId: 'custom',
        contextMenuOrder: order,
        run: function (ed) {
            // 插入文本的逻辑
            aiwork.showFastUIMenu();
        }
    });
}

• 作用: 这个函数用于向编辑器添加一个自定义右键菜单项，该菜单项执行特定的命令（例如调用某个 UI 控制菜单）。
• 参数:

• label: 菜单项的显示文本。
• order: 菜单项在组中的顺序。

• editor.addAction: 添加一个自定义操作到编辑器。

• id: 操作的唯一标识符，通常是菜单项的标签加前缀。
• label: 菜单项的显示文本。
• contextMenuGroupId: 菜单项所在的组，这里设置为 'custom'。
• contextMenuOrder: 菜单项在组中的顺序。
• run: 点击菜单项时执行的函数。在这个函数中，调用 aiwork.showFastUIMenu() 来执行特定的命令。

• aiwork.showFastUIMenu: 假设这是一个已经定义的函数，用于显示某个快速 UI 菜单。

4. 调用 UIControl 函数

UIControl('控件调用', 0);

• 作用: 调用 UIControl 函数来添加一个名为 “控件调用” 的右键菜单项，并设置其在组中的顺序为 0。

5. 调用 addAction 函数

addAction('if...', 1,
`
if(){
    
}
`
);

• 作用: 调用 addAction 函数来添加一个名为 “if…” 的右键菜单项，并设置其在组中的顺序为 1。
• 插入的文本:

if(){
    
}

6. 调用 addAction 函数

addAction('if...else', 2,
`
if(){

}else{
    
}
`
);

• 作用: 调用 addAction 函数来添加一个名为 “if…else” 的右键菜单项，并设置其在组中的顺序为 2。
• 插入的文本:

if(){

}else{
    
}

7. 调用 addAction 函数

addAction('for..i', 3,
`
for(let i=0;i<10;i++){

}
`
);

• 作用: 调用 addAction 函数来添加一个名为 “for…i” 的右键菜单项，并设置其在组中的顺序为 3。
• 插入的文本:

for(let i=0;i<10;i++){

}

总结

• 这段代码通过 setupEditorActions 函数来设置编辑器的右键菜单项。
• addAction 函数用于添加插入特定代码的菜单项。
• UIControl 函数用于添加执行特定命令（例如显示 UI 菜单）的菜单项。
• 通过 editor.addAction 方法向编辑器添加自定义操作。
• 每个菜单项都有唯一的 id 和显示的 label。
• contextMenuGroupId 用于指定菜单项所在的组，这里统一为 'custom'。
• contextMenuOrder 用于指定菜单项在组中的顺序。
• run 函数定义了点击菜单项时要执行的操作，可以是插入文本或调用其他函数。