Jump to content

Gradient backgrounds


Qqwy
 Share

Recommended Posts

In my game, I want to have a simple screen size rectangular area filled with a gradient(the start and stop color change per room) as a background.

 

In the canvas renderer, this is quite straightforward by using canvasContext.createLinearGradient

 

However, there are ways to do this in WebGL as well. I know how to write a shader for it, but not how to implement such a shader.

 

Also, as this is not text and just a simple rectangle, maybe there already exists some kind of function for it in Phaser?

 

Any help would be appreciated.

 

~Qqwy

Link to comment
Share on other sites

What you're looking for is the BitmapData object, which gives you a canvas context to play with, and use as a texture to your Sprite, Image and other objects. Create an instance of BitmapData, do your canvas trickery on its ctx or context property, then use it as the key to an Image instance and it'll work fine in both canvas and webGL.

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...