X-ray effect around cursor?

[LightAndDark]

Is there any possible way to create an X-ray effect around the cursor, i.e. when the cursor hovers over an image, part of the image is made transparent revealing a different image underneath? But only for a radius around the cursor.

I can't seem to find any info about this online and don't know if it's even possible

[Per K Grok]

Is there any possible way to create an X-ray effect around the cursor, i.e. when the cursor hovers over an image, part of the image is made transparent revealing a different image underneath? But only for a radius around the cursor.

I can't seem to find any info about this online and don't know if it's even possible

I think it should be possible to do with a creator defined displayable and pygame functions.

You would need to load the image that is to be seen to into a pygame surface. You can now get data for the individual pixles of that image

Using the mouse coordinates you can determine which ,if any, of the pixels are to be seen. You blit those pixels to a new surface and add this in a screen on top of everything else. The mouse-pointer then go on top of that. The displayable needs to be update continually.

[Milkymalk]

Why not make it the other way around? Instead of making the top image transparent, you could paste a portion of the "lower" image on top of the top image where the cursor is. First get the mouse coordinates, then crop the X-ray image to whatever it should show at these coordinates, then display that portion where the cursor is. To have it follow the cursor, you can do it similar to the old, now obsolete tooltip tutorial:
viewtopic.php?t=47205
Alternatively, you could make a screen which contains the X-ray image in a composite with a mask image that follows the cursor. This might be better if moving the mouse drags the X-ray cropout faster than it can be updated.

[m_from_space]

Hey, I just created a user defined Displayable, that acts as an x-ray device. It follows the mouse cursor and also allows an overlay (like a device). The Displayable refers to a frame when applying the x-ray effect, so you have to position the target image (like a person with clothes) at the same position and size as the frame to have a realistic effect. The x-ray source image should be the same size as the frame for best effects. The Displayable accounts for the border of the frame and only applies the effect if the x-ray mask (like a round shape) is actually overlapping it. Just try it out.

Some feedback would be nice, I just began working on user defined Displayables. But it's my second one that I really like, the first one is a secret.

Here is the code. Files that are used in the example are attached, just put them in your images folder inside the project.

Code: Select all

I don't like people not responding. Have fun.