I need to create a dropdown list with (unselectable) separator lines. For example, in the Designer, if you expand the Project list in the menu bar, there are 3 sections in the list, separated by 2 lines: the top section has 3 choices at the top of the list (Comm Off, Comm Read-Only, and Comm Read/Write), then there is a separator line before the next section which has 3 choices (Properties, Gateway Event Scripts, and Client Event Scripts). This section is followed by yet another separator line before the last section with 2 choices (Preview Mode and Preview Language).
I donât need to have expandable selections, radio buttons, or check boxes in my dropdown - just separator lines.
You can add a propetyChanged event script to the dropdown which, if a user selects your separator line, you revert the selected index back to its old value. Like this:
Dropdown Contents:
propertyChange script:
SEPARATOR_STR = "-----------------------------------"
if event.propertyName == "selectedIndex":
if event.source.selectedStringValue == SEPARATOR_STR:
event.source.selectedIndex = event.oldValue
The standard look of a dropdown component is different than standard look of a menu component.
You might be able to write a module that grants access to a java.swing JMenu as a configurable Ignition component.
Or you could hack together something out of a template canvas. You could wrap your âmenu itemâ into a template with mouse hover/click event scripts that gets painted into layout cells of the canvas, with different text parameters for each item.
Interesting. Consider constructing a fake dropdown from a Label and a small Button. Have the buttonâs actionPerformed event construct and display a popup menu, but override its placement and size so it shows up below the Label. Have the menu items write to the Label .text property when selected (and whatever other functionality you need).
I implemented the hacky template canvas approach, but with more of a âmenuâ style in mind. You could easily change the top label to look more like a dropdown.
EDIT: DONâT DO THIS. Use system.gui.createPopupMenu(). Unless you need to construct a menu with arbitrarily complex items.
Sure. Donât say I didnât warn you though: itâs hacky.
There are 2 templates needed (you could optionally add more to achieve the radio button/checkbox functionality)
menubar_item
A 200x18 template with a custom string parameter. The template contains only a label that fills the entire space, and has its text property bound to the templates string parameter. I implemented event scripts for mouseEntered and mouseExited, which merely set the event.source.background color to reflect if the option is highlighted or not.
menubar_separator
A 200x4 template with a grey line, thatâs all.
To implement the above templates in a usable menu, you need a label and a template canvas. The label will act as the initial button (similar to the 'Project' menu item in the Designer), while the template canvas instantiates and formats the templates outlined above as an actual menu. I implemented both of these in another template, **menubar**, just for demonstration.*
The menubar template has a boolean custom parameter: menuOpened, which gets set when the user clicks the âMenuâ label and unset when they click off of it. menuOpened gets bound to the template canvases âvisibleâ property so it wonât show the menu unless they click the label. In the template canvas customizer you add the menu items along with seperators, and configure the parameters. Their position is determined by setting the Positioning to âLayout Positioningâ: âcell 0 rowIndexâ. Hereâs a screenshot:
Parametrizing the mouseClicked events of the menuItems is an exercise left for the masochistic reader. I'd be interested to see how you implement them.
_*You'd probably just want to put the label and template canvas on the actual page and configure your menu as needed, otherwise you'd need to abstract the menuitem text parameters and generate the template canvas 'templates' dataset, which is a little more involved._
Well I should say, âI kind of figured it outâŚâ
I tried using system.gui.createPopupMenu which only seems to work with a right click. Is there a way to use/trigger that function with a left click?
I assigned the following script to the mouseReleased event of a label. (I would prefer that it worked with the actionPerformed event of a button).
TIL createPopupMenu is a thing. Canât believe I havenât needed that before, much more elegant than template abuse. But itâs never a bad time to show off the Turing-completeness of the template canvas
I was able to implement your script with minor modifications on a buttons actionPerformed event:
So, move the button to the right and restyle it to show just the "down arrow" of a dropdown. Place a label where the button was and style it to look like a text entry field. Then use the label as the relative location for showing the menu.
I poked around a bit and found you can wrap the given event in a class that JPopupMenu.show() expects (something that inherits java.awt.event.ComponentEvent) along with whatever your custom data is.