WE and Retina screens

Hey all,
I’m sitting here thinking about WE apps and retina displays.
Anyone know if there’s an “easy” way of recognizing a retina display and serve an @2x image in a web app?
Similar to what Ohanaware’s Retina Kit does on OS X?

I have no idea where to start…

You could always use 2x image and do:
For example a 256x256 image:

g.drawpicture 0,0,128,128,0,0,256,256

The problem with that is that you would be essentially making image delivery 4x slower to everyone, regardless of whether they had a retina screen or not.

You could use the WebSDK and hook into the property and event which safari and mobile safari provide for this task.

var dpr = window.devicePixelRatio | 1;

You can read more about these capabilities at:

Serving Images to Retina Displays

Thank you guys.
So I might need to look into the WebSDK I guess :slight_smile:

Greg, how about spending some time to implement this to Web engine?
e.g. with case 29686 where each WebPicture has an alternative Picture, so the web engine can decide which to show depending on target system resolution.

I was kind of hoping for an easy solution but hey, there’s not always an easy way out :wink:

Maybe we could come up with some javascript to update each image view with a new image if the compute has retina?

It’s certainly on the list of things that I want to do, but I also don’t want to slap something in only to have the API change when we release desktop support.

If anyone is going to do that, make sure that you implement the javascript event to update the property. It’s certainly possible that someone could have a Retina display and a non-retina display and if they drag the window from one to the other, depending on the image resolution, it may be prudent to load a higher or lower resolution image.

If someone has the “know-how” to do this I guess it could be worth something :slight_smile:

I hope Xojo, Inc. can get it done for r1.
If that is not possible Greg, we would look into a custom javascript solution.

Web Essentials from StudioStable.com supports Retina for web edition (and a dozen of other very useful add-ons)
It makes web apps possible that actually look like iOS Apps.
(I’m not sponsored but found the kit indispensable like MonkeBreadSoftware’s plugins for Desktop Apps.)

[quote=129485:@Boudewijn Krijger]Web Essentials from StudioStable.com supports Retina for web edition (and a dozen of other very useful add-ons)
It makes web apps possible that actually look like iOS Apps.
(I’m not sponsored but found the kit indispensable like MonkeBreadSoftware’s plugins for Desktop Apps.)[/quote]
Quote from Web Essentials Site:

Too bad :confused:

[quote=129493:@Albin Kiland]Quote from Web Essentials Site:

I am no longer developing solutions for use with Xojo or accepting new customers for Xojo related products or consulting.
Too bad :confused:

[/quote]

Effectively :frowning:
Brad has contributed much to the community, especially for the WE.

That is truly bad news… Hopefully Xojo will start doing some of the work Brad did.
There are quite a few areas where Xojo WE itself falls short.

Fyi. I ended up using SVG images instead.
They are XML based vector graphics and look amazing on a retina display without any hassle :slight_smile:

[quote=155505:@Albin Kiland]Fyi. I ended up using SVG images instead.
They are XML based vector graphics and look amazing on a retina display without any hassle :)[/quote]
Did you have to do that via the WebSDK?

Nope. Just enter the URL to the SVG file in a WebImageViews URL and voilà :slight_smile:
As I have a Stand Alone app that is not sure to have access to a web server like apache the app serves the images to itself using HandleSpecialURL.

I also created a sub classed WebImageView so that I can easily enter the name of the image(so I don’t have to enter the whole URL…) and the size I want it in the Inspector :slight_smile:

[quote=155518:@Albin Kiland]Nope. Just enter the URL to the SVG file in a WebImageViews URL and voilà :slight_smile:
As I have a Stand Alone app that is not sure to have access to a web server like apache the app serves the images to itself using HandleSpecialURL.

I also created a sub classed WebImageView so that I can easily enter the name of the image(so I don’t have to enter the whole URL…) and the size I want it in the Inspector :)[/quote]

Ah, of course, good call. The idea of using a WebImageView subclass to automatically prefix the runtime url is very good.

I guess with Xojo 2014r3+ you could now switch to using the HandleURL event as well and use your own /assets/ or similar path.

Thanks for sharing that Albin, I’ll be switching back to SVG for my next app.