如何在InDesign中添加上下文菜單列表框（SUI）或TreeView控件（SUI）的JavaScript插件

Question

的同事

我開發的JavaScript的InDesign插件。 在插件存在的窗口中，放置了ListBox組件。 如何將上下文菜單添加到我的ListBox組件？

Answer 1

好吧，這是一種方法。我認爲這是一個很好的起點：

//A sugar to color groups 
 
var o = { 
 
\t paintItem:function(o,c){ 
 
\t \t \t var r = (c && c.r) || Math.round (Math.random()*10)/10; 
 
\t \t \t var g = (c && c.g) || Math.round (Math.random()*10)/10; 
 
\t \t \t var b = (c && c.b) || Math.round (Math.random()*10)/10; 
 
\t \t \t var a = (c && c.a) || 1; 
 
\t \t \t o.graphics.backgroundColor = o.graphics.newBrush(o.graphics.BrushType.SOLID_COLOR,[r,g,b], a); 
 
\t \t }, 
 
} 
 

 
//Main routine 
 
var main = function() { 
 
\t 
 
\t var w = new Window("dialog", "testingRightClickMenu"), 
 
\t g = w.add('group'), 
 
\t btn = g.add('button', undefined, "Cancel"); 
 
\t 
 
\t //Calling our rightClickMenu "factory" 
 
\t var rightClickMenu = rightClickWindow(w); 
 
\t rightClickMenu.visible = false; 
 
\t rightClickMenu.alignment = ["left","top"] ; 
 
\t 
 
\t //Mouse click events handler 
 
\t var handler = function(evt) { 
 
\t \t 
 
\t \t var screenX = evt.screenX; 
 
\t \t var screenY = evt.screenY; 
 
\t \t var fb = w.bounds; 
 
\t \t var x = screenX- fb[0]+2; 
 
\t \t var y = screenY- fb[1]+2; 
 
\t \t 
 
\t \t //If button click is actually a right click event 
 
\t \t if (evt.button==2) { 
 
\t \t \t 
 
\t \t \t //Displaying the right click menu to position x,y 
 
\t \t \t rightClickMenu.visible = true; 
 
\t \t \t rightClickMenu.location = [x,y]; 
 
\t \t } 
 
\t } 
 

 
\t //Setting some UI properties 
 
\t w.orientation = 'stack'; 
 
\t w.preferredSize = [500, 300]; 
 
\t g.alignment = ["fill","fill"]; 
 
\t 
 
\t //adding mouse click listener 
 
\t w.addEventListener ("click", handler, true); 
 
\t 
 
\t //HACK 
 
\t //adding listeners to sub level elements ended with bad behaviors 
 
\t //Instead we look at mouse pointer location 
 
\t //and hide right click menu if needed 
 
\t w.addEventListener ("mouseout", function(evt) { 
 
\t \t var x1 = rightClickMenu.location[0]; 
 
\t \t var x2 = x1+rightClickMenu.size.width; 
 
\t \t var y1 = rightClickMenu.location[1]; 
 
\t \t var y2 = y1+rightClickMenu.size.height; 
 
\t \t if (!rightClickMenu.visible) return; 
 
\t \t var mouseX = evt.screenX-w.bounds[0]; 
 
\t \t var mouseY = evt.screenY-w.bounds[1]; 
 
\t \t 
 
\t \t //basicallly checking if the pointer is somewhere else but over the right click menu 
 
\t \t if (mouseX<x1 
 
\t \t || 
 
\t \t mouseX > x2 
 
\t \t || 
 
\t \t mouseY < y1 
 
\t \t || 
 
\t \t mouseY > y2) rightClickMenu.hide(); 
 
\t \t 
 
\t }); 
 
\t w.show(); 
 
} 
 

 
//Some color settings 
 
var colors = { 
 
\t grey : {r:240/255,g:240/255,b:240/255}, 
 
\t blue: {r:79/255,g:157/255,b:251/255}, 
 
\t transparent:{r:1,g:1,b:1, a:0}, 
 
} 
 

 
//Our pseudo factory for the right click menu 
 
var rightClickWindow = function(p) { 
 

 
\t //Our pseudo "factory" for teh menu Items 
 
\t var getMenuItem = function(p, label){ 
 
\t \t var menuItem = p.add('group'), 
 
\t \t menuLabel = menuItem.add('statictext', undefined, label); 
 
\t \t menuItem.alignment = "fill"; 
 
\t \t 
 
\t \t //Dealing with mouse events 
 
\t \t menuItem.addEventListener ("mouseover", function() { 
 
\t \t \t o.paintItem (menuItem, colors.blue); 
 
\t \t \t menuLabel.graphics.foregroundColor = menuLabel.graphics.newPen (menuLabel.graphics.PenType.SOLID_COLOR, [1, 1, 1], 1); 
 
\t \t }); 
 
\t \t menuItem.addEventListener ("mouseout", function() { 
 
\t \t \t o.paintItem (menuItem, colors.grey); 
 
\t \t \t menuLabel.graphics.foregroundColor = menuLabel.graphics.newPen (menuLabel.graphics.PenType.SOLID_COLOR, [0, 0, 0], 1); 
 
\t \t }); 
 
\t \t menuItem.addEventListener ("mousedown", function() { 
 
\t \t \t rightClickMenu.hide(); 
 
\t \t \t alert("You chose "+label); 
 
\t \t }); 
 
\t \t o.paintItem (menuItem, colors.grey); 
 
\t \t return menuItem; 
 
\t } 
 

 
\t //menu construction 
 
\t var rightClickMenu = p.add('group'), 
 
\t menuItem1 = getMenuItem(rightClickMenu, "MenuItem A"); 
 
\t menuItem2 = getMenuItem(rightClickMenu, "MenuItem B"); 
 
\t menuItem3 = getMenuItem(rightClickMenu, "MenuItem C"); 
 
\t rightClickMenu.maximumSize = [100,150]; 
 
\t 
 
\t //Menu UI properties 
 
\t rightClickMenu.orientation = "column"; 
 
\t rightClickMenu.alignment = "fill"; 
 
\t rightClickMenu.alignChildren = ["fill", "top"]; 
 
\t rightClickMenu.margins = 5; 
 
\t o.paintItem (rightClickMenu, colors.grey); 
 
\t 
 

 
\t return rightClickMenu; 
 
} 
 

 
//Running UI 
 
try { 
 
\t main(); 
 
} 
 
catch(err) { 
 
\t alert(err.line+"//"+err.message); 
 
}