actions-and-utilities

Use this skill when working with Phaser 4 utility functions, actions, alignment, grid layout, or batch operations on game objects. Triggers on: align, grid layout, actions, set operations on groups of game objects.

By phaserjs · 508 installs

npx skills add phaserjs/phaser --skill actions-and-utilities

Source repository · Upstream listing

Phaser 4 Actions & Utility Functions Phaser.Actions namespace for batch operations on Game Object arrays, plus Phaser.Utils.Array, Phaser.Utils.Objects, and Phaser.Utils.String helper functions. Related skills: ../groups and containers/SKILL.md, ../sprites and images/SKILL.md Quick Start Core Concepts The Actions Pattern Every Action in Phaser.Actions follows the same pattern: 1. First argument is always an array of Game Objects (or any objects with the required public properties like x , y , alpha , etc.). 2. Returns the same array , enabling chaining or pass through. 3. Works with Groups by passing group.getChildren() . 4. Actions do NOT store state. They are one shot batch operations. PropertyValueSet and PropertyValueInc Most Set/Inc actions delegate to two core functions: PropertyValueSet(items, key, value, step, index, direction) Sets items[i][key] = value + (i step) . PropertyValueInc(items, key, value, step, index, direction) Adds items[i][key] += value + (i step) . The step parameter adds an incremental offset per item. The index and direction parameters control iteration start point and order (1 = forward, 1 = backward). Geometry Based Placement Actions like PlaceOnCircle , PlaceOnLine , RandomRectangle , etc. accept Phaser geometry objects ( Phaser.Geom.Circle , Phaser.Geom.Line , etc.), NOT Game Object shapes. If using a Phaser.GameObjects.Circle , pass its .geom property instead. All Actions Property Setters Action Signature Description SetX (items, value, step?, index?, direction?) Set x property SetY (items, value, step?, index?, direction?) Set y property SetXY (items, x, y?, stepX?, stepY?, index?, direction?) Set both x and y ; y defaults to x SetAlpha (items, value, step?, index?, direction?) Set alpha SetBlendMode (items, value, index?, direction?) Set blend mode SetDepth (items, value, step?, index?, direction?) Set render depth SetHitArea (items, hitArea?, callback?) Set interactive hit area SetOrigin (items, originX, originY?, stepX?, stepY?, index?, direction?) Set origin point SetRotation (items, value, step?, index?, direction?) Set rotation (radians) SetScale (items, scaleX, scaleY?, stepX?, stepY?, index?, direction?) Set both scale axes SetScaleX (items, value, step?, index?, direction?) Set scaleX SetScaleY (items, value, step?, index?, direction?) Set scaleY SetScrollFactor (items, x, y?, stepX?, stepY?, index?, direction?) Set scroll factor SetScrollFactorX (items, value, step?, index?, direction?) Set horizontal scroll factor SetScrollFactorY (items, value, step?, index?, direction?) Set vertical scroll factor SetTint (items, topLeft, topRight?, bottomLeft?, bottomRight?) Set tint color(s) SetVisible (items, value, index?, direction?) Set visibility PropertyValueSet (items, key, value, step?, index?, direction?) Generic: set any named property Property Incrementers Action Signature Description IncX (items, value, step?, index?, direction?) Add to x IncXY (items, x, y?, stepX?, stepY?, index?, direction?) Add to x and y IncY (items, value, step?, index?, direction?) Add to y IncAlpha (items, value, step?, index?, direction?) Add to alpha Angle (items, value, step?, index?, direction?) Add to angle (degrees) Rotate (items, value, step?, index?, direction?) Add to rotation (radians) ScaleX (items, value, step?, index?, direction?) Add to scaleX ScaleXY (items, scaleX, scaleY?, stepX?, stepY?, index?, direction?) Add to both scale axes ScaleY (items, value, step?, index?, direction?) Add to scaleY PropertyValueInc (items, key, value, step?, index?, direction?) Generic: increment any named property Placement on Geometry Action Signature Description PlaceOnCircle (items, circle, startAngle?, endAngle?) Evenly space on circle perimeter PlaceOnEllipse (items, ellipse, startAngle?, endAngle?) Evenly space on ellipse perimeter PlaceOnLine (items, line) Evenly space along a line PlaceOnRectangle (items, rect, shift?) Evenly space on rectangle perimeter PlaceOnTriangle (items, triangle, stepRate?) Evenly space on triangle perimeter RandomCircle (items, circle) Random positions within a circle RandomEllipse (items, ellipse) Random positions within an ellipse RandomLine (items, line) Random positions along a line RandomRectangle (items, rect) Random positions within a rectangle RandomTriangle (items, triangle) Random positions within a triangle Layout and Alignment Action Signature Description GridAlign (items, config) Arrange in grid; config: { width, height, cellWidth, cellHeight, position, x, y } AlignTo (items, position, offsetX?, offsetY?) Chain align each item next to the previous one using Phaser.Display.Align constants FitToRegion (items, scaleMode?, region?, itemCoverage?) Scale/position each GO to fill a rectangle (v4.0.0+). scaleMode: 0=stretch, 1=fit inside, 1=cover outside Distribution and Interpolation Action Signature Description Spread (items, property, min, max, inc?) Linearly distribute a property from min to max across all items SmoothStep (items, property, min, max, inc?) Distribute using Hermite smoothstep interpolation SmootherStep (items, property, min, max, inc?) Distribute using Ken Perlin's smootherstep Rotation and Movement Action Signature Description RotateAround (items, point, angle) Rotate all items around a point (radians) RotateAroundDistance (items, point, angle, distance) Rotate around a point at a fixed distance ShiftPosition (items, x, y, direction?, output?) Snake like: move head to x/y, each item takes position of the previous WrapInRectangle (items, rect, padding?) Wrap x/y to stay within rectangle bounds Queries and Iteration Action Signature Description GetFirst (items, compare, index?) Find first item matching all properties in compare object GetLast (items, compare, index?) Find last item matching all properties in compare object Call (items, callback, context) Invoke callback for each item Shuffle (items) Randomly reorder the array (Fisher Yates) ToggleVisible (items) Toggle visible on each item PlayAnimation (items, key, ignoreIfPlaying?) Play animation on all items with an anims component Effects (v4.0.0+) Action Signature Description AddEffectBloom (items, config?) Add Bloom filter effect to a Camera or GO. Returns { parallelFilters, threshold, blur }[] AddEffectShine (items, config?) Add Shine filter effect AddMaskShape (items, config?) Apply a shape based mask (circle, square, rectangle, ellipse) with optional blur Array Utilities Namespace: Phaser.Utils.Array Function Signature Description Add (array, item, limit?, callback?, context?) Add item(s) if not already present; optional size limit AddAt (array, item, index?, limit?, callback?, context?) Insert item(s) at index BringToTop (array, item) Move item to end of array CountAllMatching (array, property, value, startIndex?, endIndex?) Count items where property equals value Each (array, callback, context, ...args) Iterate with callback; passes item + extra args EachInRange (array, callback, context, startIndex, endIndex, ...args) Iterate a slice with callback FindClosestInSorted (value, array, key?) Binary search style closest match in sorted array Flatten (array, output?) Flatten nested arrays into a single array GetAll (array, property?, value?, startIndex?, endIndex?) Filter items matching property/value GetFirst (array, property?, value?, startIndex?, endIndex?) First item matching property/value GetRandom (array, startIndex?, length?) Return a random element MoveAbove (array, item1, item2) Move item2 directly above item1 MoveBelow (array, item1, item2) Move item2 directly below item1 MoveDown (array, item) Move item one position toward index 0 MoveTo (array, item, index) Move item to specific index MoveUp (array, item) Move item one position toward end NumberArray (start, end, prefix?, suffix?) Generate [start..end] range; optional string prefix/suffix NumberArrayStep (start?, end?, step?) Generate range with custom step size QuickSelect (array, k, left?, right?, compare?) Partial sort: kth smallest element in place Range (a, b, options?) Generate array from range config Remove (array, item, callback?, context?) Remove item(s) from array RemoveAt (array, index, callback?, context?) Remove item at index RemoveBetween (array, startIndex, endIndex, callback?, context?) Remove items in range RemoveRandomElement (array, startIndex?, length?) Remove and return a random element Replace (array, oldItem, newItem) Swap one item for another RotateLeft (array, total?) Shift elements left; last wraps to front RotateRight (array, total?) Shift elements right; first wraps to end SafeRange (array, startIndex, endIndex, throwError?) Validate index range is within bounds SendToBack (array, item) Move item to index 0 SetAll (array, property, value, startIndex?, endIndex?) Set a property on all items in range Shuffle (array) Fisher Yates shuffle; modifies in place SortByDigits (array) Sort strings by embedded numeric values SpliceOne (array, index) Fast single element splice StableSort (array, compare?) Guaranteed stable sort (merge sort fallback for engines without native stable sort) Swap (array, item1, item2) Swap two items in place Also includes Phaser.Utils.Array.Matrix sub namespace for 2D matrix operations. Object Utilities Namespace: Phaser.Utils.Objects Function Signature Description Clone (obj) Shallow clone of object DeepCopy (obj) Recursive deep copy of object or array Extend (target, ...sources) jQuery style extend; copies properties from sources to target GetAdvancedValue (source, key, defaultValue) Like GetValue but resolves random/callback config values GetFastValue (source, key, defaultValue?) Top level only property lookup; no dot path support. Faster than GetValue GetMinMaxValue (source, key, min, max, defaultValue) Get value clamped between min and max GetValue (source, key, defaultValue, altSource?) Dot path property lookup (e.g. 'render.screen.width' ). Falls back to altSource then defaultValue HasAll (source, keys) True if source has ALL listed keys HasAny (source, keys) True if source has ANY listed key HasValue (source, key) True if source has the key IsPlainObject (obj) True if obj is a plain {} object (not DOM, not window) Merge (obj1, obj2) Merge obj2 into a clone of obj1 MergeRight (obj1, obj2) Merge obj1 into a clone of obj2 Pick (source, keys) Return new object with only the specified keys SetValue (source, key, value) Set a dot path property value String Utilities Na