Creating a scrollable view in touch-screen watch app

If you don't want to use Menu or Menu2, then your only option is to use View. The View itself doesn't provide functionality for a scrollable view, but I'm pretty sure what you want can be done.

It might be easier to just use Menu2 with nested menus instead of multiple clickable areas with each menu item. Depending on the devices you're supporting it might be a good idea to avoid multiple clickable elements for a single item anyway.. it can get difficult to accurately tap small areas on some devices because of the display size.

Hi Travis,

I didn't say I didn't want to use Menu2, I just said I thought it appeared to be too restrictive... however, that was before I discovered CustomMenu.

Understand what you're saying about small areas on some devices, but my required UX really wouldn't work with then having to go down another level on each item.

I've been playing with putting together a CustomMenu (thanks to the Menu2Sample project) but I've not managed to figure out how to implement clickable areas.. but from your statement of "good idea to avoid multiple clickable elements" that tells me that it is at least possible!?

Do you happen to have any example code as to how to create a CustomMenuItem with multiple clickable elements, and how to deal with the input delegates for them?

Thanks, Tom

Tom101449 said:

I've not managed to figure out how to implement clickable areas

I don't think that will work. The problem is that the Menu2 delegate doesn't provide information about where the click occurs within the menu item area, so you can't really do any processing to determine which element in your menu item was clicked.

The Menu2InputDelegate only has high level methods (onTitle, onFooter, onWrap, onDone, onBack, and onSelect). None of those methods take a parameter that can be used to tell where a click occurred. I can think of no way to make Menu2 work for what you are trying to do.

Kind of a different approach, but here's a case where I display a list, and use a highlight for a day.  KEY_ENTER then shows data for that day.  No Menu/Menu2, etc.  Just onNextPage(), onPreviousPage() and onKey(), so will work on touch and nonTouch

Sorry for the delay in replying, I had to go out for a while.

Travis - understood, it's just highly frustrating that the tools don't allow for that level of customisation.

Jim - yes, a different approach, but doesn't achieve what I'm trying to do, which is to quickly and easily update a simple value against each individual "player" (as per when you asked before, this is for my disc golf app) without leaving screen for each person.

Having to go into each individual player to update their individual score on each hole is going to be an annoying UX... but it looks like the only option available to me.  I guess the solution is to go into a view where the selected player is displayed, allowing you to change their score via + and - buttons, and then use onNextPage() and onPreviousPage() to go through the individual players without needing to go back to the list to select another one.

I know this post is late, but I'm new to the community, so hopefully it still helps. This poster demonstrates how to manually create a dynamic scrollable list: https://forums.garmin.com/developer/connect-iq/f/discussion/7727/dynamic-menu-forked-code-available

You can combine this with a delegate using onTap's getCoordinates to get exact positioning of where a click is, and that should hopefully get you where you need to go.

public function onTap(evt as ClickEvent) as Boolean {
    System.println(evt.getCoordinates());
    System.println(evt.getType());
}

Dumb question, but I am in the middle of working with CustomMenus, and I am curious how your example has the menu directly below the title. So far, I can't figure out how to stop it from being vertically centered.

When I did my first device app, I wrote it specifically for the original vivoactive.  But I soon found out that what I did wouldn't work on non touch devices, so it was pretty much a re-write to support non touch devices (forerunners, fenix, edge, outdoor hand helds) .

I would strongly suggest that you avoid locking yourself into touch devices and do things so it works on both touch and button devices.Once you publish, you'll probably see requests to support non touch devices fairly soon.  While you can still use onTap(), you may want to allow for onSelect (you'll see this with onTap for touch devices, and a press of the upper right button on both touch and button devices), onNextPage/onPreviousPage instead of onSwipe up/down to handle swipes and up/down button presses.

onHold can also be a bit tricky, as on a va3, that will also be seen as onMenu, while on a va4/venu onMenu is a long press of the lower button.

I'd also avoid doing things like trying to detect your own long press of buttons, as that can conflict with devices that do their own long presses for various things including hot keys.