Jump to content

Retina Setting?


Recommended Posts

Hi @enpu


I'm writing a tutorial about setting up Panda and the config file and I've noticed that the hires mode doesn't work without the retina setting.


I can't however find anything about the retina setting in the Panda.js Cheatsheet.


Is hires supposed to work without retina set to true?


Thank you!

Link to comment
Share on other sites

You don't need to use retina with hires. They are totally different things.

Retina is used on devices with pixel ratio of 2, like MacBook Retina.


Let's say you have hires mode turned off and retina on, your game size is 100x100.

Retina setting would double the canvas size to 200x200, load @2x assets and then use CSS to shrink it back to 100x100, giving you sharp retina graphics.

(So your canvas would look like 100x100, but really it's 200x200 because of pixel ratio of 2)


If you have hires set at 2 and retina turned on, you would need both @2x and @4x assets,

because hires will first resize your canvas to 200x200 (if your window is big enough) and use @2x assets, and then retina would need @4x assets.


Does that make sense?

Link to comment
Share on other sites

Hi @enpu


Awesome! Thank for the detailed explanation ... it makes some sense :)


I have one more question please ...


I've noticed, that if I don't have retina enabled (on Master version), the highest assets loaded on my Retina Macbook Pro are @2x.


The Macbook Pro Retina should technically support upto @6x if using 480x320 as a base, but its not even loading @4x without retina enabled.


I think this is because of the Pixel Ratio of 2.


If I want to display @4x in the browser (or the sharpest possible graphics available at fullscreen), I would have to use both hires and retina, otherwise the highest assets loaded will be @2x, since Macbooks retina screen blows everything up by x2.


Please tell me if I'm completely wrong haha!

Link to comment
Share on other sites

It depends on your browser window size, for example, i have 15" MacBook Pro Retina and my window size on Chrome is 1385x806 (window.innerWidth and window.innerHeight).


So for 480x320 game size, @2x would be biggest on hires, and @4x on retina.

@6x hires size would need at least 2880x1920 window size.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

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