Canvas DrawOval & FillOval trying to draw with a tranparent background

General
1

Hello - Paul Lefebvre has a great canvas example project with objects that can be added, drag dropped or removed in the Canvas over a hubble space picture. It was from the Clever Canvas Youtube Video in 2014. I use the DrawOval, FillOval, DrawRect, FillRect. I can get these to draw Like Alpha Channel .png Transparent without the square background for the Oval. If I leave out the object feature without the Drag Drop & Delete, by just straight drawing them in. cvsCapturPic.PBuffer.Graphics.DrawOval(X, Y, W, H). I want to add the Drag Drop and Remove Object Feature to my Project but I keep getting the square background. I modified my code into Paul’s example Add Object Button Event. Code Below. My to the point question is how do I get it to draw without the square background? Picture Below.

  Dim PBuffer As  Picture
  Dim W, H As Integer
  
  For i As Integer = 0 To IconSelector.Items.UBound
    If IconSelector.Items(i).Selected Then
      Dim icon As Picture
      
      Select Case i
      Case 0
        icon = Pin24
      Case 1
        icon = Star24
      Case 2
        icon = Globe24
      Case 3
        W = 25
        H = 24
        PBuffer = New Picture(W, H, 32)
        PBuffer.Graphics.ForeColor =rgb(255, 10, 0) 
        PBuffer.Graphics.FillOval(0, 0, W-2, H-2)
        PBuffer.Graphics.PenHeight = 2
        PBuffer.Graphics.PenWidth = 2
        PBuffer.Graphics.ForeColor = rgb(0, 0, 255) 
        PBuffer.Graphics.DrawOval(0, 0, W-1, H)
        icon = PBuffer
      End Select
      
      DrawingCanvas.AddObject(icon, CaptionField.Text)
      
      Exit
    End If
  Next

DrawCanvasObject
DrawCanvasObject803×652 34.1 KB

2

Remove 32 there where you create the Picture buffer then you get picture with transparency.

As in only have W and H parameters, not depth.

1 Like
3

Thank You - That was it. My coding pea brain always thought the 32 had to always be there.

4

Well, its not obvious thing.

Its more of a historical thing of how the Picture object has changed over time.

So having the depth parameter creates old style Xojo Picture which is RGB in one picture and optionally Mask in 2nd Picture.

While if skipping depth then you get new style RGBA picture which actually includes the alpha channel in the picture.

1 Like
5

I tried adding the Alpha Channel Mask from Ugene Dankins Canvas Book Chapter 9 Example with no success. Been racking my brains out. It was just a simple remove 32 fix. Whoa! Thank You So Much

6

That should really be documented as that constructor is missing from the docs. @Geoff_Perlman

1 Like
7

It is cleary documented. Picture — Xojo documentation

8

There’s a lot of good info on that Picture Doc Page - Thanks Tim

9

I can only see:

Constructor (width as Integer, height as Integer)
Constructor (width as Integer, height as Integer, bitmaps() as Picture)

there is no constructor shown for:

Constructor (width as Integer, height as Integer, depth as Integer)

It was deprecated in 2020r2 but it’s used throughout that page in the examples so it should really be more clearly documented as looking for a little bit of text under something like HasAlphaChannel doesn’t really help new users.

10

Look at the example code; some use 0 as depth…

11

0 as depth means create vector image

12

And vector image have a transparent background (in fact they do not have backgrounds (if not set explicitely)…