Grid View EmulationStation Mod Ideas

lilbud

@jacobfk20 So in the theme.xml, we can manually set a grid size and ES will automatically fit the grid?

herb_fargus

@jacobfk20 thanks for fixing that.

There are more or less two methods to build the grid as you said

define a max size for each boxart
define a grid of rows/columns and just have the boxart adapt accordingly
or a hybrid of both where you can define a grid and set a max size/ or dimension for each box art.

This is also assuming that the grid container can be defined and the grid configs will work within those constraints.

Eg if I've got a header/footer in my theme I should be able to define a 6x4 grid whether the container is the full screen or scaled down to fit within the header and footer

Then as an added theming option you could have a padding option between images in the grid so that they are touching or have a gap between each game (around all 4 edges) which i guess is sorta related to defining a max size/dimension for boxart

Also the dimension issue is why I use screenshots for my art with gridview

jacobfk20

@lilbud It is only an idea right now. But it's one of my ultimate goals currently.

@herb_fargus If I go with setting the grid to a set row and column then I'd like to add different sizes the themer could set up. like:
<container name="grid_setCells_default"> 6 4 </container> // This would be the default size
<container name="grid_setCells_big"> 4 2</container> // This is if user selects a bigger size.

Maybe have small, medium, and large instead of the current 0-15p option in UI settings.

herb_fargus

@jacobfk20 yeah I like that idea a lot. The simpler the better I would think

To simplify the function couldn't you just have a size tag like <size>small/med/big</size>

mattrixk

I like this idea:

set the size and position of the overall grid container.
set the number of tiles in the grid (eg specify 6x4 for small tiles, 4x3 for medium tiles, 3x2 for large tiles).
set the padding around the tiles for the background image.
set the margin between the tiles.
that let's the system set the size and placement of each tile within the set container, based on what you've specified.

Arcuza

@lilbud said in Grid View EmulationStation Mod Ideas:

@mattrixk First, I redid it. Second, I got the outline working.

Third, I updated the Material theme to have this change.

That screenshot is just so darn beautiful! I want to have it exactly like that! Please provide details how to switch layout when you guys are finished doing your magic...

lilbud

@mattrixk Would this be possible?

lilbud

@Arcuza I think I updated the theme to look like that.

mattrixk

@lilbud said in Grid View EmulationStation Mod Ideas:

@mattrixk Would this be possible?

I have no idea, but it sounds like it might be, given what @jacobfk20 and @herb_fargus were talking about. One can hope.

jacobfk20

@lilbud It's what I'm currently working on. I am taking my time on it though...

I've noticed that if anyone uses <color> or <padding> with any ninepatch element then your theme will no longer work on the master branch of ES. I added in these theme options and are not available on upstream. I will change the tilegrid_background element to an Image instead of a ninepatch in the next build. It will take ninepatch still, but change Ninepatch to Image for compatibility with the master branch. Image does not do <padding>

I will also start adding MetaData elements to gridview slowly over updates.

jacobfk20

@lilbud Just in case you don't miss it, I posted a debug version of ESG that may give me a little bit more info on what is causing that assertion fail. Here is a link to the file.

lilbud

@jacobfk20 How will it spit out info?

jacobfk20

On both the terminal and the log.

Zigurana

@jacobfk20 said in Grid View EmulationStation Mod Ideas:

On both the terminal and the log.

Hey, quick question : what is your ES dev work flow like? What IDE & OS are you using for coding, and for building? Sorry to derail your topic like this, but you just seem so damn productive!

jacobfk20

@Zigurana Nothing special. Windows 10 and Visual Studio 2015 then I send and compile on a Pi 3 over sftp/ssh. I've also become familiar with most of ES's source over the past couple months and know my way around it. I also really like this project, so I can easily burn an afternoon working on it.

jacobfk20

Alright everyone, sorry for a long wait but I think I finally got this update to almost behave how it should. The list is small-- but there was a lot that had to be done to get these things going.

you can now assign how many columns and rows a grid has and it will try to make the tiles fit inside the size you set.
MetaData should now be accessible (Same names as Detail View)
Gridtile_background is now an <image> for backwards compatibility with upstream. (It's still a ninepatch as well)

Change the grid's rows and column size with
<container name="gridRowsAndColumns"><size>4 2</size></container>
It will default to 4 2 if it is not defined.

As always you can grab it on my drive.

Some thoughts:
I'm sure it sometimes doesn't keep the image's aspect ratio when it resizes the grid tiles. Someone let me know if it looks off to you.
There is a forced padding and I may keep it as it's sort of a fail safe to make sure tiles don't go into each other.
Adding margin will shrink the images. This makes sense because it has to fit the tiles into a smaller space.
Set Gridmod size to 0p in UI settings! This will also be removed in next update.

Again, I haven't had much time to test so I'm not sure if anything is broken or not. A lot had to be changed to make the grid build off of theme defined rows and columns. Please let me know of anything that is broken as soon as you can :)

Thanks guys!

mattrixk

@jacobfk20 That sounds fantastic mate. Well done. I'll hopefully have a chance to check it out tonight.

Will there be (at some point the future) the option of setting different grid sizes (eg: 6x4, 5x3, 4,2) for small, medium, large so the user still has a bit of a choice? I understand you'd want to do lots of testing on just one grid size first before making others, but it seems like it could be an awesome addition (obviously I have no idea how much work it would actually be to implement).

jacobfk20

Next Update. Mostly just minor fixes. Most time was spent on fixing the aspect ratio not being kept on tile scale.

Updated gridview theme help to include changes.
Gridtile color tween now fully works.
Better respect to game art aspect ratio
Better tile resizing to fit within grid size
Grid will resize itself better within its size
Grid rows and columns can now be defined from <small, normal, big>

Get latest build here rpi (arm) and x86 available.

Arcuza

@jacobfk20 Is this to be released and bundled with Retropie soon? I can't wait ;)

herb_fargus

@jacobfk20 Looks good so far, I like the flexibility of it all. Working on adapting some themes for testing.

The two things off the top of my head from initial testing are thus:

The game titles need an animation so they can be read (which I know is on your todo list)
For the carbon theme I'm centering the grid but the position of the the container seems to be left aligned (e.g. the boxart will grow off the left side of the screen but will have a gap on the right side of the screen) it would be nice to either have an option in the theme for alignment of the grid containers unless I missed a theming option somewhere for that.