[SOLVED]How to make a wall-clock like ProgressBar?

[lcy03406]

Hi. Maybe frequently asked, but I cannot search out some answer.
I want to make something to show cooling down spells in a game. I think this could be a ProgressBar covering a static Image. But it seems that ProgressBar can be eithrer horizontal or vertical but not clockwise. How to make a wall-clock like ProgressBar? Or, how to clip an image into triangle with calculated angles?

[songge3604]

I want to make that, too.
help

[scriptkid]

Hi both

That sounds like a very custom requirement. What you want is drawing a 'pie' shape. But since Cegui doesn't support custom drawing internally, my suggestion would be to create a number of images ranging from empty to full. Then, when updating your progress you could show the image (setProperty("set:pies image:<current_progress>") corresponding to the current value, probably with a little alpha blending or such.

For this to work you need your own looknfeel definition, where the imagery consists of a background (for your spell icon) and a foreground(for the progress layer), both with their own property name to refer to.

Hope this puts you into the right direction for a little.

[lcy03406]

Thank you, both
I have written a Falagurd renderer (i call it "ProgressPie") for CEGUI widget ProgressBar, and add a ProgressPie child in my Spell's looknfeel.The only problem is to make the pie in z-order above the icon but below the text. I set the text layer's priority to 1000 and set the ProgressPie's z to 0.001, this does work, but i think it's so ugly using cegui's or falagurd's const numbers to calculate the z and setting z in looknfeel, any better ideas? How to set a child window's z-order between 2 layers of it's parent?

[CrazyEddie]

How to set a child window's z-order between 2 layers of it's parent?

The ability to have the rendering from a child kind of back projected into the parent layer is not something officially supported. Obviously, as you found, in current releases you can force it by using the layer priority hack, but that will almost certainly stop working from 0.7.0 onwards.

There may be a couple of approaches to get what you need, but you'll need to more precisely describe the arrangement of windows you have and their relationships, the arrangement of imagery you have, and the final result you're looking for. Because at the moment, I'm unsure of how you have these things arranged (it seems you have three items (icon, pie and text), but i'm unsure if these are layers of imagery or actual windows, and if they're actual windows are they always used to form a single window, or is there some other arrangement?).

CE.

[lcy03406]

Thank you patient CE!
My spell button is only a <WidgetLook> in looknfeel until yesterday, including a <layer> for background image, a <layer> for spell icon image, a <layer> for text, and a <layer> for some forground decoration image. It's a button, with no child widgets.
And I want the cooldown progress shown between the icon layer and the text layer.
Now i add a child "ProgressPie" widget into the button's looknfeel, and find the child widget drawn on the very forground, above all the 4 layers of the button.

I think maybe i can add the progressbar functionality into my customise "SpellButton" and change the child widget into a layer of image, or, change the text layer and forground layer into actual StaticImage child widgits.

[CrazyEddie]

Yeah, I understand what you want now.

I think the cleanest solution, as you mention, would be to develop a custom "SpellButton" or "ProgressButton", that effectively clones PushButton but adds some elements of the ProgressBar widget. Obviously this seems like more work at the outset.

If you do want to avoid creating the new widget type, and want to fudge it instead, I think that since the progress rendering is to overlay the button imagery having the progress as a child of the button is obviously logical, the issue is then how to get the text to appear over the progress rendering... There are a couple of options, one is to use a third widget - a StaticText is possible, though a little heavyweight - I think I'd use a DefaultWindow in this case. The second option is to have the progress pie itself draw the text - the downside is that you have to set the text on the progress widget instead, though you can use the PropertyLink Falagard element to link a new property on the parent (button) to the Text property of the child (progress).

Hope this gives some ideas of possible alternatives

CE.

[lcy03406]

Yeah, I understand what you want now.

I think the cleanest solution, as you mention, would be to develop a custom "SpellButton" or "ProgressButton", that effectively clones PushButton but adds some elements of the ProgressBar widget. Obviously this seems like more work at the outset.
...
CE.

Not very hard. Only a "CurrentProgress" perporty is necessary. Set the pie drawing (in c++ "render" function) a fine z, <layer>s with higher priority will be above the pie. So I can use looknfeels to define the style of the rest of the button, and draw the pie in c++.
Thank you CE.

[CrazyEddie]

Cool, I'm glad you have a workable solution.