how to set transparent opacity to panel

Question

how do i set panel transparent like opacity to 0. i set the panel by program and it was on top of video player. the code is like this

Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click  ', AxVLCPlugin21.Click       
    Dim panelx As New Panel
    panelx.Visible = True
    panelx.Size = New Size(AxVLCPlugin21.Width, CInt(AxVLCPlugin21.Height / 2))
    panelx.BackColor = System.Drawing.Color.Transparent
    AxVLCPlugin21.Controls.Add(panelx)        
    panelx.BringToFront()
    'AddHandler panelx.DoubleClick, AddressOf panelx_click
End Sub

the result is like this

then i try to play the video it only show the half

the reason i use panel is to pause the video (set panel on top of video by transparent), when i click the panel since the video doesn't support click event

update

i put the code in usercontrol1

still got me an error, although i have insert the code in designer. too clarify i put the code designer after below the main designer code. i have tried to put only inherit panel code in main designer code but it only take one inherit only.

Answer 1

The best way to do this is to create a custom control that inherits the panel class and overrides CreateParams and OnPaintBackground with this bit of code:

(Props to Zohar Peled for his post here)

Replace the code behind with:

Public Class TransparentPanel
    Inherits System.Windows.Forms.Panel

    Protected Overrides ReadOnly Property CreateParams() As CreateParams
        Get
            ' Make background transparent
            Dim cp As CreateParams = MyBase.CreateParams
            cp.ExStyle = cp.ExStyle Or &H20
            Return cp
        End Get
    End Property

    Protected Overrides Sub OnPaintBackground(e As PaintEventArgs)
        ' call MyBase.OnPaintBackground(e) only if the backColor is not Color.Transparent
        If Me.BackColor <> Color.Transparent Then
            MyBase.OnPaintBackground(e)
        End If
    End Sub
End Class

And replace the designer code with:

<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()>
Partial Class TransparentPanel
    Inherits System.Windows.Forms.Panel

    'Control overrides dispose to clean up the component list.
    <System.Diagnostics.DebuggerNonUserCode()>
    Protected Overrides Sub Dispose(ByVal disposing As Boolean)
        Try
            If disposing AndAlso components IsNot Nothing Then
                components.Dispose()
            End If
        Finally
            MyBase.Dispose(disposing)
        End Try
    End Sub

    'Required by the Control Designer
    Private components As System.ComponentModel.IContainer

    ' NOTE: The following procedure is required by the Component Designer
    ' It can be modified using the Component Designer.  Do not modify it
    ' using the code editor.
    <System.Diagnostics.DebuggerStepThrough()>
    Private Sub InitializeComponent()
        components = New System.ComponentModel.Container()
    End Sub

End Class

The code you're replacing may look different initially, but using this code will ensure everything works.

NOTE: This code will make the panel transparent if the backcolor is set to Transparent or Control (which depending on the control is normally actually the same as transparent.)

I tried to find an updated resource for creating and implementing a custom control, but I wasn't able to find a maintained resource. So here are some step by step instructions on how to create a custom control.

To create custom control usable in the designer:

(I'm using Visual Studio 2015 for the examples below, it may appear different in other versions.)

1. Create new Windows Forms Control Library

2. Then right click and rename your control to "TransparentPanel" (or whatever name you like)

3. Paste the code above into the code behind and the designer code respectively (changing the class name if you didn't use "TransparentPanel")

4. Build the project (this will create the .dll you will need to reference in your main project)

5. This one is optional, but it is good to store your DLLs somewhere consistent, other than the project bin folder, so, optionally, navigate to the control library bin folder and copy the created DLL to another location you want to store your custom DLLs.

6. Go to the project you want to use the control in, and right click in the toolbox and click "Choose Items..."

7. Make sure you are on the the ".NET Framework Component" tap and select "Browse".

8. Navigate to the bin folder of the control library (or where ever you stored the DLL), select the control and click "Open".

9. You will see the TransparentControl selected now in the "Choose Toolbox Items" form. Click "OK"

10. Then you should be able to find the control under "General" section.

11. Drag and drop the control onto your form.

NOTE: The control may not look transparent in the designer, but on runtime it should do what you are looking for.

I hope this works for you!