GUI questions

[zimberzimber]

1) How do I replicate the damage numbers effect over a champions health/energy bars?

2) How do I define new GUI elements?

[AndakRainor]

Hi! Short answer to both questions: with GraphicsContext or with GTK

Have you ever used one of those?

[zimberzimber]

I've used GTK, but mostly for the bigger built in windows.
Haven't tried Graphic Context, will do as soon as I have the chance.

[Isaac]

Basically you have a hook that runs every frame, and you use the GUI commands to draw the GUI every frame. The context variable and/or the button regions that you define allow you to interactively change the UI from user input. For example, so you can change the button color when the player hovers the mouse over your button.

I have a simple menu example project I can send when I get home; and/or you can look at John Wordsworth's Menu system.

Damage numbers are easy: Champion:showAttackResult(any, string)

[minmay]

Damage numbers are easy: Champion:showAttackResult(any, string)

That's for showing damage dealt (or misses etc.) by the champions' attacks. zimberzimber was asking about replicating the blood splatter that appears over a champion's health and energy bars when they are damaged. You'll have to do that one from scratch using PartyComponent.onDrawAttackPanel(), I'm afraid.

[zimberzimber]

Y'all forgot to mention the most important part where I have to handle GUI stuff by making a function with all the things I want to be displayed in it, and attach it to one of the parties onDraw hooks through a connector

Thank you all, and I hope I'll figure out the rest

[zimberzimber]

Alright, I figured out mostly everything, there's just one thing -
Different screen sizes will require different offsets/sizes for the GUI element placement, correct?
If so, how would I calculate the right values?

[AndakRainor]

I'm afraid you will need to use MATH !

https://www.youtube.com/watch?v=gENVB6tjq_M

[Isaac]

Damage numbers are easy: Champion:showAttackResult(any, string)

That's for showing damage dealt (or misses etc.) by the champions' attacks. zimberzimber was asking about replicating the blood splatter that appears over a champion's health and energy bars when they are damaged. You'll have to do that one from scratch using PartyComponent.onDrawAttackPanel(), I'm afraid.

This is what I was suggesting, and how I would do it...

Code: Select all

function effect()
	party.party:getChampion(math.random(4)):showAttackResult(tostring(math.random(100)),"DamageSplash")
end

[minmay]

If you use onDrawAttackPanel, the game takes care of scaling for you; you can write your hook pretending that the resolution is always 1920x1080.
If you're using a different hook, then you'll have to do the scaling manually. To match the built-in UI scaling, you'll want to treat a height of 1080 pixels as the 1:1 scale, and scale linearly with height based on that, but never past 1.
Additionally, if the aspect ratio is narrower than 1.3:1, multiply the scale by 0.8. If the aspect ratio is between 1.3:1 and 1.4:1, multiply it by 0.9.
Examples:
For 1440 x 900 the scale should be 900/1080 which is 0.8333...
For 1250 x 900 the scale should be 900/1080*0.9 which is 0.75.
For 1000 x 900 the scale should be 900/1080*0.8 which is 0.6666...
For 4096 x 2160 the scale should be 1.