feat: Settings Screen Redesign

[ShadowCat117]

Final Textures

• Filter by categories.
• Config widgets are now a consistent size. Uses scrolling text if too small.
• Export and import configs for all or just selected configurable.
• Searching will show features from selected category first, followed by any matching features from other categories.
• Selecting a feature with a matching config option to the search query will scroll to make that config option instantly visible.
• Quickly enable/disable features via checkbox.

SettingsScreenRedesign.mp4

[ShadowCat117]

See above for updated version.

Settings screen

• True scrolling, no longer pages.
• Filter by categories.
• Searching will show features from selected category first, followed by any matching features from other categories.
• Config options matching search query will be shown by number following feature name.
• Selecting a feature with a matching config option to the search query will scroll to make that config option instantly visible
• Quickly enable/disable features via checkbox.
• Import and export settings.

SettingsRedesign.mp4

[magicus]

@JamieCallan117 This looks like major improvements in usability!

[ShadowCat117]

No longer in this pr, was added in #2502

Overlay Selection screen

• Search bar to search for an overlay.
• Filter by built-in or custom. (Info boxes/custom bars)
• Edit configurables on this screen.
• Preview overlay, with option to hide other overlays in preview.
• Buttons to add new info boxes and custom bars. (Commands still exist)
• Newly added overlays are automatically set as selected for instant edit access.
• Shift-Right click an info box/custom bar in list to delete it.
• Selected overlay, filter type and scroll position is persisted between screens.

OverlaySelectionRedesign.mp4

[magicus]

These changes all look great! I am very happy to see that you're taking the time needed to make these improvements.

[kristofbolyai]

Up to you, but I have one idea for the overlay management screen. Do you think we could add user-specified/optionally custom naming for the custom overlays? It needs a bit of background work before we could do it though.

[kristofbolyai]

Also, all of the new designs look beautiful! Thanks for sorting out all the UIs I "quickly" added so we could work on other core parts of the mods.

[Rafii2198]

I don't know if it is the right way, but would simply adding a new config field for all custom overlays called Name would achieve this? The UIs could check if it is set and render what user put there and if it is empty then usual Info Box X for example would be shown instead and perhaps commands could use either the ID or the name if it is possible, that way 3rd party ways like custom screens in my modpack could easily add and manage custom overlays as currently it cannot be done without user input. If it is doable that way, then there would be no losses, I believe, and would be easily changeable when someone makes a typo or just wants to change the name as it is just a normal config field.

[ShadowCat117]

Up to you, but I have one idea for the overlay management screen. Do you think we could add user-specified/optionally custom naming for the custom overlays? It needs a bit of background work before we could do it though.

I have seen this requested a lot so yes it definitely could be done, and as Rafii said, I think a simple config field should get the job done

[ShadowCat117]

The redesign is now going to be done in seperate parts so once a certain area is done it can be merged. This pr will focus on the "Wynntils" area, those being Settings, Overlays and Crowd Sourcing

[ShadowCat117]

No longer in this pr, was added in #2502

Overlay Management Screen

• Option to render preview or just outline with name when editing.
• Option to hide non selected overlays.
• UI buttons can be moved to top/bottom of screen to make placing overlays in those areas easier.
• When rendering previews, a tooltip is shown with the name of the hovered overlay as some do not have a preview, or are not obvious what they are.

OverlayManagementRedesign.mp4

[kristofbolyai]

Just letting you know I started reviewing this, but it is a bit too long to check in a single run. I'll be back.

[kristofbolyai]

Can we fix the button size so the text doesn't overflow?

This UI's scrolling is way too hard with touchpads.

[ShadowCat117]

Can we fix the button size so the text doesn't overflow?

Ah didn't realise there was a config with text long enough to overflow, I'll make it scrolling text as all of the buttons and input widgets are the same size for consistency.

This UI's scrolling is way too hard with touchpads.

It uses the same scrolling as the settings screen which is the same used on tm and poi manager so not sure why that screen specifically wouldn't work well, I can double check the implementation but I don't have a laptop currently set up for me to test it out on

[kristofbolyai]

Scrolling feels good now! Also checked the button sizes, they look good.

[kristofbolyai]

Essentially, this looks good to me, if we can get the textures added.

[magicus]

I've glanced through all code, and studied some parts in more particular. I think this looks good.

[ShadowCat117]

I've removed the overlay and crowd sourcing redesigns as one was added separately and the other I'll do another time as not a fan of how it was done here.

There's also a few other fixes but no major changes from the original but might be worth giving it another review anyway.

I also failed at squashing so can mostly ignore the first ~15 commits

[kristofbolyai]

So do we have textures now, or what happened?

[ShadowCat117]

So do we have textures now, or what happened?

Still no textures, Rafii has started some of them but no promises

[magicus]

I also failed at squashing so can mostly ignore the first ~15 commits

At some points it's easier to make a diff relative to main, and apply that diff to a new branch and create a new PR. I think that is easier than trying to play with git's rewrite functionality. (Rebasing/squashing an open PR is also taboo; that makes the reviews hopeless to follow later on.)

[Rafii2198]

The finished textures