Percentile bar graphs :P

[Visvalor]

Ok so far got most of what I want to do done XD anyone have an idea how to set up an image so that it either moves with a variable or only X% is displayed based on a variable?

The idea is to use it for hp/sp bars, skill or base exp bars, etc. It'll go up and down based on stat points and onclick events to raise a hidden abilityscore that will then make an image move into visibility or maybe view a percentage of it...

ideas?

[Foen]

If you just want a solid colour, then you might use a genericcontrol with a solid frame and resize it (setAnchoredWidth and setAnchoredHeight).

Foen

[Visvalor]

Oooo so set up a small generic control and every time a variable goes then have it add to the anchored width... that's not a bad idea =D

Thanks XD! I'm not 100% sure how to do it could you toss me an example real quick :P?

window.test.setAnchoredWidth()+1 o.O?

[Foen]

local w,h = window.test.getSize();
window.test.setAnchoredWidth(w+1);

This only works for controls where the width is set using an anchor on one side and a size/width parameter. It won't resize something set using a bounds tag.

Also the size change is in pixels, so you might want to use an increment bigger than one.

[Visvalor]

Ahh that makes sense :D I'll have to come back to this later for the hp sp bars ^_^

[Valarian]

Or perhaps something similar to the ammo counter? With a line of dots that gradually decreases. Each dot representing a proportion of the HP score, possibly each dot represents 10% and have a line of 10 dots.

[Brenn]

You could do this with widgets and probably more efficiently. All the same color, side by side...

[Foen]

I have created a status bar extension and posted it to the FG Wiki (https://oberoten.dyndns.org/fgwiki/index.php/Status_Bars). It has been written for the standard 3.5E ruleset (not Foundation+3.5E, nor JPG 3.5E) but can be copied to other rulesets as needed.

The extension has a couple of templates and some frame definitions (for different coloured bars), and status bars can be used as follows:


<StatusBar name="...">
<bounds> ... </bounds>
<reverse/>
<frame> ... </frame>
<link> ... </link>
<maxlink> ... </maxlink>
</StatusBar>

The dimensions of the status bar determine if it is horizontal (width exceeds height) or vertical (height exceeds width). The size of the bar is the 'full' size (when current value = max value) and it draws a bar within this to indicate the proportion (current/max).

A horizontal bar fills from left to right and a vertical bar fills from bottom to top, but this can be reversed using the <reverse/> tag.

The frame tag is used to specify the fill background. The extension comes with eight pre-defined frames (redbar, greenbar, whitebar, bluebar, blackbar, yellowbar, greybar and pinkbar), but there is nothing to stop any frame being used. If left empty, it defaults to rowshade.

The link tag dictates the source of the current value, and the maxlink tag dictates the source of the maximum value. These are node paths relative to the parent window.

If no link or maxlink is specified, the StatusBar can be controlled from script:

setValue(num), setMaxValue(num) - sets the numeric value for the current and maximum of the status bar
getValue(), getMaxValue() - returns these parameters
setLink(path), setMaxLink(path) - allows the source nodes to be set dynamically.


The attached screen-shot shows the status bar demo for 3.5E.

Stuart

[Visvalor]

Hehehe neat ;D!