Vertically Center Icon in IconMenuItem using Menu2

I am using IconMenuItem with a Menu2 class. I cannot get the icons to vertically center (and align to the text). Here is my code snippet:

***************************************************************************

rootMenuView = new WatchUi.Menu2({:title=>$.appName});

var myMenuIcon = new WatchUi.Bitmap({:rezId=>Rez.Drawables.menuSettings});

var mySyncIcon = new WatchUi.Bitmap({:rezId=>Rez.Drawables.menuSync});

rootMenuView.addItem(new WatchUi.IconMenuItem("Settings","","settingsID", myMenuIcon, {:alignment=>WatchUi.MenuItem.MENU_ITEM_LABEL_ALIGN_LEFT}));

rootMenuView.addItem(new WatchUi.IconMenuItem("Sync","","syncID", mySyncIcon, {:alignment=> WatchUi.MenuItem.MENU_ITEM_LABEL_ALIGN_LEFT}));

*****************************************************************************

Icons are aligned to top of menu item while text is vertically centered. Testing on a Forerunner 965 (sim and device). Any help would be greatly appreciated.

Top Replies

All Replies

flocsy🤠 3 months ago in reply to tnorman33

It is, you can try it, but I also tried it on fr965

apps.garmin.com/.../3430778e-6fee-4eb6-b799-21d9d59a41eb

jim_m_58 3 months ago in reply to flocsy🤠

The only time I use svg files are when I publish complications - there's no other option, And with them I had to add space to the right/left side to display correctly with things like FaceIt. Here's an example in inkscape, where you see the size of the image and what the image actually is

Are you sure that in your icons you don't have something similar? Maybe you could pass on your icon files to the OP and let him try those.

Also, I'd be a bit careful with the 15% sizing as that may not work well on devices like the instict2, edge devices. and handhelds.

tnorman33 3 months ago in reply to flocsy🤠

It must be my device. I downloaded your app and have the same issue with your App. I am running Software Version 19.18.

tnorman33 3 months ago in reply to jim_m_58

I am now thinking it is a Garmin Software Version bug. The current icon I am using are now PNG. I only used SVG's to see if it was PNG's causing problem. See my reply to flocsy.

jim_m_58 3 months ago in reply to tnorman33

Ok, two 965's.. Are they both running the same firmware? (check in "About".) Since this thread started, there could be a difference

tnorman33 3 months ago in reply to jim_m_58

I am running 19.18 [DFU-6842d1]

jim_m_58 3 months ago in reply to tnorman33

Ok, the latest public beta FW I see for the 965 is 20.15 It's from 10 days ago. For me, I always run the latest beta on a device.

FlowState 3 months ago in reply to tnorman33

@tnorman33, it seems to me that your device is displaying is displaying larger text and fewer menu items per page than flocsy.

Both of you uploaded 454 x 454 screenshots (same as the display resolution), so screenshot cropping is not an issue.

His screenshots show almost 5 menu items (the top and bottom items are barely cropped by the display.)

Your screenshots show slightly more than 3 menu items (the bottom item is barely visible.)

Do you have large fonts enabled on your device? If so, and assuming flocsy does not have large fonts enabled, that would explain the discrepancy.

It's still arguably a Garmin bug, but at least there's an explanation, and you can use that as a starting point for your bug report. (It might be 2 bugs, assuming that the problem happens with either large fonts or with non-XML menus.)

In the simulator and Connect IQ, large font mode is (somewhat confusingly) referred to as Enhanced Readability Mode. Trying turning that on the sim and seeing if you can now recreate the device behavior in the sim, for your app in its current state.

Also see:

[https://developer.garmin.com/connect-iq/api-docs/Toybox/System/DeviceSettings.html#isEnhancedReadabilityModeEnabled-var]

[https://developer.garmin.com/connect-iq/api-docs/Toybox/Application/AppBase.html#onEnhancedReadabilityModeChanged-instance_function]

[https://forums.garmin.com/developer/connect-iq/i/bug-reports/make-devicesettings-isenhancedreadabilitymodeenabled-available-in-fenix-7-family-of-devices]

(Note that this variable and function obviously won't help you fix the built-in Menu2 View. But it's worth knowing that they exist for the cases where you draw your own view, so your code can increase the font size when necessary.)

FlowState 3 months ago in reply to jim_m_58

jim_m_58 said:
For me, I always run the latest beta on a device.

What does that have to do with whether tnorman33 and flocsy are running the same firmware lmao? Are you suggesting that it's the best policy to run the latest beta on a device? (Or that running the latest beta would've fixed this problem? How likely is it that this problem has coincidentally been fixed with 10-day old firmware, especially given that there's been 0 discussion of it so far, other than this thread. Also, if flocsy had noticed that this problem existed for him with older firmware, he surely would've said something - and it would be hard not to notice, given that the newest firmware is only 10 days old.)

I happen to run the latest beta as well, but I don't think it's for everyone, bc not only do you get all the latest features, you also get all the latest bugs. I just opened 4 bug reports on the latest beta for 955 and they're all regressions (stuff that worked in the previous firmware.)

tnorman33 3 months ago in reply to FlowState

I toggled off Large Font mode on my device and the problem is FIXED!!!!!!! It was compiled with XML, but I suspect it will also work with Monkey C code. I will retry on device with Monkey C in the morning to confirm. THANK YOU! I have never submitted a bug to Garmin, so I will also look into that in the morning. THANKS to both you and flocsy🤠. I so appreciate taking the time to help me.