UI updates?

[54x]

Hey all,

Having familiarised myself sufficiently with C++, I'm thinking an excellent place to start contributing code would be where I'm familiar- in UI development.

I wanted to run my thoughts by everyone to see if they'd step on any toes before starting, but in essence, what I'd like to do is update the options screen, and expose all those "hidden" options in the .cfg file to the user so they can be changed on the fly.

This has a few steps:

1) Implement some modern UI concepts in a way that fits the graphical lexicon of XCOM and OpenXcom. I'm talking check boxes, radio buttons, sliders, (for setting things like volume or animation speed) and most importantly in terms of updating the options screen, a tab interface. Mostly this will involve changing draw routines in existing controls, but the last two will take some extra coding. This will probably be where the majority of the time sink is, and will mostly involve translating graphics into hardcoded draw routines, seeing we don't appear to have external image loading yet.
2) Draft the new layout in paint shop pro. (as it happens, I've already completed this step in terms of the basic options screen in order to think about what I'd need to do, see my attachment)
3) Translate that draft into code.
4) Add some future proofing UI features, such as a container surface for groups of radio buttons, (or even just a list control that takes parameters to automatically add radio buttons) a scrollable text list that incorporates a scrollbar, an unscrollable text list, a combo box for setting the display resolution, etc... All of this should make it easier to make changes in the future, or to add new UI screens that might benefit from them, for example a new crew-ordering screen.

My draft idea should not only give us about six tabs to work with in terms of space for options, but also have more room on each screen, as the UI elements I'd implement take up less space than the current approach of using a text button for almost everything, and needing several grouped text buttons in order to present a continuous range where a slider would be very efficient. (although I don't think I'll be making graphical buttons until such time as we can load PNGs to use for buttons, because hardcoding each different graphic sounds very annoying)

Does this sound like something relatively useful?

[Volutar]

It looks messed.. because of mixture with background. Background sould be "dimmed" like lines in selection lists.

[54x]

It looks messed.. because of mixture with background. Background sould be "dimmed" like lines in selection lists.

Don't worry about the background, that's not its actual colour, I was just trying to approximate it from the source file without having the actual colours to hand. The background will stay the same as it is currently.

The important bit is the composition of the UI elements- does the tab UI make sense, are the sliders useful, etc...

edit: If it helps I've switched out a version with a less saturated green.

[xracer]

I like the idea, of ocurse the colors and background could be imporved but overall i like it.

I do think however that you could make the resolution a slider also to keep it uniform, it could de done with like set points and placed on the bottom.

Also could you present your idea on the GUI of the other tabs?

[R]

I do think however that you could make the resolution a slider also to keep it uniform, it could de done with like set points and placed on the bottom.

Rather then a slider, I would make it a drop down list.  Also some features must be selected at the start of each game and shouldn't be changed during the game for gameplay reasons.

Other then the details how each feature must be represented, the concept of updating the options screen has merit.  But keep in mind that it is for post 1.0 and the head developers still have to decide what direction openxcom will take after completing their main goal:  Creating an open source reimplementation of xcom 1.

[54x]

I like the idea, of ocurse the colors and background could be imporved but overall i like it.

I do think however that you could make the resolution a slider also to keep it uniform, it could de done with like set points and placed on the bottom.

Also could you present your idea on the GUI of the other tabs?

On drafting: OK, it took a couple hours, but here they are- attached. I've done the battle options in the current battlescape style- ideally I'd want to code it so that you can set all the options on the battlescape. I made the background for the geoscape options blue purely so I could make it readable- I'm having difficulty recolouring it to the way it is in OpenXcom.

The background for the basic options screen is the current OpenXcom background, I just haven't bothered to sort out how it's pallette-shifted seeing the image is a working document. I have no preference for what the background is actually set to and it doesn't much impact what I'd do to revamp the screen, as I'd be re-coding it, not drawing it in PSP. All the UI elements I'm drawing match the options screen exactly in terms of the colours they use.

The resolution will eventually be a combo box, however as that won't save much space over what it is currently, I didn't bother drafting what that would look like. However, I did end up making a potential small combo box for the mouse drag button option, so imagine a larger version being used for resolution, with the arrow buttons changing default resolutions, and you being able to edit the value manually by clicking the text..

Rather then a slider, I would make it a drop down list.  Also some features must be selected at the start of each game and shouldn't be changed during the game for gameplay reasons.

Other then the details how each feature must be represented, the concept of updating the options screen has merit.  But keep in mind that it is for post 1.0 and the head developers still have to decide what direction openxcom will take after completing their main goal:  Creating an open source reimplementation of xcom 1.

Yep, I had thought of that. I'd imagined we could just recolour locked options red, and allow them to be changed for next session. Ideally locked options would be able to reload during the transition between the geoscape and battlescape.

As above a combo box is the correct control to use- anything else would lose functionality from what we currently have.

Potentially anything that should stay the same during the entire game and doesn't just require the game to refresh to load it in should be in its own tab- I was thinking "hot grenades" and "custom starting base" should be there, as ideally they should be enabled if you want them before you start your game.

edit: As for updating the options screen being post 1.0, I don't really agree. Everything that's not a mod should be exposed through the options screen to the user as soon as someone is willing to code the changes. Also, I'm the one volunteering to code the changes- I'll prepare all of this and then do a pull request. But I want to be sure it makes sense to do it and the devs are okay with the idea before I start several hours work coding UI features that draw nicely through SDL.

[darkestaxe]

I think it really looks good. If these controls can be easily used in other parts of the program, like the equip screen etc I think it's fucking awesome.

With tapped panes it seems to me there would be a bit problem with matching existing graphics and aspect ratios to the altered and slightly shorter frame that has a tab bar above it. Nevertheless I think tabbed panes are a really good thing when used judiciously.

[hsbckb]

I propose to add the "reset to default" button. Default means the settings of the original X-com game.

[Volutar]

I wouldn't suggest "default means original xcom".
Just because original is original, and openxcom has alot of yummy options which better to be enabled "by default".
So either no default at all, or two options - default and classic.

[hsbckb]

So either no default at all, or two options - default and classic.

I vote for two options - default and classic.

[Yankes]

I vote for two options - default and classic.

+1

54x there is possible to made background darken in someplace, It can be used to have better contrast around controls.

[54x]

I think it really looks good. If these controls can be easily used in other parts of the program, like the equip screen etc I think it's fucking awesome.

With tapped panes it seems to me there would be a bit problem with matching existing graphics and aspect ratios to the altered and slightly shorter frame that has a tab bar above it. Nevertheless I think tabbed panes are a really good thing when used judiciously.

Yep any of these controls could theoretically be used anywhere in the game if coded there. I'll implement the UI elements, some from simple substitutions to the existing framework, and a couple with extra code. Then we can put tabs, combo boxes, check boxes, radio button groups, sliders, etc... anywhere we like, and ideally recolourable the same way buttons are to camouflage with the myriad background screens of XCOM.

I propose to add the "reset to default" button. Default means the settings of the original X-com game.

That's possible, but we might run into spacing issues with two default buttons as proposed below. Remember, in battlescape mode there's already three buttons down the bottom. What I'd probably do when I start coding that is add a "Reset" button, which pops up a confirmation box with a couple radio buttons on it for original game settings and user-friendly default settings.

+1

54x there is possible to made background darken in someplace, It can be used to have better contrast around controls.

vs the mockup images I provided, or compared to OpenXcom at the moment?

Of the images I've posted, only the battle options one uses a "real" background with colours roughly as they'll appear in OpenXcom. The other options screens are just me approximating so you don't have to look at a blank background and say "that doesn't look like an Xcom UI", when it will look exactly like the current one when I'm finished, but with new UI elements it their new positions, or thereabouts.

If you want me to darken it compared to the current game, I'm not planning to figure out how to change the entire game from using paletted images to using rgb colours. That would be a bit much, and I'd need to be able to break out from the relevant palettes to darken it compared to the current game. If someone wants to replace all the bits that rely on palettes and let me set a colour scheme in RGB myself, I can totally play around with aesthetics for you



I should also warn that this week is really busy for me (I'm probably interviewing for a promotion, and I've been standing in for my boss while he is pulled off into some other work) so I won't be able to code until the weekend, if then.

[Yankes]

54x I mean using current "tech" to made part of image darken, exactly same way how we have night missions. It will be simple function that will reduce brightness  part of screen using index shift of every pixel in that place.

[54x]

54x I mean using current "tech" to made part of image darken, exactly same way how we have night missions. It will be simple function that will reduce brightness  part of screen using index shift of every pixel in that place.

From what I'm aware of the background images are stored in a sixteen-gray palette, which is then shifted to a sixteen-colour section of the relevant palette. I don't think there's room for darkening in that equation is there?

[pmprog]

You could always shift down the palette - effectively making it a 12 or 14 colour palette; and anything else just draws black

ie, say 16 = white, 8 = mid-gray, and 0 = black; for each pixel, index = index - 4 (darken). If index < 0 then index = 0 (min is black)