Phaser 4 examples
Rectangle
- 46 examples
Examples 46
Clone a RectangleDemonstrates using the Rectangle Clone method to create independent copies of a source rectangle.
Copy From RectangleDemonstrates how to use the Rectangle.CopyFrom method to copy the position and dimensions of one rectangle geometry object to another.
Create Rectangle GeometryDemonstrates how to define a basic rectangle geometry object and render it filled with color using a Graphics object.
Decompose Rectangle into PointsDemonstrates how to use the Rectangle.Decompose method to extract the four corner coordinates of a Rectangle geometry object into an array of points.
Floor RectangleDemonstrates the effect of rounding a rectangle's coordinates down to the nearest integer using the Floor utility method.
Get Points along RectangleDemonstrates how to extract an array of points from a rectangle's perimeter using a specific step distance between each point.
Get Rectangle CenterDemonstrates how to use the GetCenter method to calculate and retrieve the center point of multiple Rectangle geometry objects.
Marching Ants RectangleDemonstrates how to use the Marching Ants function to distribute a specific number of points or sprites evenly along the perimeter of a Rectangle geometry object.
Merge Rectangle with XY PointDemonstrates how to expand a rectangle's dimensions to encompass a new set of X and Y coordinates using the MergeXY method.
Random Point Outside RectangleDemonstrates how to generate random points that lie within an outer rectangle but outside of an inner rectangle.
Rectangle AreaCalculate the area of a Rectangle based on pointer movement and use the result to resize a secondary square.
Rectangle Aspect RatioCalculate and display the aspect ratio of a rectangle as its width and height change dynamically based on pointer movement.
Rectangle CeilDemonstrates how to use the Ceil method to round a rectangle's coordinates and dimensions up to the nearest integer, effectively snapping it to a pixel grid.
Rectangle Ceil AllDemonstrates using the CeilAll method to round up the position and dimensions of a Rectangle to the nearest integer values.
Rectangle Center OnDemonstrates how to use the CenterOn method to position a Phaser.Geom.Rectangle based on its center point coordinates.
Rectangle Contains PointDemonstrates how to check if a specific point, such as the mouse pointer, is located within the bounds of a Rectangle geometry object.
Rectangle Contains PointDemonstrates using Phaser.Geom.Rectangle.ContainsPoint to detect if a specific coordinate is within the boundaries of a rectangle.
Rectangle Contains RectangleDemonstrates how to check if one rectangle is fully contained within the boundaries of another using Phaser.Geom.Rectangle.ContainsRect.
Rectangle DeflateDemonstrates how to shrink a rectangle from its center by using negative values with the Inflate method.
Rectangle Edges as LinesExtract the four individual boundary edges of a Rectangle as Line objects using getLineA, getLineB, getLineC, and getLineD.
Rectangle EqualityDemonstrates how to use Phaser.Geom.Rectangle.Equals to check if two rectangle objects have the exact same position and dimensions.
Rectangle Fit InsideDemonstrates how to scale and position a Rectangle to fit entirely within the bounds of another Rectangle using Phaser.Geom.Rectangle.FitInside.
Rectangle Fit OutsideDemonstrates using Phaser.Geom.Rectangle.FitOutside to scale a rectangle so that it fully encloses a target rectangle while maintaining its original aspect ratio.
Rectangle Floor AllDemonstrates using FloorAll to snap a rectangle's position and size to integer values, compared against a rectangle using sub-pixel floating point values.
Rectangle From PointsDemonstrates how to create and update a bounding rectangle that automatically encompasses a collection of points provided as either objects or arrays.
Rectangle Get PointDemonstrates how to calculate coordinates along the perimeter of a rectangle using a normalized value between 0 and 1.
Rectangle Get Random PointDemonstrates how to generate random coordinates within a Rectangle geometry object, either by creating new Point instances or updating existing ones.
Rectangle Get SizeDemonstrates how to use Phaser.Geom.Rectangle.GetSize to retrieve the width and height of a rectangle as a Point object.
Rectangle InflateDemonstrates how to expand the size of a Rectangle while maintaining its center position using the Inflate method.
Rectangle IntersectionCalculate the area of overlap between two rectangles and render the resulting intersection rectangle.
Rectangle Is EmptyThis example shows how to use the isEmpty method to check if a Rectangle geometry object has a width or height of zero.
Rectangle MergeLearn how to expand a base rectangle to encompass the area of another rectangle using the MergeRect geometry function.
Rectangle Merge PointsDemonstrates how to use Phaser.Geom.Rectangle.MergePoints to expand a rectangle's dimensions and position to encompass an array of point coordinates.
Rectangle OffsetDemonstrates how to use the Offset function to shift the position of a Rectangle geometry object by specific x and y amounts.
Rectangle Offset PointDemonstrates how to shift a rectangle's position by applying the coordinates of a Point or Vector2 object.
Rectangle OverlapsDemonstrates how to check for overlaps between two Rectangle objects using the Phaser.Geom.Rectangle.Overlaps function.
Rectangle PerimeterCalculate and display the perimeter of a Rectangle geometry object as it is resized dynamically via pointer input.
Rectangle Perimeter PointCalculates and visualizes a point moving along the perimeter of a rectangle based on a specific angle.
Rectangle PropertiesDemonstrates how to access and use various properties of a Rectangle geometry object, such as its edges and center coordinates.
Rectangle Set EmptyLearn how to reset a Rectangle geometry object to zero position and dimensions using the setEmpty method.
Rectangle Set SizeDemonstrates how to modify the width and height of a Rectangle geometry object using the setSize method.
Rectangle Set ToDemonstrates how to update a rectangle's position and dimensions in a single call using the setTo method.
Rectangle UnionDemonstrates how to use the Rectangle Union function to calculate the smallest rectangle that encompasses two other rectangles.
Scale a RectangleDemonstrates how to use the Scale function to iteratively increase the dimensions of a geometry Rectangle object based on pointer input.
Set Rectangle PositionDemonstrates how to position a geometric Rectangle using the setPosition method and by directly modifying its x and y properties.
Sprite to Rectangle PerimeterCalculates the point on a rectangle's perimeter that intersects with a line drawn from its center towards a moving sprite using an angle.