Canvas Transparency?

Targets macOS
1

This one is bugging me.
Is it possible to have a canvas become 50% transparent upon mouseover?

I created a Boolean property called “MouseIsOver”.

I have this code in the MouseEnter event:

MouseIsOver = True

And this code in the MouseExit event:

MouseIsOver = False

I then have the following code in the Canvas paint event:

// INSERT RETINA OR NORMAL IMAGE static StartImage as RKPicture StartImage = retinaKit.imageNamed( "IntroImage" ) g.drawpicture StartImage, 0, 0, StartImage.width, StartImage.height

This works fine and displays either a retina image, or a standard image into the canvas.

I then tried adding this below the code, to make the transparency - to no avail :frowning:

If MouseIsOver = True Then g.Transparency = 50 Else g.Transparency = 0 End If

Is it not possible to make a transparent rollover on a canvas?

Thank you all.

2

You need to update the canvas too.
So add me.invalidate in the mouse enter and exit events after the MouseIsOver code.

3

That makes no difference - still no transparency :frowning:

4

Ahhh - here is the solution just in case someone else has the same problem:

[code]// INSERT RETINA OR NORMAL IMAGE
static StartImage as RKPicture
StartImage = retinaKit.imageNamed( “IntroImage” )

If MouseIsOver = True Then
g.Transparency = 50
g.drawpicture StartImage, 0, 0, StartImage.width, StartImage.height

Else
g.Transparency = 0
g.drawpicture StartImage, 0, 0, StartImage.width, StartImage.height
End If[/code]

5

You still need the me.invalidate in the mouse enter and exit events. Otherwise it will not update. Just doing that will do the job fine.
Not sure why it didn’t on your system.

If MouseIsOver = True Then g.Transparency = 50 Else g.Transparency = 0 End If g.drawpicture StartImage, 0, 0, StartImage.width, StartImage.height

6

Yes - I have the invalidate line of code in the mouse events also. All working perfect now :slight_smile:

7

Just a hint:

Using an IF THEN in the paint event can slow down things (well, if you use it a lot).

In your case you could make an Integer property instead of an boolean: for example OverTransparency
In the Enter event you set the integer property to 50
In the Exit you set it to 0

Then change the code in the paint event to:

g.Transparency = OverTransparency
g.drawpicture StartImage, 0, 0, StartImage.width, StartImage.height

This way you avoid using an IF THEN and optimised your code for speed.

8

Thanks Christoph - much appreciated.

9

[quote=190592:@Richard Summers]Ahhh - here is the solution just in case someone else has the same problem:

[code]// INSERT RETINA OR NORMAL IMAGE
static StartImage as RKPicture
StartImage = retinaKit.imageNamed( “IntroImage” )

If MouseIsOver = True Then
g.Transparency = 50
g.drawpicture StartImage, 0, 0, StartImage.width, StartImage.height

Else
g.Transparency = 0
g.drawpicture StartImage, 0, 0, StartImage.width, StartImage.height
End If[/code][/quote]

Richard in addition,

I use window transparency using NSWindow with MacOSLib alot on my opening Splash Screens. :slight_smile:

On a window --> Open Event:

  nsw = New NSWindow(self)
  
  // NSWINDOW PROPERTY SETTING
  nsw.Transparency = 50

 // CENTER THE WINDOW
  nsw.Center
  
  // AWESOME COCOA ANIMATED WINDOW ENTRANCE
  nsw.AnimationBehavior = NSWindow.NSWindowAnimationBehavior.NSWindowAnimationBehaviorDocumentWindow
  nsw.MovableByBackground = true