I have a requirement for a cross-platform PopupMenu control with large text. While the Xojo Mac PopupMenu control can display large text when expanded, the control itself cannot be enlarged and doesn’t look good with a large font size, so I made my own.
While I was at it, I added settable background color, text color, highlight color, and row spacing properties, as well as independently-settable font size for the control and the menu.
Most behavior emulates the Mac control - I don’t like Windows’ use of a scroll bar in popups, and I prefer the way the Mac control opens with the selected row centered on the control.
The control also optionally offers the MacOS “wink” on menu selection and a checkmark showing the currently-selected item, which the native Windows control doesn’t have.
Unlike the Xojo Mac control, incremental text search and arrow-key scrolling work with the unexpanded control when it has focus.
An incidental specialized requirement of my application is displaying an image in a separate window via code in the MouseDown event. This works with the Xojo Mac control but doesn’t seem possible with the Xojo Windows control - the menu displays and then closes as soon as the image window opens. It works on both platforms with my control, but the “CloseOnExit” property must be selected, since the default behavior (close on deactivation) will fire as soon as the picture window activates.
The demo project can be downloaded here and is free for all to use without restriction - improvements and suggestions are welcome. No plugins are required. It’s been tested on a multi-monitor setup with side-by-side monitors of equal resolution. I expect it to work with side-by-side monitors of varying resolution, but over-under monitors maybe not so much at present.
The only negative I would say it that the arrow is wrong for a popup menu on Mac. It should point up and down. That looks more like a combobox. It also lacks the coloured background to the arrow. In case you want to duplicate the standard item with a larger font.
I think the images are in the Zip file but they don’t get carried across if you drag or paste the folder into a new project - maybe I should put them in as string constants or something. Anyway, here they are:
As a Mac user, I rounded all the rectangles and pushed the text up a little higher in the canvas and put small gutters around the select rectangles. Made the outlines a little grayer. This just to more closely mimic the MacOS appearance. All of these modifications were easy within Julia’s code.
The pop-up content itself is rounded. You can see a slight “artifact” at the corner where the sharp corner of the “window” is still visible. It is not too obnoxious but I could not figure out a way to get rid of it. The “gutter” between A and the top of the popup is reduced.
Small gutters have been created so the blue selection rectangle does not extend all the way to the edge. The blue selection rectangle is itself “rounded”.
