Menú UI moderno para escritorio


Crearemos un Dashboard moderno para escritorio, tendrá colores degradados, una barra lateral tipo menú y botones con efecto hover que tendrán una animación simple.

Creamos un Form1.VB y copiamos el siguiente código:

Imports System.Drawing.Drawing2D
Public Class Form1
    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        Me.Text = "Mi Dashboard"
        Me.Size = New Size(900, 600)
        Me.FormBorderStyle = FormBorderStyle.None

        ' Panel lateral
        Dim sidebar As New Panel With {
            .Width = 200,
            .Dock = DockStyle.Left,
            .BackColor = Color.FromArgb(30, 30, 60)
        }
        Me.Controls.Add(sidebar)

        ' Panel principal
        Dim mainPanel As New Panel With {
            .Dock = DockStyle.Fill,
            .BackColor = Color.White
        }
        Me.Controls.Add(mainPanel)

        ' Botones menú
        Dim btn1 = CrearBoton("Inicio", 50)
        Dim btn2 = CrearBoton("Usuarios", 120)
        Dim btn3 = CrearBoton("Configuración", 190)
        Dim btn4 = CrearBoton("Salir", 260)

        sidebar.Controls.Add(btn1)
        sidebar.Controls.Add(btn2)
        sidebar.Controls.Add(btn3)
        sidebar.Controls.Add(btn4)

        ' Título
        Dim lbl As New Label With {
            .Text = "Bienvenido a HGX 👋",
            .Font = New Font("Segoe UI", 22, FontStyle.Bold),
            .ForeColor = Color.FromArgb(50, 50, 80),
            .Location = New Point(250, 50),
            .AutoSize = True
        }
        mainPanel.Controls.Add(lbl)
    End Sub

    ' Crear botones modernos
    Private Function CrearBoton(texto As String, top As Integer) As Button
        Dim btn As New Button With {
            .Text = texto,
            .Width = 180,
            .Height = 50,
            .Top = top,
            .Left = 10,
            .FlatStyle = FlatStyle.Flat,
            .BackColor = Color.FromArgb(50, 50, 90),
            .ForeColor = Color.White,
            .Font = New Font("Segoe UI", 11, FontStyle.Bold)
        }

        btn.FlatAppearance.BorderSize = 0

        ' Hover efecto
        AddHandler btn.MouseEnter, 
            Sub() btn.BackColor = Color.FromArgb(80, 80, 140)
            End Sub

        AddHandler btn.MouseLeave, 
            Sub() btn.BackColor = Color.FromArgb(50, 50, 90)
             End Sub

        Return btn
    End Function

    ' Fondo degradado
    Protected Overrides Sub OnPaint(e As PaintEventArgs)
        Dim brush As New LinearGradientBrush(Me.ClientRectangle,
                                             Color.FromArgb(100, 149, 237),
                                             Color.FromArgb(72, 61, 139),
                                             45)
        e.Graphics.FillRectangle(brush, Me.ClientRectangle)
    End Sub
End Class

Ejecutamos la Form y veremos el resultado.




Publicar un comentario

0 Comentarios