Search the Community

Showing results for tags 'cropped'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Website URL


Twitter


Skype


Location


Interests

Found 2 results

  1. The Issue Text object is getting cut-off / cropped at the top and sometimes on the bottom, when using a custom font with a narrow width. (screenshot attached) The fonts in question work correctly in every other environment, and even work with HTML canvas and the regular getContext method of adding text. So i'm fairly positive the issue is isolated to Phaser using HTML canvas. Possible Cause I think issue is most likely happening due to the way Phaser/PIXI calculates the height of text from the width of letters. Possibly using the width of the widest letter and assuming the height? I tried to work out what the source code is doing. Current Workaround The only workaround i've found is rebuilding the font and adding a wide margin to each letter (so the letter boundaries are more 'square'), then in Phaser splitting a Text object into individual Text objects for letters and calculating their position based on letter width, and manually subtracting a value to change the letter spacing. But even splitting and repositioning doesn't work that well (with any font, not just thin fonts) i have to calculate separate margins for even thinner letters like 'I', 'i', or 'l', or wide letters like 'm' and 'w'. I would rather not use BitmapText as i need to use different font sizes. Solutions Has anybody else encountered this issue? Found a solution or a better work-around? Thanks.
  2. weavejester

    Filters that require a margin

    I've written a simple outline shader that adds a single pixel border around a sprite. It works well, except because sprite textures are commonly cropped, the outline is missing at the edges of the image. I've included a blown up image to show you what I mean. See how the border is missing at the tops of the ears and at the extremities of the limbs? What's the common way of dealing with shaders (like outline, blur, glow, etc.) that go over the edge of a cropped texture? Is there an easy way of adding a transparent margin around a texture? Or do I need to write a vertex shader to expand the size? I'm a little new to this, so I'd be grateful to learn of any solutions people might have.