galarant

Members
  • Content Count

    3
  • Joined

  • Last visited

  1. galarant

    Phaser.Text Inverted Crop Box

    Okay the masked worked! I got bit by the current "no masks allowed on container children" limitation in Phaser 3, but if my Text object is not a child of a container then a rectangular GeometryMask acheives my desired effect: /** * Unfortunately because of the container child masking issue in Phaser 3, * we cannot add the content directly as a child of the container. * Thus if the container mutates, we will need to manually mutate the content (and mask) along with it. * For more info refer to: https://github.com/photonstorm/phaser/issues/3673 */ let x = 100 let y = 100 container = scene.add.container(x, y) container.content = container.scene.add.text( container.x - container.width / 2, container.y - container.height / 2, "", container.defaultStyles ) container.content.setOrigin(0, 0) // set up a mask on the content // this will hide overflow text when we scroll let maskShape = scene.add.graphics(container.x, container.y) maskShape .clear() .fillStyle(0x000000, 0) .fillRect( container.x - container.width / 2, container.y - container.height / 2, container.width, container.height ) let mask = container.createGeometryMask(maskShape) container.content.setMask(mask)
  2. galarant

    Phaser.Text Inverted Crop Box

    Okay thanks I'll look into that! Sorry for the newb question, I assumed Masks were for something else.
  3. galarant

    Phaser.Text Inverted Crop Box

    I'm trying to create a text object that you can scroll up and down interactively, and I'm having trouble finding some functionality that will support this. I understand that I can crop the top of the text with Text.setCrop(...) but that will only suffice to crop either the top or the bottom of the text object, not both. What I need is the ability to either set multiple crop boxes on the Text object, or a sort of "inverted" crop box which will allow me to render only what's inside the box and hide the rest of it. Anyone aware of a trick or something that will allow me to do this? I can't use BitmapText or a Sprite object for this, it has to be a Text object.