[320x240] Tile based main menu

[millim]

Dear community,

I like the Rockbox features and it works well on my ipod 6g. Quick question:  Is it possible to do some sort of tile based main menu appearance? I mean like today's mobile phones do.

Any help welcome! I have checked already the source code and I have the impression it is not supported natively. I do have C/C++ experience and I am wondering why a standard GUI library was not used instead of this unstructured "spaghetti" type of code for the lists and menus. Sure, there might be a good reason for this.

Maybe somebody as already worked in it, willing to share the code.

millim

[gevaerts]

It's been a *long* time since I've played with themes, so I don't remember any details, but https://www.rockbox.org/wiki/CustomWPS#Drawing_the_lists_using_a_skin does mention a tile mode for list views which I seem to remember may actually work.

[millim]

Hello gevaerts!

Thank you very much for your instant reply! Well, this answer does not help much, sorry. I have checked the documentation and all information end where it is getting interesting. Is there a step by step tutorial available? I am not sure what is faster: Debugging the source code or starting trial and error approach writing cryptic .WPS or .SPS files.

Why wasn't the engine based on XML or other proven concepts taken from e.g. Winamp or foobar2000? There might be a good reason for it?

millim

[gevaerts]

As I said, it's been years (nearly a decade) since I played with this, so I don't know. What have you tried?

I can't find a theme that uses tiling, but there are examples that use %Lb for themed lists (for which tiling is an option)
http://themes.rockbox.org/index.php?themeid=2862&target=ipod6g seems to be one of the easier to read ones.

[millim]

Thank you for your answer.

I have already searched the Themes database for an example already  - hard luck, no match.
How was this function ever tested, if there is no testcase available?

I want just do it for the main menu, as a "home screen". All other trees should be regular lists.

I see this will be a dead end...

millim

[Frankenpod]

Is this only relevant to touchscreen devices?  Can't really tell from the documentation on the custom WPS page, but seems, intuitively, as if tiles would only make sense in that case.  Unless there's actually something implemented to make the button controls (and clickwheel) move the focus around a tile interface rather than a list menu?

If it's only for touchscreens, that's probably part of the reason why no themes have been written for it, as the majority of themes are not intended for touchscreens.

If it does work for non-touch devices, you (millim) could try writing a theme to use it.  I'm now considering giving it a go, though I can't, at first glance, make a lot of sense out of the linked bit of WPS documentation.

[millim]

Hello Frankenpod!

It makes a lot of sense what you are stating. I think it's not necessarily to be a touch screen. To navigate, left, right, up down or even click wheel would work to navigate through the tile grid. I just want to reach my goal right away, that's why I am asking for already available features of the code requiring minimum effort on changes.

The idea of a "home screen" would be as follows: One could put a flexible number of apps onto the home screen (like on today's mobiles). It is more or less a quick launch screen. With the left, right, up down or even click wheel one could navigate from one app to another (so focus is moving). Two custom bitmaps per app are used to show focus/non-focus behavior (could be general skin style). By clicking select, the app holding focus is executed. So, one could put favorite games, viewers or plugins onto this "home screen". It is not so much different to a standard main menu list, it's custom and 2D with an additional "special" bitmap highlighting focus. The app-list can be defined through the Themes .cfg file. On 320x240 display, 8 to 12 apps would fit, scrolling would do the rest.

If I would understand the skin_engine a bit better, or even get on speed much faster, adding this feature would be fairly easy.
Don't get me wrong, it is a cool thing, I like it. But, I think, customization on code level is not part of the architecture.

millim
 

[Frankenpod]

Unfortunately I really can't make head-nor-tail of the description of how to implement 'tiling' for the main menu.  Sounds as if maybe it would be possible to do it (i.e. make the menu be an N- by-M grid of just the icons, rather than the usual text menu with icons running down the left side), but I can't figure out the WPS syntax to do it.  As you say, it would be a lot easier if there were, even one existing theme that did that already. But there don't seem to be any.  Maybe nobody else could figure out the syntax either?

[millim]

I think it is well documented what needs to be done here:
https://www.rockbox.org/wiki/RoadToSkinLists

The article dates back to 18 Feb 2013 (JonathanGordon), quite some time ago..
To quote with a music tile: "Talking Heads - Road to Nowhere" 

millim

[ginkgo]

Hi millim, I've been designing a theme for the Fiio M3K and have been able to create a tiled main menu (using the instructions on this page https://www.rockbox.org/wiki/CustomWPS#Drawing_the_lists_using_a_skin). The example given on that page for using the skin list doesn't use tiling and is a little cryptic but after fiddling it is easy enough. I've attached a screenshot of the theme so far.

To make a tiled style interface you need to set a %Vi (ui viewport) tag, then use an %Lb tag with a labelled viewport (%Vl) to fill the ui viewport with copies of the labelled viewport. I've included some of my .sbs file to demonstrate below. To make the buttons display, I used a bitmap strip.
 
%Vi(-,0,20,-,-,1) # ui viewport

# if we are on the main screen, draw the list using viewport 'main'
%?if(%cs, =, 1)<%Lb(main,120,90,tile)%Vd(titlebar)>

# main viewport
%Vl(main,0,0,120,90,1) # the coordinates here are relative to the %Lb's width and height
%xl(M,mainmenu.bmp,0,0,8) # normal icons
%xl(S,mainmenu-sel.bmp,0,0,8) # selected icons
%?Lc<%xd(S, %LN)|%xd(M, %LN)> # highlights selected icons

# shows the list items title at the bottom of the screen
%Vl(titlebar,0,280,-,-,1)
%s%ac%LT

It's also possible to style the other menus like this, like the settings menu and so on.

I hope you find this helpful, if you need any clarification feel free to reply and I will try to help out.

ginkgo

[Frankenpod]

Hey, thanks very much for that - that example makes the whole thing much more comprehensible.  Been faffing about with it a bit and have a first draft at such an icon menu for the ipod 6/7g.  Needs a _lot_ more work yet, but your example code got me past the complete mental block I was having trying to understand that custom WPS documentation (which, really, I couldn't make head-nor-tail of).

PS - where did you get the icons you used from?   Was looking at wikimedia commons, but yours look better than the tango ones I was trying.

[ginkgo]

PS - where did you get the icons you used from?   Was looking at wikimedia commons, but yours look better than the tango ones I was trying.

Hi Frankenpod, I'm glad you found my post useful. I made the icons myself, they're not online; however, the symbols in the buttons are borrowed from the Papirus icon set (https://github.com/PapirusDevelopmentTeam/papirus-icon-theme) which is GPL-3 licensed.

[Frankenpod]

Well, got a top level tile/icon menu working, but when I try to implement the next level down, it all goes wonky.  It works for that level menu, but you can no longer get the text menus for the level below that - it carries on trying to use the second-level menu icons for everything, and I can't figure out why it's doing that.

I have this code in there:


# if we are on the settings screen, draw the list using viewport 'set'
%?if(%cs, =, 6)<%Lb(set,60,60,tile)%Vd(titlebar)>


# Settings menu viewport
%Vl(set,0,0,60,60,1)
%xl(N,ICONS60x60_SET_whte.bmp,0,0,7) # normal icons
%xl(T,ICONS60x60_SET_whte_S.bmp,0,0,7) # selected icons
%?Lc<%xd(T, %LN)|%xd(N, %LN)> # highlights selected icons

But despite that first conditional statement, it still tries to use that settings viewport/menu in place of all the subsequent lower-level menus, ie.g. the theme selection menu.  Can't work out why it is doing that.

Edit - ah, so once you go into a submenu, e.g. the "Settings" menu, all the menus below that one (e.g. the "Theme settings" sub-sub-menu) have the same %cs number (6, in the case of the settings menu).  Not sure how you deal with that.  Even the 'theme list' returns the same value for %cs.

[Frankenpod]

Gotten it to work up to a point, but the theme engine seems to have a lot of undocumented/inconsistent behaviour.  Can't get the labelled menu viewport thing to work, so can't get the "settings" menu to be centred in the display.

[Frankenpod]

Was trying to get the "settings" menu look more like this, but if I try to do that by creating different labelled %Vi menus with different positions/dimensions, it insists on using the wrong one - or, rather, weirdly, it uses the dimensions of the main one with the content of the sub-menu one, no matter what I do.