Transparent PNG causing issues with Canvas.Backdrop

Neither do I - but I guess Julian could tell us more about the how’s and why’s :slight_smile:
So look at it as a possible workaround…
…I just thought that if the canvas isn’t causing the problem, then maybe refreshing the part below it might help for this issue. And it seems it does.

FWIW, I had a look at the two images on mac & windows 10 and found that on Windows 10 it really does think that the Presets image is more opaque. That said, I opened the two images in Pixelmator and GraphicConverter and see no difference between the two.

Thanks for the demo Steve, it makes it a lot quicker to work on than to try and explain everything without something to point at :wink:

Here’s a fixed version:

https://www.dropbox.com/s/5uu6dacwgmvdycz/DEMO%20ToggleButton%20Transparent%20PNG%20files%20FIXED.zip?dl=1

I’ve sprinkled comments through the source to show what I did. This method only works because the background is opaque.

It basically over draws the button with a cut out of the background then allows the button to rerender over the top. This gives the semi-transparent button a fresh background to render on so you dont keep overpainting a semi-transparent image with another semi-transparent image (which was why the button was getting darker).

While the RefreshRect seems to work and would be a simple/nice fix it doesn’t remove flicker (see the comments in the source).

Any questions, let me know.

As for the ? icon you show above, if its visible then just do a similar thing with that, right before the “//text MODE” comment in cnMODE.Paint, render the cut portion again (the bottom right portion of the ?)

Ideally, you’d make the cnMODE canvas a little bigger and render it all on that and not use a canvas over a canvas :slight_smile:

Hmm, scrub that because you would also need to tweak the hit detection then.

Fun and games :slight_smile:

Thanks Julian, very much appreciated that you took the time.

Your solution has “less” flicker than Jurg’s: “me.TrueWindow.RefreshRect” method. Nevertheless, there is still some minor flicker when using 2016R3. It may seem that I’m ungrateful, but I assure you that is not the case. Your method has the better results.

I’m wondering if this issue is particular to Windows OS? If so, then I guess I should move this post to the Windows channel?

I’ll load it up in 2016R3 and let you know.

You can fix that by turning off the Transparent property on cnvMODE in the IDE. You don’t need that now anyway as you’re painting an opaque image (brushedsteelblueforverticalspecspanel) on the canvas before painting your transparent button.

You could move the whole thread into the Windows channel if you wanted, but it might help a few MacOS developers that are trying to bring their apps across to Windows if it stays where it is. Hopefully none of this will need to be done when the Windows framework update is released by Xojo (my fingers are so crossed they are almost breaking ;))

Oh Julian!!! . . . May your Gods bless you and your prodigy!!!

Fabubulous!! Turning off Transparency (although seemingly counter-productive) absolutely solved it.

I cannot see ANY flicker whatsoever!!!.. It took me some time to respond to your last post because I was fixated by it’s pure beauty - just to look at it… no flicker :slight_smile:

I’m glad its working for you, now you have the tools to make beautiful windows app :slight_smile:

You might want to move the “answer” linked above so future searches don’t have people using the flickering fix, which would make me :frowning:

Ok, that is an issue. The “answer” has been changed.

But… it’s important to mention that Jurgs solution also has merit.