Phaser 3 container mask. Red circle is …
Desktop and Mobile HTML5 game framework.
Phaser 3 container mask The x coordinate of the center of the area to search within. 87. Container: Only 1 level parent container will affect DOM game Add a nice time bar / energy bar / mana bar / whatever bar to your games using Phaser 3 masks. Name Type name. Do you like my tutorials? Then consider "energybar. The bits are 0001 | 0010 | 0100 | 1000 set by the Notes of Phaser 3 phaser3-rex-notes Home Home Table of contents Phaser Links Phaser3 Rex plugins Circle mask image Alpha mask image Repeat image Image box Transition Container Container Container Container Notes of Phaser 3 Dynamic texture Initializing search phaser3-rex-notes Notes of Phaser 3 Circle mask image Alpha mask image Repeat image Image box Transition A Container. container scrollfactor. Modified 2 years, 9 months ago. Put these game object into a container, the mask area is not correct. Container-Lite : It has mask property, but it could not become a mask object. Usually this is done to retain the shape or embelishments on the corners. optional. Name Type Notes of Phaser 3 Round rectangle Initializing search phaser3-rex-notes Notes of Phaser 3 Container Container Container Container Lite Container Lite Container Lite Perspective Skew Grid table Zone See mask. The mask this Camera will use when rendering. ; offsetX, offsetY: The horizontal/vertical offset from the camera follow target. GeometryMask: The mask this Game Object FX - Phaser Phaser. alphaMaskImage (x, y, key, frame, config); DOM Game Objects can be added to a Phaser Container, however you should only nest them one level deep. Hi, Quite new here and have recently started a projecting using Phaser3, just wondering if anyone would be willing to give advise on how best to achieve something. A mask is an object that limits the visibility of an object to the An Arcade Physics Sprite is a Sprite with an Arcade Physics body and related components. type. Display A Particle Emitter is a special kind of Game Object that controls a pool of Particles. FX name. If you instead do this. Events. mask: A bit mask that specifies the collision categories this body may collide with. ; Stop following Notes of Phaser 3 Round Rectangle Initializing search phaser3-rex-notes Notes of Phaser 3 Container Container Container Container Lite Container Lite Container Lite Perspective Skew Grid table Zone Layer Layer Create mask ¶ var mask = rect. "9-slice scaling is a technique to deform a 2D texture allowing it to be scaled without deforming the corners. Number: 4 corners with the same radius. There are two game objects, a Graphics game object to create mask, apply this mask to another image game object. Is there a simple solution to this? The input objects I’m using: on-screen buttons jdotrjs has released a powerful 9-Slice Plugin for Phaser 3. Phaser 3. table. GeometryMask Firstly, I created a container with a mask that only displays the right side of it. fixedPosition. null: No mask. on('pointerdown', ) you'll get a callback with the pointer, but also an array of game objects that were clicked, with an empty array if no game objects were clicked. var image = scene. document. mask. 24. A Bitmap Mask can use any Game Object to determine the alpha of each pixel of the masked Game Object(s). These settings will impact all children name type arguments description; world: Phaser. 7: 5699: June 25, 2019 3. setInteractive(new Phaser. Then I found that the mask did not work properly on this object. Removes all children from this container that are within the begin and end indexes. Notes of Phaser 3 phaser3-rex-notes Home System System Game Game Game Main loop Layers cannot be added to Containers. It can parse both KTX and PVR containers and within those has support for the following formats: ETC, ETC1, ATC, ASTC, BPTC, RGTC, PVRTC, S3TC and S3TCSRB. matter physics body test. GeometryMask: The mask this Game Object I also tried adding new Phaser. Notes of Phaser 3 Overview Initializing search phaser3-rex-notes Notes of Phaser 3 A container with badges above a main item. get bounds test 1. Source: src/math/Vector2. events. Under 3. name. Geom. 0 game objects container Version: v3. A plain object {left, right, top, bottom} panel. A simple sprite let energyContainer = this. 50 using Spine Containers it's 43 GL commands and just 1 draw call and 1 clear. Display. Description: The flags that are compared against RENDER_MASK to determine if this Game Object will render or not. It features: Rigid bodies. Containers can be added to Layers, but Layers cannot be added to Containers. ; 0. Notes of Phaser 3 Touch events Initializing search phaser3-rex-notes Notes of Phaser 3 Circle mask image Alpha mask image Repeat image Image box Transition Container Container Container Container Lite Container Lite Container Lite new Collider(world, overlapOnly, object1, object2, collideCallback, processCallback, callbackContext) Parameters: The mask must have been previously created and can be either a GeometryMask or a BitmapMask. width, this. This constant is meant for comparison operations and should not be modified directly. Should the mask translate along with the Camera, or be fixed in Hello, I am currently working on incorporating multiple scenes. EDIT: I seem to be mistaken. input overlap test. The Phaser Matter plugin provides the ability to use the Matter JS Physics Engine within your Phaser games. Examples v3. A Geometry Mask can be applied to a Game Object to hide any pixels of it which don't intersect a visible pixel from the geometry mask. make. In this release you'll find the new MultiPipeline, which restored rendering speed when you've got heavily mixed display lists of Texture-based and Shape / Graphics These archived docs are for Phaser 2. At If anyone has the same problem as I have, here is what I changed from the code posted above: code // the beginning of the code is the same as above // lights mask as a container for all light sources in the game this. padding: A number : Extra left/right/top/bottom padding spacing of this rectangle mask. The reason for this is that multiple Game Objects can all share the same mask. Physical properties (mass, area Desktop and Mobile HTML5 game framework. LEFT LEFT: Phaser. 0 addToDisplayList <instance> addToDisplayList([displayList]) Description: Adds this Game Object to the given Display List. js#L111 Since: 3. 60 a Render Texture was the only way you could create a texture. Phaser. true: Mask alpha (alpha > 0) area. y. x. Only a Container on the Description: The Mask this Game Object is using during render. Equally, calling setCrop with no arguments will reset the crop and disable it. A Guide to the Phaser Layer to group 'layers' of Game Objects If you need those kind of features then you should use a Container instead. How can I achieve it. . 0 Operating system: MacOS Browser: Chrome Description In WebGL, setting the mask of a container has no effect. To make sure I can use a variety of images I applied a circle mask I created from a graphics shape to the smaller image so that it always fits, even if its Desktop and Mobile HTML5 game framework. Neither containers have their positions changed during this creation phase, and both containers are positioned at [0, 0]. If you use Spine in your game and you have to use Containers, I strongly recommend swapping over. For that, please use the API docs in conjunction with our Yes, Phaser 3 does not currently support masks on nested objects within a container. girl body sprites. Saved searches Use saved searches to filter your results more quickly Input - Phaser Phaser. Container. Container) and the Layer objects. Mesh - this. description. create container. Document Grid sizer Layout children game objects in grids. GeometryMask The documentation states: "Containers can have masks set on them and can be used as a mask too. Masks. alpha of the pixel from the Geometry Mask do not matter. Description: The parent Container of this Game Object, if it has one. body. A fast, free and fun open source framework for Canvas and WebGL powered browser games. The mask is essentially a clipping path which can only make a masked pixel fully visible or fully invisible without changing its alpha (opacity). lights_mask = this. Composite bodies. GameObject#parentContainer; Source Apparently I can use a Phaser. 3. I’ve got a circle image inside a container and then put another slightly smaller image on top to create a sort of border around it. I have one scene which is where all of the game things happen in it called gameScene. 0: 412: May 17, 2019 Alternative to Nested Containers? Phaser 3. RENDER_MASK RENDER_MASK: container mask. Any further down the chain and they will ignore all root container properties. Masks are positioned in global space and are not relative to the Game Object to which they are applied. A boolean flag indicating if this Game Object is being cropped or not. initialTime; // the energy container. Masks have no impact on physics or input detection. World instance that this body belongs to. Then I created a group and override the constructor to add the newly created object to the container. invertAlpha: false: Mask non-alpha (alpha === 0) area. Compressed Textures differ from normal textures in that their structure is optimized for fast GPU data reads and lower memory consumption. GameObject table. Groups form the logical tree structure of the display/scene graph where local transformations are applied to children. It appears the mask I assigned my first container is no longer working. Type: Phaser. Yes. Contains) but the clickable area become the lower right corner of the button; wheras with Containers can have masks set on them and can be used as a mask too. Does Phaser 3 support masks on nested con Desktop and Mobile HTML5 game framework. 0 Folders with this symbol contain examples that require a Developer license In versions of Phaser before 3. 0 (Latest) v3. Shader effects This includes calls that may come from a Group, Container or the Scene itself. pointer. However the Pointermove event doesn't get Desktop and Mobile HTML5 game framework. 0 Inherited From: Phaser. align: Alignment of icon, text, action-icon game objects. 1: Camera will instantly snap to the target coordinates. It works by taking a reference to a Phaser. 3 Phaser 3 docs can be found on newdocs A Group is a container for display objects including Sprites and Images. The y coordinate of the center of the area to search within. The mask is essentially a clipping path which can only make a masked pixel fully visible or fully invisible without changing its alpha Only a Container on the root of the display list will use its mask. 0, or update: Apply mask to cell container only when table. Description: The Mask this Game Object is using during render. Learn more about working with parent objects in the Scene Editor. No. While it allows you to persist a Game Object across Scenes, please understand you are entirely responsible for managing references to and from this Game Object. Phaser 3 engine does not support nested mask, uses circle mask image instead. The Game Object to export as JSON. undefined, or 'left', or 'top': Align game objects at left, or top. 0 canvas Mask not working on img within a container. Compound bodies. maskType: Type of mask. The sprite is perfectly being masked but when I am clicking beyond mask area it is being clicked. 0 v3. For example: How to create a masked content object with mask inside the class? Mask must be a class member (changes self coordinates according the parent gameobject). Unlike Arcade Physics, the other physics system provided with Phaser, Matter JS is a full-body physics system. 0 mask, good but can be greater. play('basicenemy'); ofc I guess it's to play an animation but can you just tell me that so we can dig more on the way you're coding your game As of Phaser v3. Rectangle - this. hello. CANVAS, width: 536, height: 183, scene: { create }, banner: false }; function create { const container = Define class classMyContainerextendsPhaser. mask mask: Phaser. Not so much about the code but just what tools or methods are best. ; Blur: 3 different levels of gaussian blur (low, medium and high) and custom distance and color. discourse. The mask is just a graphics object which I use fillRect to create the shape. io. panel. Description: A Layer cannot be placed inside a Container. container placement. phaser. 0. group, where you'll find boards dedicated to Phaser 3, Phaser 2, a Showcase and more. Description: A static right Vector2 for use by reference. an curious question, why mask is not working on object added on a container. Ask Question Asked 2 years, 9 months ago. js#L727 Since: 3. In the constructor of this object, I pass the scene object and Desktop and Mobile HTML5 game framework. EventEmitter#emit Source: src/events/EventEmitter. Unlike the Geometry Mask, which is a clipping path, a Bitmap Mask behaves like an alpha mask, not a clipping path. png"); } create(){ this. This is the complete API documentation for Phaser 3. Curve - this. Obviously, containers and groups have a children list, but here are the difference between these two objects in Phaser: container has position, angle, alpha mask: A rectangle mask of cells. 0, or 'update': Apply mask only when scrolling. js#L86 Since: 3. Phaser Phaser 3. Graphics - this. draggable container. Textures. This property is kept purely so a Layer has the same. The mask is essentially a clipping path which can only make a masked pixel fully visible or fully invisible without The Rectangle Shape is a Game Object that can be added to a Scene, Group or Container. x: number The horizontal position of this Game Object in the world. Particle Emitters are created via a configuration object. In Phaser 3, the only game object types that have children are the Container (Phaser. The flags that are compared against RENDER_MASK to determine if this Game Object will render or not name type arguments Default description; destroyMask: boolean <optional> false: Destroy the mask before clearing it? Phaser has an active and friendly forum at phaser. GeometryMask Container-Lite: Re-calculate position/anlge/scale of each child when parent container changes position/anlge/scale. Display - Phaser Phaser. updateTable() is invoked. 0 eventNames <instance> eventNames() Description: Return an array listing the events for which the emitter has registered listeners. In the map are many materials This includes calls that may come from a Group, Container or the Scene itself. They can also be made interactive and used for input events. 2: 683: November 11, 2019 Returns: Phaser. Viewed 2k times 1 What I want to achieve is to be able to drag a Sprite, and when it moves over the interactive area of another Sprite, it emits particles. Note that you should not nest Spine Containers inside regular Containers if you wish to use masks on the container children. 16. Document Label A container with an icon, text, and background. 0 display masks Version: v3. BitmapMask, Phaser. rexUI. 2 Operating system: win10 Browser: chrome, firefox Description Here is the test code. I have another scene which has a menu on it called missionScene. Parameters. Default value is 0. BitmapMask | Phaser. EventEmitter#addListener Source: src/events/EventEmitter. updateMode: When to update mask. height / 2 Ask for help. Load a texture, then apply an alpha mask from another texture. true. webgl object within a container canvas object within a container canvas object outside of container. 3. frame: Texture key, frame name of the mask texture. You can, however, mask children of Spine Containers if they are embedded within other Spine Containers. default. I want to apply these to the individual subobjects because for example in certain conditions, I want an animation to play or make the object flash. Plane - this. renderFlags: number. The body can be dynamic or static. Vector2. ; Bokeh / Tilt Shift: A bokeh and tiltshift effect, with intensity, contrast and Returns: boolean - true if the event had listeners, else false. 1, or 'everyTick': Apply mask Desktop and Mobile HTML5 game framework. This version continues our efforts to bring fixes and improvements to the v3 line, even while we work on Phaser 4 development. as3mbus May 24, 2021, 2:38am 1. GeometryMask. Create mask ¶ var mask = layer. GeometryMask to acheive the desired effect. width / 2, game. Red circle is Desktop and Mobile HTML5 game framework. on("prerender", () => { const { tx, ty, scaleX, scaleY, mask. GeometryMask Returns: Phaser. That's the basics of bitmasks that you'll need to know to understand what the Matter Physics docs are saying. It gives you every single method, property, event, typedef, callback signature and more but without any context of their application. I have a sprite which is clickable and I have masked it with graphics (rectangle). Line - this. Input. 0, or 'circle': Circle mask. The properties of this object Notes of Phaser 3 Nine slice Initializing search phaser3-rex-notes Notes of Phaser 3 Container Container Container Container Lite Container Lite Container Lite Perspective Skew Grid table Zone Layer Layer Create mask ¶ var mask = nineSlice. 4 corners with the same radius X/Y The pipe symbol (|) is the OR bitwise operator meaning that it will combine the two values and set the resulting bit to 1 if there is a 1 at that bit position in either value. Because they do not have a texture you need to provide a shape for them to use as their hit area. Help please! these tiles are scrollable. These settings will impact all children being rendered by the Layer. The bits are 0001 | 0010 | 0100 Please wait, loading Phaser build Back Edit in Sandbox iFrame 100% Labs Mobile Edit Force Canvas Source Compare WebGL Debug. mask: Configuration of panel's mask. padding: Extra left/right/top/bottom padding spacing of this rectangle mask. Input The Grid Shape is a Game Object that can be added to a Scene, Group or Container. Bitmap Masks only work on WebGL. The contents of which will be iterated fully, and drawn in turn. scale: undefined: Expand mask texture size to fit target texture. These archived docs are for Phaser 2. Matter. image({ x: 0, y: 0, key: 'vision_mask', add: false }); // Unlike the Geometry Mask, which is a clipping path, a Bitmap Mask behaves like an alpha mask, not a clipping path. The main difference between an Arcade Sprite and an Arcade Image is that you cannot animate an Arcade Image. 1, or everyTick: Apply mask to cell container Under Phaser 3. JSON. A workaround is to put an invisible game object inside the container, then copy its global transform values to the real mask source outside the container. js#L715 Since: 3. GameObject | Phaser. GeometryMask: The mask this Game Object Phaser 3: Check if draggable Object is over interactive area of a Sprite. 4. Example Test Code var config I am trying to create a complex game object by extending the Container class, but I am having problems applying tweens and playing animations on the subobjects. A mask is an object that limits the visibility of an object to the shape of the mask applied to it. 19. I do not want my hidden area of sprite clickable. Rectangle. Returns: Phaser. Physics. GeometryMask: The mask this Game Object will use when rendering Notes of Phaser 3 phaser3-rex-notes Home System System Game Game Game Main loop Circle mask image Alpha mask image Repeat image Image box Transition Container Container Container Container Desktop and Mobile HTML5 game framework. get child world position. 0: Disable round corner. x position. Rectangle to the interactive function as such. add. For example: Green rectangle is a content area. BaseShader instance, as found in Version Phaser Version: 3. backgroundColor: Background color filled with masked area. 55. Add a nice time bar / energy bar / mana bar / whatever bar to your games using Phaser 3 masks. Built-in render of phaser. updateMode: When to update cells mask. ; Bloom: Add bloom to any Game Object, with custom offset, blur strength, steps and color. style = 'margin:0;'; var config = { type: Phaser. This includes calls that may come from a Group, Container or the Scene itself. This is not the case in versions earlier than 3. this. height), Phaser. Containers can be enabled for input. The flags that are compared against RENDER_MASK to determine if this Game Object will render or not. Container children need to accept interactive events in the view Phaser is a fast, free, and fun open source HTML5 game framework that offers WebGL and Canvas rendering across desktop and mobile web browsers and has been actively developed for over 10 years. It is only available when using the WebGL Renderer. It includes a target text outside of the carousel Desktop and Mobile HTML5 game framework. key, mask. Using this mask we can check which of the 3 categories are included in a very efficient manner. The mask must have been previously created and can be either a GeometryMask or a BitmapMask. input. The pointerdown event listener on game objects is different than the pointerdown event listener on the global input manager. Returns: boolean - true if the event had listeners, else false. However, Container children cannot be masked. 0 (like 3. Mask. I am new to Phaser (v 2. Notes of Phaser 3 phaser3-rex-notes Home System System Game Game Game Main loop Circle mask image Alpha mask image Repeat image Image box Transition Container Container Container Container Im implementing Phaser 3 on my website to organize some objects. Because they do not have a texture you need to provide a shape for them to Sets the mask that this Game Object will use to render with. gameObject. 80, masks always render in global coordinates, so if you put a mask source inside a container, you will get the wrong effect. Add a nice time bar / energy bar / mana bar / whatever bar to your HTML5 games using Phaser 3 masks. Sets a mask for the displayObject. 1. Geometry Masks work on both WebGL and Canvas. The Game Object or Texture that will be used as the mask. Rectangle(0, 0, this. The color and. Container{constructor(scene,x,y,children){su In Phaser 3, mask layers empower you to control which parts of your game are visible. mask: A rectangle mask of cells. I made a bunch of cards using Containers, but I realize that containers seem to be a similar situation to Groups. If you need to register clicks on input objects that Notes of Phaser 3 phaser3-rex-notes Home System System Game Game Game Main loop Circle mask image Alpha mask image Repeat image Image box Transition Container Container Container Container A Spine Game Object is a Phaser level object that can be added to your Phaser Scenes. Desktop and Mobile HTML5 game framework. There is a lot of things to say on this way of coding but it follows a logic that is more related to ES6 syntax which is the actual aim of the Phaser framework, so I have a first question which is what do you want to do by calling this. 60 contains support for Compressed Textures. Container: It has mask property, and it could become a mask object. So here’s the problem, I have a huge randomly generated map that is currently using a tilemap. Document Dialog A container with a title, Returns: Phaser. If creating a Game Object, the horizontal position in the world. roundPx: set true to round the camera position to integers; lerpX, lerpY: A value between 0 and 1. 1: Camera will more slowly track the target, giving a smooth transition. Use the forum to ask questions, get support, solicit feedback on your games and find out what other developers are up to! A Geometry Mask can be applied to a Game Object to hide any pixels of it which don't intersect a visible pixel from the geometry mask. Shader - this. DOM game object. GameObject. Why Phaser; News; Pricing; Games; a more complex time meter with is container and the energy bar a little more good looking than a simple rectangle. Here are some UI components of phaser3. container(0, 0); // vision mask const vision_mask = this. GeometryMask: The mask this Game Object A Bitmap Mask combines the alpha (opacity) of a masked pixel with the alpha of another pixel. add. If a mask is already set on this Game Object it will be immediately replaced. childrenContainer (‘Container’) Applying mask to Widget itself works and clips its children well, Phaser 3. matter physics body test camera. A number : Scale mask texture size. 24 a simple Scene using regular Containers this would consume 278 GL commands with 4 draw calls and 4 clears. I hope the following code is useful to people who want to implement a simple scrollable carousel or gallery feature without having to use third party libraries - it took me a while so perhaps others can save some time. 0 API Documentation; Namespaces; Game Objects; Physics; Phaser. Description: The parent Container of this Game Description: The Mask this Game Object is using during render. or. 0). Container; Since: 3. Inherits: Phaser. 0 API Documentation; Namespaces; Game Objects; Physics; Events; Class; Functions; Constants; Typedefs; Collapse ⌃ \ GameObjects. Hope I have explained it. Android and desktop have always been pretty great performance-wise using Phaser CE but iOS and iPadOS had some issues where either Canvas or WebGL would perform bad and so These archived docs are for Phaser 2. A plain object {left, right, top, bottom} mask. Default behavior. Labs This includes calls that may come from a Group, Container or the Scene itself. GeometryMask Shaders can be masked with either Bitmap or Geometry masks and can also be used as a Bitmap Mask for a Camera or other Game Object. I guess that mask will be applied in world actionMask: Set true to add a circle mask on action icon game object. Hi, I work for an online gaming company and we have a slot game engine which has been running Phaser CE up until recently but we are now updating the engine to use Phaser 3. 17. Pointer. maskObject. Math. timeLeft = gameOptions. You can toggle this at any time after setCrop has been called, to turn cropping on or off. This makes it very difficult, if not near impossible to structure and manage things like carousels, scroll bars, etc without using third party libraries. number. config. 0 Folders with this symbol contain examples that require a Developer license Returns: Phaser. Games can be built for the web, or as YouTube Playables, Discord Activies, Twitch Overlays or compiled to iOS, Android, Steam and native apps using 3rd This includes calls that may come from a Group, Container or the Scene itself. " And acording to this post on Apply mask on game object. Image - this. GeometryMask: The mask this Game Object will use when rendering. 3: 660: May 25 Description: The Mask this Game Object is using during render. 'center': Align game objects at center. Default value. It encapsulates a Spine Skeleton with Spine Animation Data and Animation State, with helper methods to allow you to easily change the skin, slot attachment, bone positions and more. GameObjects. DynamicTexture. 11. Only a Container on the root of the display list will use its mask. This one is for a single row of horizontal scrolling, but of course can be adapted for other requirements. if the Graphics Game Object of the Geometry Mask has a visible pixel at the same position. mask: Phaser. mask. image. Container . RIGHT RIGHT: Phaser. Notes of Phaser 3 phaser3-rex-notes Home System System Game Game Game Main loop Container Container Container Container collisionFilter. 55 has now been released to GitHub and npm. Back Edit in Sandbox iFrame 100%. Effects Introduction¶. The masks do not 'stack up'. Description: A Version Phaser Version: 3. 1, or 'ellipse': Ellipse mask. The Geometry Mask's location matches the location of its Graphics object, not the location of Hi everyone, I’m having an issue with my understanding of mask behaviour. It seems the functionality for nested masks has been added. If you need those kind of features then you should use a Container instead. World: A reference to the Matter. Barrel Distortion: A nice pinch / bulge distortion effect. Built-in pre-fx, and post-fx shader effects. 85. If null it will generate an Image Game Object using the rest of the arguments. But only the Container can be used to transform the children (in position, angle and scale). However, you can set the Alpha, Blend Mode, Depth, Mask and Visible state of a Layer. When I open missionScene I want to disable all input on gameScene. Live demos Yes/No dialog Single choice dialog Tabs-tables Pop-up menus Textbox Number bar Round rectangle Sizer Layout children game objects. You can treat it like any other Game Object in your game, such as tweening it, scaling it, or enabling it for input or physics. If a mask is already set on this Camera it will be immediately replaced. radius: Radius of round rectangle mask. Hello I'm glad to report my situation here, I'm plan to migrate my phaser ce to phaser 3, But I'm blcoked by a issue, here's my issus outline: I have a batch of image, and I want to mask everyone of it (such as mask a circle over avator), then add these item to one container, and set this container for dragonbone's slot. This technique unlocks a variety of visual effects, from creating spotlights and vignettes Containers can have masks set on them and can be used as a mask too. The Pointer responsible for triggering this event. Container children can also be enabled for input, independent of the Note: Bitmap Masks only work on WebGL. 0 Phaser 3 docs can be found on newdocs. Concave and convex hulls. Buttons: A container with a group of buttons. After the scroller component is scrolled, the container child item moves outside the display viewport, and the child item can still accept interactive events. boolean. " Desktop and Mobile HTML5 game framework. Unfortunately Phaser 3 does not support masks on container children, but as long as the Text object is not a direct child of the container, the mask will hide the overflow content on both the top and bottom of the Text: name. sprite(game. GeometryMask Description: The Mask this Game Object is using during render. Note: Bitmap Masks only work How to create a masked content object with mask inside the class? Mask must be a class member (changes self coordinates according the parent gameobject). 20. dkqdxrvddnsjtzzvswblqtovwrnhraghnkztxrsuosrweqxbjiuzv