Retina output

Home Forums Procoding Retina output

Tagged: 

This topic contains 5 replies, has 1 voice, and was last updated by  audiocommander 5 years, 5 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #944

    KM7

    Hello!

    Thanks for the nice aplication. I purchased both ios & Mac version of procoding!

    It has been great fun. But Do you have any idea how to output an html file with retina surpport?(both on mac book pro retina & ios)

    Thanks!
    Kenny

    #945

    audiocommander
    Keymaster

    Hi Kenny,

    thanks for your kind feedback :)

    May I ask what you are trying to do and why do you think it’s not working? Because Procoding has full Retina support for HiRes displays. It should work out of the box, also for HTML exports.
    If you’re on a retina display, width & height should report the full pixel width/height and not the downscaled size (without the displayScale).

    Best,
    Michael

    #946

    KM7

    Thanks for your respond!

    I notice it is supported if I used a normal browser!

    Sorry I did not spot it out at the first place.

    The thing is, I am trying to build a mobile application using Phonegap. But for some reason the canvas just really huge canvas.

    Could you give me some hint about how your code works and how to improve it?

    I got absolutely no idea now :)

    #947

    audiocommander
    Keymaster

    Hi,

    getting the Canvas Object to play nicely with Retina displays isn’t very straightforward, because it doesn’t change it’s resolution.

    For example, a canvas object on a normal device with 400px width has 400px width. For retina devices, it also has 400px width, but a device pixel ratio of 2.0. That means the canvas only shows a quarter of all available pixels resulting in a blurry display.

    Therefore Procoding checks for the devices pixel ratio and applies this to the viewport and the size of the canvas element, effectively doubling the size (quadrupling the pixels) to it’s full pixel width/height.

    If I were to make a phonegap project, I would probably use Procoding to develop small chunks of the project and then assemble these in a conventional way (typically I’m using Bash or Grunt Scripts to compile my js sources to another directory).
    If you’re not developing fullscreen processing.js, there is little to no reason to keep the special Procoding stuff. The resource manager really just inserts HTML tags on the fly, not much magic involved here…

    Also: using relative values (width = canvas.width * 0.5) instead of absolute ones (width = 200px) is always a good idea!

    Hope that helps,
    Michael

    #954

    KM7

    Thanks Michael!

    It does make more sense now, though I still need more thinking&testing.

    Kenny

    #955

    audiocommander
    Keymaster

    Hi Kenny,

    have you tried adding these lines to your sketch:


    /* global procoding:false */
    procoding.prefs.ignoreRetina = true;
    procoding.initSize();

    Does this help?
    Note however, that the canvas element won’t look as crisp as it could.

    Best,
    Michael

Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘Retina output’ is closed to new replies.