This seems like a complex problem, and I have no idea if it is even possible.
I'm working on a RPG and I'm using dialog boxes at the bottom to display the health and resources of the player hero. However, instead of just using the white square picture to make a rectangle based on the remaining health/energy, I wanted to make it be a circle that darkens clockwise, like a pie graph. Is there a way to do this? Should I try using .SC2layout files instead? Any help would be great.
EDIT: I posted in the art sub-forum and got a solution. To anyone interested, here is the link for anybody wishing to follow this work.
Only way I can think of is with dialog set rotation. You're going to need a custom image in the form of a circular sector with quite a small angle. Probably going to need a number of duplicates of the said image as well so you can make them fan out as the circle "fills" up.
Yeah, I kind of had that idea before, but I know very little about art assets and such. Is it even possible to save an image that isn't rectangular in an art program?
I'd like to show 1% changes because it's a display of the player's health so it needs to be accurate, so making 100 different images would take a lot of time and probably a lot of space lol.
I didn't know it was possible to make parts of an image transparent, I could make a slice with a 3.6 degree angle (1% of a circle) and then make the rest of the square transparent? That would probably do the trick, I just don't know how to do that, but I'll look into it. Thanks!
Fortunately for you, if you need 100 values of precision, all you need to do is have a 100degree arc. SC2 dialogs can rotate on integer values of degrees, so all you need is a base health ring and a cover-up image that you can rotate around it.
Alternatively, make a flash script that does this. If Blizzard added that support in yet.
Bibendus has achieved this by copying the "Flowers of Health" which are circular-petal like representation of a unit's health. I'd ask him.
If you need precision - then a circular 'pie-chart' is not the best way to achieve this.
One way would be to 25 or 50 images, being the 'health circle' from 0% to 100%, and then using a combination of Show/Hide Dialog Item (Image) alongside Set Dialog Item (Transparency), represent the health of characters.
I personally would look into creating a 3d model of a sphere with various animated sequences (going from full coloured and bright red, to dark red and eventually empty). Then have a trigger create this as an actor at a set space relevant to the players camera, and use actor messages for it to display the health of a hero.
Thanks everyone for the responses, as I said I know very little about this stuff, but I don't have photoshop, so I'll see if I can put these ideas to use somehow. Any other advice would be great as well!
Yep, I used just 1 image for all petals and duplicated it with the dialog rotation trigger.
The image must be transparent except for the petal, so you won't have problems placing them in a circle.
To do a transparent compatible image in photoshop you must create an alpha channel.
It's a channel (like red, green, blue color channels) that determine the transparency of each pixel.
To do a simple channel 0/1 alpha channel you can select the area you want to be invisible (it may be the opposite, I don't remember) and do a Save Selection (call it Alpha)
Save the image as TGA and you should be fine.
For more tips on how to make a transparent images you should ask in the art forum, I'm a simple triggerer :P
This seems like a complex problem, and I have no idea if it is even possible.
I'm working on a RPG and I'm using dialog boxes at the bottom to display the health and resources of the player hero. However, instead of just using the white square picture to make a rectangle based on the remaining health/energy, I wanted to make it be a circle that darkens clockwise, like a pie graph. Is there a way to do this? Should I try using .SC2layout files instead? Any help would be great.
EDIT: I posted in the art sub-forum and got a solution. To anyone interested, here is the link for anybody wishing to follow this work.
http://www.sc2mapster.com/forums/development/artist-tavern/33061-solved-need-help-making-1-100th-of-a-circle/#p5
@Edicitsep: Go
Only way I can think of is with dialog set rotation. You're going to need a custom image in the form of a circular sector with quite a small angle. Probably going to need a number of duplicates of the said image as well so you can make them fan out as the circle "fills" up.
@FuzzYD: Go
Yeah, I kind of had that idea before, but I know very little about art assets and such. Is it even possible to save an image that isn't rectangular in an art program?
Or you make a lot of pictures for all states you want to show and always use the fitting image.
There is no good solution because images are always squares.
Your chart might need to be a little bit abstract. Creating the details to display 1% changes would be a lot of work.
I would implement 13 states of the pie chart (like hours of a clock including filled/empty), if I would need to use such a display option.
@Edicitsep: Go Fuzzy's idea is using a square image that has transparent stuff around.
It would be like a slice representing 1 hour on a clock then.
@Ahli634: Go
I'd like to show 1% changes because it's a display of the player's health so it needs to be accurate, so making 100 different images would take a lot of time and probably a lot of space lol.
I didn't know it was possible to make parts of an image transparent, I could make a slice with a 3.6 degree angle (1% of a circle) and then make the rest of the square transparent? That would probably do the trick, I just don't know how to do that, but I'll look into it. Thanks!
create a png with transparent parts and convert it using aorta
Fortunately for you, if you need 100 values of precision, all you need to do is have a 100degree arc. SC2 dialogs can rotate on integer values of degrees, so all you need is a base health ring and a cover-up image that you can rotate around it.
Alternatively, make a flash script that does this. If Blizzard added that support in yet.
@DarkRevenantX: Go
Don't think flash supports been added yet, unless Blizz added it discretely.
@Edicitsep: Go
Assuming you're using photoshop, you may need to play with alpha channels to accomplish transparency.
@Edicitsep: Go
Bibendus has achieved this by copying the "Flowers of Health" which are circular-petal like representation of a unit's health. I'd ask him.
If you need precision - then a circular 'pie-chart' is not the best way to achieve this.
One way would be to 25 or 50 images, being the 'health circle' from 0% to 100%, and then using a combination of Show/Hide Dialog Item (Image) alongside Set Dialog Item (Transparency), represent the health of characters.
I personally would look into creating a 3d model of a sphere with various animated sequences (going from full coloured and bright red, to dark red and eventually empty). Then have a trigger create this as an actor at a set space relevant to the players camera, and use actor messages for it to display the health of a hero.
Thanks everyone for the responses, as I said I know very little about this stuff, but I don't have photoshop, so I'll see if I can put these ideas to use somehow. Any other advice would be great as well!
Yep, I used just 1 image for all petals and duplicated it with the dialog rotation trigger.
The image must be transparent except for the petal, so you won't have problems placing them in a circle.
To do a transparent compatible image in photoshop you must create an alpha channel.
It's a channel (like red, green, blue color channels) that determine the transparency of each pixel.
To do a simple channel 0/1 alpha channel you can select the area you want to be invisible (it may be the opposite, I don't remember) and do a Save Selection (call it Alpha)
Save the image as TGA and you should be fine.
For more tips on how to make a transparent images you should ask in the art forum, I'm a simple triggerer :P
@Bibendus: Go
Alright, I just downloaded the photoshop trial so I'm still figuring out what everything does, thanks for the help!