Canvas with transparent image overlying listbox

Hi all

I have a listbox with financial data. On top of that listbox is a transparent canvas.

When the user filters their data, the canvas gets a backdrop with a “filter” image, which is a partially transparent png. It aims to be a watermark that reminds the user that they are looking at a filtered set of results.

On Mac it works beautifully.

On Windows, it also works beautifully.

Except when the user scrolls the listbox. Then it looks like this:

That central bit is the canvas with my “watermark” where the listbox is not being redrawn properly.

I read in the documentation that the canvas.transparent property doesn’t work on Windows - so I have brought the listbox to the front. The canvas still shows fine, until the listbox is scrolled.

How can I get around this?

This is probably not what you want to hear, but here it goes:
I would avoid this approach completely on Windows. You are likely to get slow redraw and perhaps flicker. Instead, I would display the funnel image in the toolbar area, where it does not interfere with the main data area. You would also save the part where you copy the listbox image to the canvas.

FWIW, I am also not a big fan of red in a normal data area. Especially with financial data, where red is usually not a good thing. (nobody wants to be “in the red”)

A refresh on the canvas, when the user scrolls the list, might do it.

Thanks gentlemen. I’ll try the refresh, and if it doesn’t work, then an alternative technique.

The colour scheme is red for my expenses sheet, green for income, etc