Class R.rendercontexts.RenderContext2D
Extends
R.rendercontexts.AbstractRenderContext.
All 2D contexts should extend from this to inherit the
methods which abstract the drawing methods.
Defined in: rendercontext2d.js.
Constructor Attributes | Constructor Name and Description |
---|---|
R.rendercontexts.RenderContext2D(name, surface)
Create a new instance of a 2d render context.
|
Field Attributes | Field Name and Description |
---|---|
Text align center
|
|
Text align end of stroke
|
|
Text align left
|
|
Text align right
|
|
Text align start of stroke
|
|
Text baseline alphabetic
|
|
Text baseline bottom of em square
|
|
Text baseline hanging ideograph
|
|
Text baseline ideographic bottom
|
|
Text baseline middle of em square
|
|
Text baseline top of em box
|
|
Text style italic
|
|
Text style normal
|
|
Text style oblique
|
|
Bold text weight
|
|
Light text weight
|
|
Normal text weight
|
- Fields borrowed from class R.struct.Container:
- EMPTY
Method Attributes | Method Name and Description |
---|---|
add(obj)
Add an object to the context.
|
|
arcTo(point1, point2, radius)
Draw an arc from the current point to the specified point.
|
|
bezierCurveTo(cPoint1, cPoint2, point)
Draw a bezier curve from the current point to the specified point.
|
|
cleanUp()
Clean up the render bins after cleaning up the contained objects.
|
|
drawArc(point, radius, startAngle, endAngle, ref)
Draw an un-filled arc on the context.
|
|
drawCircle(point, radius, ref)
Helper method to draw a circle by calling the #drawArc method
with predefined start and end angle of zero and 6.28 radians.
|
|
drawElement(ref)
Draw an element on the context
|
|
drawFilledArc(point, radius, startAngle, endAngle, ref)
Draw a filled arc on the context.
|
|
drawFilledCircle(point, radius, ref)
Helper method to draw a filled circle by calling the #drawFilledArc method
with predefined start and end angle of zero and 6.28 radians.
|
|
drawFilledPolygon(pointArray, ref)
Draw an filled polygon on the context.
|
|
drawFilledRectangle(rect, ref)
Draw a filled rectangle on the context.
|
|
drawFilledRegularPolygon(sides, center, radius)
Draw an un-filled regular polygon with N sides.
|
|
drawImage(rect, image, srcRect, ref)
Draw an image on the context.
|
|
drawLine(point1, point2, ref)
Draw a line on the context.
|
|
drawPoint(point, ref)
Draw a point on the context.
|
|
drawPolygon(pointArray, ref)
Draw an un-filled polygon on the context.
|
|
drawPolyline(pointArray, ref)
Draw a non-closed poly line on the context.
|
|
drawRectangle(rect, ref)
Draw an un-filled rectangle on the context.
|
|
drawRegularPolygon(sides, center, radius)
Draw an un-filled regular polygon with N sides.
|
|
drawSprite(sprite, time, dt, ref)
Draw a sprite on the context.
|
|
drawText(point, text, ref)
Draw text on the context.
|
|
endPath()
End a path.
|
|
fillPath()
Fill a path using the current fill style.
|
|
Get the color assigned to the context background.
|
|
Get the bounding box for the rendering context.
|
|
Get the class name of this object
|
|
Get the current fill style of the context.
|
|
getFont()
Get the font currently being used to render text
|
|
Get the alignment of the font
|
|
Get the font baseline
|
|
Get the font size
|
|
Get the renderable style of the font
|
|
Get the weight of the font to be rendered to the context
|
|
Get the height of the context drawing area.
|
|
getImage(rect)
Capture an image from the context.
|
|
Get the current line style for the context.
|
|
Get the current line width for drawing paths.
|
|
Get the normalized font string used to describe the style.
|
|
Get the current transform position (translation) relative to the viewport.
|
|
Get the render position relative to the world
|
|
Get the render rotation relative to the world
|
|
Get the render scale relative to the world
|
|
Get the current transform rotation.
|
|
Get the X scaling factor of the current transform.
|
|
Get the Y scaling factor of the current transform.
|
|
getTextMetrics(text)
Get a rectangle that will approximately enclose the text drawn by the render context.
|
|
Get the current transformation matrix.
|
|
getWidth()
Get the width of the context drawing area.
|
|
lineSeg(point)
Used to draw line segments for polylines.
|
|
lineTo(point)
Draw a line from the current point to the point specified.
|
|
moveTo(point)
Move the current path to the point sepcified.
|
|
Pop the current transformation matrix.
|
|
postRender(fn)
A rendering function to perform in world coordinates.
|
|
Push the current transformation matrix.
|
|
putImage(imageData, point, ref)
Draw an image, captured with #getImage, to
the context.
|
|
quadraticCurveTo(cPoint, point)
Draw a quadratic curve from the current point to the specified point.
|
|
release()
Releases the object back into the object pool.
|
|
remove(obj)
Remove an object from the render context.
|
|
render(time, dt)
Called to render all of the objects to the context.
|
|
renderBin(bin, objs, time, dt)
Render all of the objects in a single bin, grouped by z-index.
|
|
setBackgroundColor(color)
Set the background color of the context.
|
|
setFillStyle(fillStyle)
Set the fill style of the context.
|
|
setFont(font)
Set the font to use when rendering text to the context.
|
|
setFontAlign(align)
Set the font alignment for the context
|
|
setFontBaseline(baseline)
Set the baseline of the renderable font
|
|
setFontSize(size)
Set the size of the font being used to render text
|
|
setFontStyle(style)
Set the style of the renderable font
|
|
setFontWeight(weight)
Set the rendering weight of the font
|
|
setHeight(height)
Set the height of the context drawing area
|
|
setLineStyle(lineStyle)
Set the line style for the context.
|
|
setLineWidth(width)
Set the line width for drawing paths.
|
|
setPosition(point)
Set the current transform position (translation) relative to the viewport.
|
|
setRenderTransform(position, rotation, scale)
Set the transformation of the world.
|
|
setRotation(angle)
Set the rotation angle of the current transform.
|
|
setScale(scaleX, scaleY)
Set the scale of the current transform.
|
|
setTransform(matrix)
Set the current transformation using a matrix.
|
|
setWidth(width)
Set the width of the context drawing area.
|
|
sort()
Sorts objects by their {@link R.objects.Object2D#getZIndex z-index}.
|
|
sortFn(obj1, obj2)
Sort the objects to draw from objects with the lowest
z-index to the highest z-index.
|
|
Start a path.
|
|
Stroke a path using the current line style and width.
|
|
swapBins(obj, oldBin, newBin)
Swap the zBin that the object is contained within.
|
- Methods borrowed from class R.rendercontexts.AbstractRenderContext:
- captureMouse, captureTouch, destroy, getContextData, getExpandedViewport, getMouseInfo, getSurface, getTouchInfo, getViewport, getWorldBoundary, getWorldPosition, getWorldRotation, getWorldScale, isStatic, removeAtIndex, renderObject, reset, resetTransformStack, setStatic, setSurface, setupWorld, setViewport, setWorldBoundary, setWorldPosition, setWorldRotation, setWorldScale, uncaptureMouse, uncaptureTouch, update
- Methods borrowed from class R.struct.Container:
- addAll, append, clear, clone, concat, contains, filter, forEach, fromArray, get, getAll, getObjects, getProperties, insert, iterator, reduce, replace, replaceAt, size, subset, toXML
- Methods borrowed from class R.engine.BaseObject:
- addEvent, addEvents, getElement, jQ, removeEvent, setElement, triggerEvent
- Methods borrowed from class R.engine.PooledObject:
- clearObjectDataModel, getId, getName, getObjectDataModel, isDestroyed, setName, setObjectDataModel, toString
Class Detail
R.rendercontexts.RenderContext2D(name, surface)
Create a new instance of a 2d render context.
- Parameters:
- name
- {String} The name of the context
- surface
- {HTMLElement} The element which represents the surface of the context
Field Detail
FONT_ALIGN_CENTER
Text align center
FONT_ALIGN_END
Text align end of stroke
FONT_ALIGN_LEFT
Text align left
FONT_ALIGN_RIGHT
Text align right
FONT_ALIGN_START
Text align start of stroke
FONT_BASELINE_ALPHABETIC
Text baseline alphabetic
FONT_BASELINE_BOTTOM
Text baseline bottom of em square
FONT_BASELINE_HANGING
Text baseline hanging ideograph
FONT_BASELINE_IDEOGRAPHIC
Text baseline ideographic bottom
FONT_BASELINE_MIDDLE
Text baseline middle of em square
FONT_BASELINE_TOP
Text baseline top of em box
FONT_STYLE_ITALIC
Text style italic
FONT_STYLE_NORMAL
Text style normal
FONT_STYLE_OBLIQUE
Text style oblique
FONT_WEIGHT_BOLD
Bold text weight
FONT_WEIGHT_LIGHT
Light text weight
FONT_WEIGHT_NORMAL
Normal text weight
Method Detail
add(obj)
Add an object to the context. Only objects
within the context will be rendered. If an object declared
an afterAdd() method, it will be called after the object
has been added to the context.
- Parameters:
- obj
- {R.engine.BaseObject} The object to add to the render list
arcTo(point1, point2, radius)
Draw an arc from the current point to the specified point.
- Parameters:
- point1
- {R.math.Point2D} Arc point 1
- point2
- {R.math.Point2D} Arc point 2
- radius
- {Number} The radius of the arc
bezierCurveTo(cPoint1, cPoint2, point)
Draw a bezier curve from the current point to the specified point.
- Parameters:
- cPoint1
- {R.math.Point2D} Control point 1
- cPoint2
- {R.math.Point2D} Control point 2
- point
- {R.math.Point2D} The point to draw to
cleanUp()
Clean up the render bins after cleaning up the contained objects.
drawArc(point, radius, startAngle, endAngle, ref)
Draw an un-filled arc on the context. Arcs are drawn in clockwise
order.
- Parameters:
- point
- {R.math.Point2D} The point around which the arc will be drawn
- radius
- {Number} The radius of the arc in pixels
- startAngle
- {Number} The starting angle of the arc in degrees
- endAngle
- {Number} The end angle of the arc in degrees
- ref Optional
- {R.engine.GameObject} A reference game object
drawCircle(point, radius, ref)
Helper method to draw a circle by calling the #drawArc method
with predefined start and end angle of zero and 6.28 radians.
- Parameters:
- point
- {R.math.Point2D} The point around which the circle will be drawn
- radius
- {Number} The radius of the circle in pixels
- ref Optional
- {R.engine.GameObject} A reference game object
drawElement(ref)
Draw an element on the context
- Parameters:
- ref
- {R.engine.GameObject} A reference game object
drawFilledArc(point, radius, startAngle, endAngle, ref)
Draw a filled arc on the context. Arcs are drawn in clockwise
order.
- Parameters:
- point
- {R.math.Point2D} The point around which the arc will be drawn
- radius
- {Number} The radius of the arc in pixels
- startAngle
- {Number} The starting angle of the arc in degrees
- endAngle
- {Number} The end angle of the arc in degrees
- ref Optional
- {R.engine.GameObject} A reference game object
drawFilledCircle(point, radius, ref)
Helper method to draw a filled circle by calling the #drawFilledArc method
with predefined start and end angle of zero and 6.28 radians.
- Parameters:
- point
- {R.math.Point2D} The point around which the circle will be drawn
- radius
- {Number} The radius of the circle in pixels
- ref Optional
- {R.engine.GameObject} A reference game object
drawFilledPolygon(pointArray, ref)
Draw an filled polygon on the context.
- Parameters:
- pointArray
- {Array} An array of R.math.Point2D objects
- ref Optional
- {R.engine.GameObject} A reference game object
drawFilledRectangle(rect, ref)
Draw a filled rectangle on the context.
- Parameters:
- rect
- {R.math.Rectangle2D} The rectangle to draw
- ref Optional
- {R.engine.GameObject} A reference game object
drawFilledRegularPolygon(sides, center, radius)
Draw an un-filled regular polygon with N sides.
- Parameters:
- sides
- {Number} The number of sides, must be more than 2
- center
- {R.math.Point2D} The center of the polygon
- radius Optional
- {Number} The radius of the polygon. Default: 100
drawImage(rect, image, srcRect, ref)
Draw an image on the context.
- Parameters:
- rect
- {R.math.Rectangle2D} The rectangle that specifies the position and dimensions of the image rectangle.
- image
- {Object} The image to draw onto the context
- srcRect Optional
- {R.math.Rectangle2D} [optional] The source rectangle within the image, if null the entire image is used
- ref Optional
- {R.engine.GameObject} A reference game object
drawLine(point1, point2, ref)
Draw a line on the context.
- Parameters:
- point1
- {R.math.Point2D} The start of the line
- point2
- {R.math.Point2D} The end of the line
- ref Optional
- {R.engine.GameObject} A reference game object
drawPoint(point, ref)
Draw a point on the context.
- Parameters:
- point
- {R.math.Point2D} The position to draw the point
- ref Optional
- {R.engine.GameObject} A reference game object
drawPolygon(pointArray, ref)
Draw an un-filled polygon on the context.
- Parameters:
- pointArray
- {Array} An array of R.math.Point2D objects
- ref Optional
- {R.engine.GameObject} A reference game object
drawPolyline(pointArray, ref)
Draw a non-closed poly line on the context.
- Parameters:
- pointArray
- {Array} An array of Point2D objects
- ref Optional
- {R.engine.GameObject} A reference game object
drawRectangle(rect, ref)
Draw an un-filled rectangle on the context.
- Parameters:
- rect
- {R.math.Rectangle2D} The rectangle to draw
- ref Optional
- {R.engine.GameObject} A reference game object
drawRegularPolygon(sides, center, radius)
Draw an un-filled regular polygon with N sides.
- Parameters:
- sides
- {Number} The number of sides, must be more than 2
- center
- {R.math.Point2D} The center of the polygon
- radius Optional
- {Number} The radius of the polygon. Default: 100
drawSprite(sprite, time, dt, ref)
Draw a sprite on the context.
- Parameters:
- sprite
- {R.resources.types.Sprite} The sprite to draw
- time
- {Number} The current world time
- dt
- {Number} The delta between the world time and the last time the world was updated in milliseconds.
- ref Optional
- {R.engine.GameObject} A reference game object
drawText(point, text, ref)
Draw text on the context.
- Parameters:
- point
- {R.math.Point2D} The top-left position to draw the image.
- text
- {String} The text to draw
- ref Optional
- {R.engine.GameObject} A reference game object
endPath()
End a path.
fillPath()
Fill a path using the current fill style.
{String}
getBackgroundColor()
Get the color assigned to the context background.
- Returns:
- {String}
{R.math.Rectangle2D}
getBoundingBox()
Get the bounding box for the rendering context.
- Returns:
- {R.math.Rectangle2D}
{String}
getClassName()
Get the class name of this object
- Returns:
- {String} "R.rendercontexts.RenderContext2D"
{String}
getFillStyle()
Get the current fill style of the context.
- Returns:
- {String}
{String}
getFont()
Get the font currently being used to render text
- Returns:
- {String}
{String}
getFontAlign()
Get the alignment of the font
- Returns:
- {String}
{String}
getFontBaseline()
Get the font baseline
- Returns:
- {String}
{String}
getFontSize()
Get the font size
- Returns:
- {String}
{String}
getFontStyle()
Get the renderable style of the font
- Returns:
- {String}
{String}
getFontWeight()
Get the weight of the font to be rendered to the context
- Returns:
- {String}
getHeight()
Get the height of the context drawing area.
{ImageData}
getImage(rect)
Capture an image from the context.
- Parameters:
- rect
- {R.math.Rectangle2D} The area to capture
- Returns:
- {ImageData} Image data capture
{String}
getLineStyle()
Get the current line style for the context. null if
not set.
- Returns:
- {String}
{Number}
getLineWidth()
Get the current line width for drawing paths.
- Returns:
- {Number}
{String}
getNormalizedFont()
Get the normalized font string used to describe the style. The
value includes style, weight, size, and font.
- Returns:
- {String}
{R.math.Point2D}
getPosition()
Get the current transform position (translation) relative to the viewport.
- Returns:
- {R.math.Point2D}
{R.math.Point2D}
getRenderPosition()
Get the render position relative to the world
- Returns:
- {R.math.Point2D}
{Number}
getRenderRotation()
Get the render rotation relative to the world
- Returns:
- {Number}
{Number}
getRenderScale()
Get the render scale relative to the world
- Returns:
- {Number}
{Number}
getRotation()
Get the current transform rotation.
- Returns:
- {Number}
{Number}
getScaleX()
Get the X scaling factor of the current transform.
- Returns:
- {Number}
{Number}
getScaleY()
Get the Y scaling factor of the current transform.
- Returns:
- {Number}
{R.math.Rectangle2D}
getTextMetrics(text)
Get a rectangle that will approximately enclose the text drawn by the render context.
- Parameters:
- text
- {String} The text to measure
- Returns:
- {R.math.Rectangle2D}
{Matrix}
getTransform()
Get the current transformation matrix.
- Returns:
- {Matrix}
{Number}
getWidth()
Get the width of the context drawing area.
- Returns:
- {Number}
lineSeg(point)
Used to draw line segments for polylines. If point
is null, the context will move to the next point. Otherwise,
it will draw a line to the point.
- Parameters:
- point
- {R.math.Point2D} The point to draw a line to, or null.
lineTo(point)
Draw a line from the current point to the point specified.
- Parameters:
- point
- {R.math.Point2D} The point to draw a line to
moveTo(point)
Move the current path to the point sepcified.
- Parameters:
- point
- {R.math.Point2D} The point to move to
popTransform()
Pop the current transformation matrix.
postRender(fn)
A rendering function to perform in world coordinates. After the world has
been rendered, and all transformations have been reset to world coordinates,
the list of post-render functions are executed.
- Parameters:
- fn
- {Function} A function to execute
pushTransform()
Push the current transformation matrix.
putImage(imageData, point, ref)
Draw an image, captured with #getImage, to
the context.
- Parameters:
- imageData
- {ImageData} Image data captured
- point
- {R.math.Point2D} The poisition at which to draw the image
- ref Optional
- {R.engine.GameObject} A reference game object
quadraticCurveTo(cPoint, point)
Draw a quadratic curve from the current point to the specified point.
- Parameters:
- cPoint
- {R.math.Point2D} The control point
- point
- {R.math.Point2D} The point to draw to
release()
Releases the object back into the object pool. See R.engine.PooledObject#release
for more information.
{Object}
remove(obj)
Remove an object from the render context. The object is
not destroyed when it is removed from the container. The removal
occurs after each update to avoid disrupting the flow of object
traversal.
- Parameters:
- obj
- {Object} The object to remove from the container.
- Returns:
- {Object} The object that was removed
render(time, dt)
Called to render all of the objects to the context.
- Parameters:
- time
- {Number} The current render time in milliseconds from the engine.
- dt
- {Number} The delta between the world time and the last time the world was updated in milliseconds.
renderBin(bin, objs, time, dt)
Render all of the objects in a single bin, grouped by z-index.
- Parameters:
- bin
- {Number} The bin number being rendered
- objs
- {Array} Array of objects
- time
- {Number} The current render time in milliseconds from the engine.
- dt
- {Number} The delta between the world time and the last time the world was updated in milliseconds.
setBackgroundColor(color)
Set the background color of the context.
- Parameters:
- color
- {String} An HTML color
setFillStyle(fillStyle)
Set the fill style of the context.
- Parameters:
- fillStyle
- {String} An HTML color, or null.
setFont(font)
Set the font to use when rendering text to the context.
- Parameters:
- font
- {String} A font string similar to CSS
setFontAlign(align)
Set the font alignment for the context
- Parameters:
- align
- {String} The font alignment
setFontBaseline(baseline)
Set the baseline of the renderable font
- Parameters:
- baseline
- {String} The render baseline
setFontSize(size)
Set the size of the font being used to render text
- Parameters:
- size
- {String} The font size string
setFontStyle(style)
Set the style of the renderable font
- Parameters:
- style
- {String} The font style
setFontWeight(weight)
Set the rendering weight of the font
- Parameters:
- weight
- {String}
setHeight(height)
Set the height of the context drawing area
- Parameters:
- height
- {Number} The height in pixels
setLineStyle(lineStyle)
Set the line style for the context.
- Parameters:
- lineStyle
- {String} An HTML color or null
setLineWidth(width)
Set the line width for drawing paths.
- Parameters:
- width Optional, Default: 1
- {Number} The width of lines in pixels
setPosition(point)
Set the current transform position (translation) relative to the viewport.
- Parameters:
- point
- {R.math.Point2D} The translation
setRenderTransform(position, rotation, scale)
Set the transformation of the world.
- Parameters:
- position
- {R.math.Point2D}
- rotation
- {Number}
- scale
- {Number}
setRotation(angle)
Set the rotation angle of the current transform.
- Parameters:
- angle
- {Number} An angle in degrees
setScale(scaleX, scaleY)
Set the scale of the current transform. Specifying
only the first parameter implies a uniform scale.
- Parameters:
- scaleX
- {Number} The X scaling factor, with 1 being 100%
- scaleY
- {Number} The Y scaling factor
setTransform(matrix)
Set the current transformation using a matrix. Replaces the
current transformation at the top of the stack.
- Parameters:
- matrix
- {Matrix} The transformation matrix
setWidth(width)
Set the width of the context drawing area.
- Parameters:
- width
- {Number} The width in pixels
sort()
Sorts objects by their {@link R.objects.Object2D#getZIndex z-index}. Objects
that don't have a z-index are untouched.
sortFn(obj1, obj2)
Sort the objects to draw from objects with the lowest
z-index to the highest z-index.
- Parameters:
- obj1
- obj2
startPath()
Start a path.
strokePath()
Stroke a path using the current line style and width.
swapBins(obj, oldBin, newBin)
Swap the zBin that the object is contained within.
- Parameters:
- obj
- {R.objects.Object2D} The object to swap
- oldBin
- {Number} The old bin number, or RenderContext2D.NO_ZBIN to just insert into a new bin.
- newBin
- {Number} The new bin to put the object into