Graphics.DrawPicture cropping image in DrawControlInLayout SDK

In 2021r2.1, I have a PNG image that I am loading into the IDE using Graphics.DrawPicture within DrawControlInLayout. My code for doing this:

Dim Pic As Picture = PictureProperty("ImagePNG")
g.DrawPicture(Pic, 0, 0, g.Width, g.Height, 0, 0, Pic.Width, Pic.Height)

For images that are square or a close to square aspect, this works great and will scale the image to the shape of the control fine. However, images that are more rectangular in aspect are being cropped instead of being stretched to fit the dimensions of the control. For example:

This is the image that is being added to the control:

And this is how it’s being displayed in the IDE:

I have tried scaling the image with this code which i use for other images:

Dim factorwidth As Double = g.Width / Pic.Width
Dim factorheight As Double = g.Height / Pic.Height

Dim factor As Double = min(factorwidth, factorheight)

Dim w As Integer = Pic.Width * factor
Dim h As Integer = Pic.Height * factor
Dim NewPic As New Picture( w, h )

g.PixelOffsetMode = PixelOffsetMode.HighQuality;
g.DrawPicture( Pic, 0, 0, w, h, 0, 0, Pic.Width, Pic.Height )
Pic = NewPic

But this is only making the image worse and instead reducing the image by about 50% scale and still being cropped at the same points.

Does anyone have any ideas?

Could you create a simple project and post it?

Sure. Here it is. @Greg_O_Lone

On VisualControl1, The “VectorImagePic” stores/displays the image for the IDE, Whereas “SvgName” is manually typed to choose the SVG/JSON animation to show in the browser.

Attached with the project are a couple of example images along with the robot one used to demonstrate the issue

Verified. I’ve created a case.

1 Like

Here’s a workaround for now:

Dim Pic As Picture = PictureProperty("VectorImagePic")

// Grab the pic width & height
Dim pw As Integer = pic.Width
Dim ph As Integer = pic.Height

// swap them because it's broken in 2021r2.1
pw = pic.Height
ph = pic.Width

Dim factorwidth As Double = g.Width / pw
Dim factorheight As Double = g.Height / ph

Dim factor As Double = min(factorwidth, factorheight)

Dim w As Integer = pw * factor
Dim h As Integer = ph * factor
Dim x As Integer = (g.Width - w) / 2
Dim y As Integer = (g.Height - h) / 2

g.DrawPicture(Pic, x, y, w, h, 0, 0, pw, ph)
1 Like

There are a couple of of bugs for WebSDKUIControl.DrawControlInLayoutEditor: <https://xojo.com/issue/64051>

That’s great thank you very much.