ig.

UIMeter

new UIMeter()

UI element for recording the value of a property. Tip: Impact++ UIElements are meant to be used for simple user interfaces. If you need something complex, it is recommended that you use the DOM!

Author:
  • Collin Hover - collinhover.com
Source:
Example
// it is easy to create a basic health meter
ig.UIMeterHealth = ig.UIMeter.extend({
     // set the fill to a red color
     fillStyle: 'rgb(255,54,90)',
     // give it a 2% margin so it isn't smooshed against the screen edge
     // ui elements have a default position of top left
     margin: { x: 0.02, y: 0.02 },
     // we can also add animations to the meter
     animSheet: new ig.AnimationSheet( 'media/icons_stats.png', 8, 8 ),
     // set the base size of our animated area (not the bar)
     // the bar has a default size based on ig.CONFIG.ENTITY.SIZE_X and ig.CONFIG.ENTITY.SIZE_Y
     size: { x: 8, y: 8 },
     // and automatically create idle animation from the sheet
     animSettings: true
});
// then spawn an instance of the ig.UIMeterHealth when the player is added to the game
// and update the meter's value whenever the player takes damage or is healed
// which you can do by overriding the player's receiveDamage method

backgroundStyle :String

Bar background fill style (color, pattern, etc).
- set value to '' (empty) for no background

Default Value:
  • rgb(50,50,50)
Source:

bar :Boolean

Whether to draw a dynamic bar.
- because animations are also drawn, this is sometimes unnecessary

Default Value:
  • true
Source:

barAnimSpacing :Number

Space between bar and animation.

Default Value:
  • 1
Source:

barSize :Vector2

Base size of bar, before scaling.

Default Value:
  • 33 x 4
Source:

<readonly> barTotalHeight :Number

Total height of bar.

Source:

<readonly> barTotalWidth :Number

Total width of bar.

Source:

borderSpacing :Number

Space between bar border and fill.

Default Value:
  • 1
Source:

borderStyle :String

Bar border style (color, pattern, etc).

Default Value:
Source:

borderWidth :Number

Bar border width.
- set to 0 for no border

Default Value:
  • 1
Source:

fillStyle :String

Bar fill style (color, pattern, etc).

Default Value:
  • rgb(255,255,255)
Source:

lerp :Number

Percent per frame with which to move current value to new value, between 0 and 1.

Default Value:
  • 0.1
Source:

meterValue :Number

Value of meter, between 0 and 1. Tip: value also affects the frame of current animation.

Default Value:
  • 1
Source:

vertical :Boolean

Whether bar is vertical instead of horizontal.

Default Value:
  • false
Source:

draw()

Draws meter animation and dynamic bar after updating value. Tip: value also affects the frame of current animation.

Source:

rebuild()

Source:

recordResetState()

Source:

resetExtras()

Source:

resize()

Source:

setMeterValue(value)

Updates meter to match value.

Parameters:
Name Type Description
value value of meter between 0 and 1
Source: