Am I overthinking HiDPI pictures?

General
1

In general, Xojo’s HiDPI support is pretty good. It requires very little thought. Until you need to create pictures…

In this case, I’m taking a few different pictures and compositing them together into a single picture to reuse it multiple times. It greatly simplifies the code. Normally, it would look something like:

Dim Composite As New Picture(40, 40) Composite.Graphics.DrawPicture(Shadow, 0, 0) Composite.Graphics.DrawPicture(Background, 0, 0) Composite.Graphics.DrawPicture(Foreground, 0, 0)

And I’d be done. But with HiDPI, that will only produce a 1.0 image, which is understandable. The problem is creating a version for the intended scale. This is in a paint event, so I only ever need a single scaling factor at a time.

I have tried setting Composite.Graphics.ScaleX and ScaleY accordingly, but that just makes everything draw larger. Composite.HorizontalResolution and VerticalResolution have no effect.

The ONLY thing I’ve found to work is manually creating one picture for each possible scale factor:

[code]Dim Composites() As Picture
For Factor As Integer = 1 To 3
Dim BestShadow As Picture = Shadow.BestRepresentation(40, 40, Factor)
Dim BestBackground As Picture = Shadow.BestRepresentation(40, 40, Factor)
Dim BestForeground As Picture = Shadow.BestRepresentation(40, 40, Factor)

Dim Pic As New Picture(40 * Factor, 40 * Factor)
Pic.Graphics.DrawPicture(BestShadow, 0, 0, BestShadow.Width, BestShadow.Height, 0, 0, BestShadow.Width, BestShadow.Height)
Pic.Graphics.DrawPicture(BestBackground, 0, 0, BestBackground.Width, BestBackground.Height, 0, 0, BestBackground.Width, BestBackground.Height)
Pic.Graphics.DrawPicture(BestForeground, 0, 0, BestForeground.Width, BestForeground.Height, 0, 0, BestForeground.Width, BestForeground.Height)

Composites.Append(Pic)
Next
Dim Composite As New Picture(40, 40, Composites)[/code]

This is maddeningly frustrating because it’s not only a lot of code, I have no use for 2/3 of the images I just created. There has to be a better way. Please tell me I’m missing something obvious. Because everything else about Xojo’s HiDPI is pretty elegant, I have a hard time believing this mess is the “right” way to do it.

2

Why do you scale each layer separately? Why not just draw the picture once, and add scaled versions to composite?

3

I can’t figure out what you’re asking.

4

Draw @x3 image and scale down to @x2 and @x1 ?

5

So the long and the short of it is, while the size in points never changes, the size in pixels does. When you create a new picture in Xojo, you specify the size in pixels, not points.

There is a function in Xojo for creating a picture for display on the screen where you can specify the size in points, but I can’t think of it right now. I’ve been using API for this for so long, that I can’t recall the Xojo function.

Then you draw to that image.

Edit: Found it…
http://documentation.xojo.com/index.php/Window.BitmapForCaching

6

[quote=363866:@Sam Rowlands]So the long and the short of it is, while the size in points never changes, the size in pixels does. When you create a new picture in Xojo, you specify the size in pixels, not points.

There is a function in Xojo for creating a picture for display on the screen where you can specify the size in points, but I can’t think of it right now. I’ve been using API for this for so long, that I can’t recall the Xojo function.

Then you draw to that image.

Edit: Found it…
http://documentation.xojo.com/index.php/Window.BitmapForCaching[/quote]
Yep, that’s the missing link I was looking for. I think I would have called literally anything else, but it’ll do the job.

7

Oh that could be what he means. Yeah definitely not a good option. It just doesn’t look right.

8

Sorry Thom, I was not totally awaken…

In your usual Paint (or Draw) software, you create a 3x image (Say 40,40,300),
then you create the 2x (40,40,144) and 1x (40,40,72) images,
then you import all of them in your Composite image.

That is what I had in my head (not exactly what I wrote).

9

[quote=363886:@Emile Schwarz]Sorry Thom, I was not totally awaken…

In your usual Paint (or Draw) software, you create a 3x image (Say 40,40,300),
then you create the 2x (40,40,144) and 1x (40,40,72) images,
then you import all of them in your Composite image.

That is what I had in my head (not exactly what I wrote).[/quote]
Ah. That’s exactly what I’ve done. The pictures referenced are multi-resolution pictures. BestRepresentation will pick the one that fits best, though you should rarely need to use it.

10

There is no need for a @3x picture unless this is for iOS?

11

I’ve read that some Windows tablets will use it. Regardless, it takes literally zero extra effort, so I include it just in case. It’s just an extra line in the Photoshop export.

12

Then it’s not literally zero extra effort … :wink:

13

Haha, I’ll give you that.

14

Dont create 3 pictures with dimensions & DPI set as
40 x 40 @ 72 as 1x
40 x 40 @ 144 as 2x
40 x 40 @ 216 as 3x

DO increase the starting picture size and set the scales
40 x 40 @ 72 as 1x with scale x and scaley = 1
80 x 80 @ 72 as 2x with scale x and scaley = 2
120 x 120 @ 72 as 3x with scale x and scaley = 3

draw and composite accordingly

15

So in my first block of code, given that each of the 3 pictures are multi-res project items, setting the scale on each will allow me to draw them to the new composite picture “correctly” and then that picture to the paint graphics will be correct? That doesn’t make a lot of sense to me.

16

If you create an ImageSet with @1, @2, [@3] versions of the picture, then as far as controls that use pictures, you’re pretty much done.

  • A Xojo Toolbar will switch icons automagicly if the screen scale changes
  • Paint Event of Canvas and similar controls will chose the correct image in [g.drawpicture mypic,0,0] where myPic is the imageset

These are just some examples… I too am “new” to using Retina [just got my first Retina iMac a few weeks ago]. but so far those two items are working for me in my current project

Just refer to the ImageSet not the specific member of the set.

I’m sure there is a lot more…

17

[quote=363945:@Dave S]If you create an ImageSet with @1, @2, [@3] versions of the picture, then as far as controls that use pictures, you’re pretty much done.

  • A Xojo Toolbar will switch icons automagicly if the screen scale changes
  • Paint Event of Canvas and similar controls will chose the correct image in [g.drawpicture mypic,0,0] where myPic is the imageset

These are just some examples… I too am “new” to using Retina [just got my first Retina iMac a few weeks ago]. but so far those two items are working for me in my current project

Just refer to the ImageSet not the specific member of the set.

I’m sure there is a lot more…[/quote]
I know that. That’s what I mean when I say HiDPI support is pretty good. But if I want to CREATE a picture, things break down a bit. However, I have not tried the method @Sam Rowlands suggest yet. That looks like the answer.

18

[quote=363922:@Norman Palardy]Dont create 3 pictures with dimensions & DPI set as
40 x 40 @ 72 as 1x
40 x 40 @ 144 as 2x
40 x 40 @ 216 as 3x

DO increase the starting picture size and set the scales
40 x 40 @ 72 as 1x with scale x and scaley = 1
80 x 80 @ 72 as 2x with scale x and scaley = 2
120 x 120 @ 72 as 3x with scale x and scaley = 3

draw and composite accordingly[/quote]
Once I sorted THIS out, the ImageSet logic made far more sense. The problem (for me) is that every other platform that I use asks for the PPI variation

19

Xcode doesn’t
They expect images the same way we do

20

I have a similar question I asked on this thread (I don’t know how link directly to my comment).

[quote]App.DockItem.ResetIcon still doesn’t work, or missed something. I searched in the FeedBack and there is an issue which has been verified, but not corrected?

I do as explainded Michel, I redraw MyApplicationIcon_1024 to restore the icon to its initial state.
But I have a question, since I checked in the “Shared” - “Supports Hi-DPI” the IDE indicate 3 pictures 1x, 2x and 3x. That’s normal and I understand why.
But in this case, I need a 1024 x 1024 picture, and only this one. Then I unchecked “Supports Hi-DPI”, I drag&drop my MyApplicationIcon_1024 to add it in my project and I recheck “Supports Hi-DPI”.
But is it the good thing to do? What shall I do? Added 3 times the same picture 1024x1024 in 1x, 2x and 3x ?[/quote]
In this case, I don’t care about the dpi.