Skip to content

Image

Overview

A node that displays a single image either from an actual HTMLImageElement, a URL, a Canvas element, or a mipmap data structure described in the constructor.

@author Jonathan Olson <jonathan.olson@colorado.edu>

Class Image

import { Image } from 'scenerystack/scenery';

Constructor

new Image( image : ImageableImage | TReadOnlyProperty<ImageableImage>, providedOptions? : ImageOptions )

Instance Methods

invalidateImage()

Triggers recomputation of the image's bounds and refreshes any displays output of the image.

Generally this can trigger recomputation of mipmaps, will mark any drawables as needing repaints, and will cause a spritesheet change for WebGL.

This should be done when the underlying image has changed appearance (usually the case with a Canvas changing, but this is also triggered by our actual image reference changing).

invalidateSupportedRenderers()

Recomputes what renderers are supported, given the current image information.

setImageOpacity( imageOpacity : number )

Sets an opacity that is applied only to this image (will not affect children or the rest of the node's subtree).

This should generally be preferred over Node's opacity if it has the same result, as modifying this will be much faster, and will not force additional Canvases or intermediate steps in display.

@param imageOpacity - Should be a number between 0 (transparent) and 1 (opaque), just like normal opacity.

setImageBounds( imageBounds : Bounds2 | null )

Sets the imageBounds value for the Image. If non-null, determines what is considered "inside" the image for containment and hit-testing.

NOTE: This is accomplished by using any provided imageBounds as the node's own selfBounds. This will affect layout, hit-testing, and anything else using the bounds of this node.

getImageBounds() : Bounds2 | null

Returns the imageBounds, see setImageBounds for details.

isPainted() : boolean

Whether this Node itself is painted (displays something itself).

canvasPaintSelf( wrapper : CanvasContextWrapper, matrix : Matrix3 )

(protected)

Draws the current Node's self representation, assuming the wrapper's Canvas context is already in the local coordinate frame of this node.

@param wrapper @param matrix - The transformation matrix already applied to the context.

containsPointSelf( point : Vector2 ) : boolean

Override this for computation of whether a point is inside our self content (defaults to selfBounds check).

@param point - Considered to be in the local coordinate frame

getSelfShape() : Shape

Returns a Shape that represents the area covered by containsPointSelf.

invalidateMipmaps()

Triggers recomputation of mipmaps (as long as mipmapping is enabled)

mutate( options? : ImageOptions ) : this

Static Properties

ImageIO : IOType

DEFAULT_IMAGE_OPTIONS

(readonly)

Initial values for most Node mutator options

Type ImageOptions

import type { ImageOptions } from 'scenerystack/scenery';

Source Code

See the source for Image.ts in the scenery repository.