Retina support question

[PixelPicoSean]

I found a topic about retina support in Panda.js but it's about the old pixi versions, I just want to ask how can I make it work for now? 

 

Well I realize bamboo does not have retina support, those texts and lines are blur. I just checked the canvas element which does not have width and height set to twice of css size. It won't work even set system.retina to true.

 

Can anyone give me some advice?

 

Ragards,

Sean

[Ninjadoodle]

Hi @PixelPicoSean

 

I have no experience with bamboo yet, so I'm afraid I can't help you there.

 

If however you're just trying to get hires/retina to work ... I have it working in both of the games I've made with Panda.

 

What exactly is the issue, you're running into?

[PixelPicoSean]

The problem I got is that texts are blur on my Mac, which should be better if set the canvas size twice of canvas style size. Fonts looks very nice on a retina screen but it does not. Then I figure that retina and hires property of system are always false even I set them directly from config :/

[Ninjadoodle]

Hmm, I use a Macbook Pro (retina) and the way I handle fonts, is by using bmGlyph and exporting @2x and @4x assets.

 

I use 480x320 for my base game resolution. All my standard assets are created for those dimensions, but I also provide assets twice as big and four times as big, letting the engine decide when to load high resolution graphics.

 

This works for both fonts and graphics and your game looks crisp on a Mac screen and works just as well on an iPhone 4.

 

The options I use in my config are ...

system: {    hires: 4,    retina: true,    scaleToFit: true, // DESKTOP BROWSERS    resizeToFill: true, // MOBILE BROWSERS    width: 480,    height: 320},

Let me know if you need any more help