- BB.AFX
- BB.Agent2D
- BB.Audio
- BB.AudioAnalyser
- BB.AudioBase
- BB.AudioBufferLoader
- BB.AudioFX
- BB.AudioNoise
- BB.AudioSampler
- BB.AudioSequencer
- BB.AudioStream
- BB.AudioTone
- BB.BaseBrush2D
- BB.BaseMidiInput
- BB.BrushManager2D
- BB.Color
- BB.Detect
- BB.EventEmitter
- BB.FlowField2D
- BB.ImageBrush2D
- BB.LeapMotion
- BB.LineBrush2D
- BB.MathUtils
- BB.MidiDevice
- BB.MidiInputButton
- BB.MidiInputKey
- BB.MidiInputKnob
- BB.MidiInputPad
- BB.MidiInputSlider
- BB.MouseInput
- BB.Particle2D
- BB.Pointer
- BB.Vector2
BB.ImageBrush2D
A brush module for drawing images in a stamp-like style.
Constructor
BB.ImageBrush2D
(
-
[config]
)
-
[config]
Parameters:
-
[config]Object optionalA optional config hash to initialize any of BB.ImageBrush2D's public properties.
Example:
var imageBrush = new BB.ImageBrush2D({ width: 100,
height: 100, src: "some/image.png" });
Properties
_image
Image
protected
default:null
The internal image element used to load and draw to screen.
_lastColor
Object
protected
default:null
An internal variable to check if the color has been changed since the last update().
_lastVariant
String
protected
default:null
An internal variable to check if the variant has been changed since the last update().
_src
String
private
default:null
A private method used by src's getters and setters.
color
BB.Color
default:null
The brush's color.
height
Number
default:10
The brush's height.
hidden
Boolean
default:false
Wether or not to draw the brush to the screen. Toggle this variable to hide and show the brush.
rotation
Number
default:0
The brush's rotation in degrees. This property is not always used with each brush variant.
src
String
default:null
The brush's image src. Functionally equivalent to the src property of an Image element. When src is not null no variants are used (i.e. the variant property is set to null).
type
String
default:"image"
The type of brush. This property should be treated as read-only.
variant
String
default:null
The current brush variant.
variants
Array
An array of all supported variants. For the BB.ImageBrush2D class these are a list of pre-made SVGs with programmatic control for changing their color.
width
Number
default:10
The brush's width.
x
Number
default:0
The brush's x position.
y
Number
default:0
The brush's y position.
Methods
draw
(
-
context
)
-
context
Draws the brush to the context. Usually called once per animation frame.
Parameters:
-
contextObjectThe HTML5 canvas context you would like to draw to.
scale
(
-
amount
)
-
amount
Multiplies width and height properties by amount.
Parameters:
-
amountNumberAmount to scale width and height by
Example:
var brush = new BB.BaseBrush2D({ width: 50, height: 100 });
brush.scale(2);
brush.width // 100
brush.height // 200
update
(
-
controllerModule
)
-
controllerModule
Update method. Usually called once per animation frame.
Parameters:
-
controllerModuleObjectAn object with x and y properties and optionally an isDown boolean (used for beginning and ending strokeds/marks).
Example:
var mouseInput = new BB.MouseInput(document.getElementById('canvas'));
var pointer = new BB.Pointer(mouseInput);
var brush = new BB.ImageBrush2D();
// called once per animation frame (from somewhere else in your app)
function update() {
mouseInput.update();
pointer.update();
brush.update(pointer); // update the brush using the pointer
}