GradientRectangle¶

Overview¶

Mostly like a normal Rectangle (Node), but instead of a hard transition from "in" to "out", it has a defined region of gradients around the edges.

Has options for controlling the margin amounts for each side. This will control the area that will be covered by a gradient.

You can control the margin amounts for each side individually with: - leftMargin - rightMargin - topMargin - bottomMargin

Additionally, the horizontal/vertical margins can also be controlled together with: - xMargin - yMargin

And all margins can be controlled together with: - margin

These options can be provided in the options object, or can be used with setters/getters (like normal Node options). Note that the getters only work if all equivalent values are the same.

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

Class GradientRectangle¶

import { GradientRectangle } from 'scenerystack/scenery-phet';

Constructor¶

new GradientRectangle( providedOptions? : GradientRectangleOptions )¶

Instance Methods¶

invalidateRectangle()¶

(protected)

Custom behavior so we can see when the rectangle dimensions change.

dispose()¶

Overrides disposal to clean up some extra things.

setFill( fill : TPaint ) : this¶

We want to be notified of fill changes.

setStroke( stroke : TPaint ) : this¶

We don't want to allow strokes.

mutate( options? : GradientRectangleOptions ) : this¶

Type GradientRectangleOptions¶

import type { GradientRectangleOptions } from 'scenerystack/scenery-phet';

RectangleOptions

Source Code¶

See the source for GradientRectangle.ts in the scenery-phet repository.