Saltar al contenido

Formulario Moderno+Iconos Font Awesome, WinForm, C# – VB.NET

Hola a todos, hoy os traigo un nuevo tutorial de diseño de interfaces  de usuario, moderno y multicolor, tanto en el botón, texto e iconos, con la opción de mantener resaltado el botón y mostrar el título e icono cuando el formulario secundario está abierto. Además de implementar todas las funcionalidades de redimensionamiento, arrastrar el formulario, maximizar, restaurar, minimizar y cerrar el formulario. Tal vez  se estén preguntando, como es posible cambiar el color de los iconos. Bueno esto es gracias a FONT AWESOME, en resumen general, esta herramienta permite crear iconos basado en vectores a CSS a partir de un formato de fuentes de texto,  estoy seguro que muchos de ustedes lo han usado al crear páginas o aplicaciones web, donde es realmente sencillo colocar iconos con un color y tamaño personalizado. Hay otras fuentes web, Sin embargo, todos son solamente para incluir en páginas web y hojas de estilo. Entonces un día se me ocurrió por qué no integrar en aplicaciones de escritorio, en fin y al cabo son solo fuentes web y podemos convertir a formato de imagen, pero ya otros lo habían pensado, encontré una librería en los paquetes de NUGET, bajo el nombre de FONTAWESOME.SHARP, desarrollado por mkoertgen y ThomasMentzel. Bueno este paquete es es muy interesante, con todas las opciones requeridas, y me gustó la facilidad de agregar iconos con colores y tamaños personalizados en nuestras aplicaciones de escritorio.

Todo ello en lenguaje de C# y Visual Basic .NET con Windows Form.

MainMenu.cs/vb

public partial class FormMainMenu : Form
{
    //Fields
    private IconButton currentBtn;
    private Panel leftBorderBtn;
    private Form currentChildForm;

    //Constructor
    public FormMainMenu()
    {
        InitializeComponent();
        leftBorderBtn = new Panel();
        leftBorderBtn.Size = new Size(7, 60);
        panelMenu.Controls.Add(leftBorderBtn);
        //Form
        this.Text = string.Empty;
        this.ControlBox = false;
        this.DoubleBuffered = true;
        this.MaximizedBounds = Screen.FromHandle(this.Handle).WorkingArea;
    }
    //Structs
    private struct RGBColors
    {
        public static Color color1 = Color.FromArgb(172, 126, 241);
        public static Color color2 = Color.FromArgb(249, 118, 176);
        public static Color color3 = Color.FromArgb(253, 138, 114);
        public static Color color4 = Color.FromArgb(95, 77, 221);
        public static Color color5 = Color.FromArgb(249, 88, 155);
        public static Color color6 = Color.FromArgb(24, 161, 251);

    }

    //Methods
    private void ActivateButton(object senderBtn, Color color)
    {
        if (senderBtn != null)
        {
            DisableButton();
            //Button
            currentBtn = (IconButton)senderBtn;
            currentBtn.BackColor = Color.FromArgb(37, 36, 81);
            currentBtn.ForeColor = color;
            currentBtn.TextAlign = ContentAlignment.MiddleCenter;
            currentBtn.IconColor = color;
            currentBtn.TextImageRelation = TextImageRelation.TextBeforeImage;
            currentBtn.ImageAlign = ContentAlignment.MiddleRight;
            //Left border button
            leftBorderBtn.BackColor = color;
            leftBorderBtn.Location = new Point(0, currentBtn.Location.Y);
            leftBorderBtn.Visible = true;
            leftBorderBtn.BringToFront();
            //Current Child Form Icon
            iconCurrentChildForm.IconChar = currentBtn.IconChar;
            iconCurrentChildForm.IconColor = color;
        }
    }

    private void DisableButton()
    {
        if (currentBtn != null)
        {
            currentBtn.BackColor = Color.FromArgb(31, 30, 68);
            currentBtn.ForeColor = Color.Gainsboro;
            currentBtn.TextAlign = ContentAlignment.MiddleLeft;
            currentBtn.IconColor = Color.Gainsboro;
            currentBtn.TextImageRelation = TextImageRelation.ImageBeforeText;
            currentBtn.ImageAlign = ContentAlignment.MiddleLeft;
        }
    }

    private void OpenChildForm(Form childForm)
    {
        //open only form
        if (currentChildForm != null)
        {
            currentChildForm.Close();
        }
        currentChildForm = childForm;
        //End
        childForm.TopLevel = false;
        childForm.FormBorderStyle = FormBorderStyle.None;
        childForm.Dock = DockStyle.Fill;
        panelDesktop.Controls.Add(childForm);
        panelDesktop.Tag = childForm;
        childForm.BringToFront();
        childForm.Show();
        lblTitleChildForm.Text = childForm.Text;
    }

    private void Reset()
    {
        DisableButton();
        leftBorderBtn.Visible = false;
        iconCurrentChildForm.IconChar = IconChar.Home;
        iconCurrentChildForm.IconColor = Color.MediumPurple;
        lblTitleChildForm.Text = "Home";
    }

    //Events
    //Reset
    private void btnHome_Click(object sender, EventArgs e)
    {
        if (currentChildForm != null)
        {
            currentChildForm.Close();
        }
        Reset();
    }
    //Menu Button_Clicks
    private void btnDashboard_Click(object sender, EventArgs e)
    {
        ActivateButton(sender, RGBColors.color1);
        OpenChildForm(new FormDashboard());
    }

    private void btnOrder_Click(object sender, EventArgs e)
    {
        ActivateButton(sender, RGBColors.color2);
        OpenChildForm(new FormOrders());
    }

    private void btnProduct_Click(object sender, EventArgs e)
    {
        ActivateButton(sender, RGBColors.color3);
        OpenChildForm(new FormProducts());
    }

    private void btnCustomer_Click(object sender, EventArgs e)
    {
        ActivateButton(sender, RGBColors.color4);
        OpenChildForm(new FormCustomers());
    }

    private void btnMarketing_Click(object sender, EventArgs e)
    {
        ActivateButton(sender, RGBColors.color5);
        OpenChildForm(new FormMarketing());
    }

    private void btnSetting_Click(object sender, EventArgs e)
    {
        ActivateButton(sender, RGBColors.color6);
        OpenChildForm(new FormSetting());
    }

    //Drag Form
    [DllImport("user32.DLL", EntryPoint = "ReleaseCapture")]
    private extern static void ReleaseCapture();

    [DllImport("user32.DLL", EntryPoint = "SendMessage")]
    private extern static void SendMessage(System.IntPtr hWnd, int wMsg, int wParam, int lParam);

    private void panelTitleBar_MouseDown(object sender, MouseEventArgs e)
    {
        ReleaseCapture();
        SendMessage(this.Handle, 0x112, 0xf012, 0);
    }

    //Close-Maximize-Minimize
    private void btnExit_Click(object sender, EventArgs e)
    {
        Application.Exit();
    }

    private void btnMaximize_Click(object sender, EventArgs e)
    {
        if (WindowState == FormWindowState.Normal)
            WindowState = FormWindowState.Maximized;
        else
            WindowState = FormWindowState.Normal;
    }

    private void btnMinimize_Click(object sender, EventArgs e)
    {
        WindowState = FormWindowState.Minimized;
    }

    //Remove transparent border in maximized state
    private void FormMainMenu_Resize(object sender, EventArgs e)
    {
        if (WindowState == FormWindowState.Maximized)
            FormBorderStyle = FormBorderStyle.None;
        else
            FormBorderStyle = FormBorderStyle.Sizable;
    }
Imports System.Runtime.InteropServices
Imports FontAwesome.Sharp

Public Class FormMainMenu 
    'Fields'
    Private currentBtn As IconButton
    Private leftBorderBtn As Panel
    Private currentChildForm As Form

    'Constructor'
    Public Sub New()

        ' This call is required by the designer.'
        InitializeComponent()

        ' Add any initialization after the InitializeComponent() call.'
        leftBorderBtn = New Panel()
        leftBorderBtn.Size = New Size(7, 60)
        PanelMenu.Controls.Add(leftBorderBtn)
        'Form'
        Me.Text = String.Empty
        Me.ControlBox = False
        Me.DoubleBuffered = True
        Me.MaximizedBounds = Screen.PrimaryScreen.WorkingArea

    End Sub

    'Methods'
    Private Sub ActivateButton(senderBtn As Object, customColor As Color)
        If senderBtn IsNot Nothing Then
            DisableButton()
            'Button'
            currentBtn = CType(senderBtn, IconButton)
            currentBtn.BackColor = Color.FromArgb(37, 36, 81)
            currentBtn.ForeColor = customColor
            currentBtn.IconColor = customColor
            currentBtn.TextAlign = ContentAlignment.MiddleCenter
            currentBtn.ImageAlign = ContentAlignment.MiddleRight
            currentBtn.TextImageRelation = TextImageRelation.TextBeforeImage
            'Left Border'
            leftBorderBtn.BackColor = customColor
            leftBorderBtn.Location = New Point(0, currentBtn.Location.Y)
            leftBorderBtn.Visible = True
            leftBorderBtn.BringToFront()
            'current Form icon'
            IconCurrentForm.IconChar = currentBtn.IconChar
            IconCurrentForm.IconColor = customColor

        End If
    End Sub

    Private Sub DisableButton()
        If currentBtn IsNot Nothing Then
            currentBtn.BackColor = Color.FromArgb(31, 30, 68)
            currentBtn.ForeColor = Color.Gainsboro
            currentBtn.IconColor = Color.Gainsboro
            currentBtn.TextAlign = ContentAlignment.MiddleLeft
            currentBtn.ImageAlign = ContentAlignment.MiddleLeft
            currentBtn.TextImageRelation = TextImageRelation.ImageBeforeText
        End If
    End Sub

    Private Sub OpenChildForm(childForm As Form)
        'Open only form'
        If currentChildForm IsNot Nothing Then
            currentChildForm.Close()
        End If
        currentChildForm = childForm
        'end'
        childForm.TopLevel = False
        childForm.FormBorderStyle = FormBorderStyle.None
        childForm.Dock = DockStyle.Fill
        PanelDesktop.Controls.Add(childForm)
        PanelDesktop.Tag = childForm
        childForm.BringToFront()
        childForm.Show()
        lblFormTitle.Text = childForm.Text
    End Sub

    Private Sub Reset()
        DisableButton()
        leftBorderBtn.Visible = False
        IconCurrentForm.IconChar = IconChar.Home
        IconCurrentForm.IconColor = Color.MediumPurple
        lblFormTitle.Text = "Home"
    End Sub

    'Events'
    'Reset'
    Private Sub imgHome_Click(sender As Object, e As EventArgs) Handles imgHome.Click
        If currentChildForm IsNot Nothing Then
            currentChildForm.Close()
        End If
        Reset()
    End Sub

   'Menu buttons Cliks'
    Private Sub btnDashboard_Click(sender As Object, e As EventArgs) Handles btnDashboard.Click
        ActivateButton(sender, RGBColors.color1)
        OpenChildForm(New FormDashboard)
    End Sub

    Private Sub btnOrders_Click(sender As Object, e As EventArgs) Handles btnOrders.Click
        ActivateButton(sender, RGBColors.color2)
        OpenChildForm(New FormOrders)
    End Sub

    Private Sub btnProducts_Click(sender As Object, e As EventArgs) Handles btnProducts.Click
        ActivateButton(sender, RGBColors.color3)
        OpenChildForm(New FormProducts)
    End Sub

    Private Sub btnCustomers_Click(sender As Object, e As EventArgs) Handles btnCustomers.Click
        ActivateButton(sender, RGBColors.color4)
        OpenChildForm(New FormCustomers)
    End Sub

    Private Sub btnMarketing_Click(sender As Object, e As EventArgs) Handles btnMarketing.Click
        ActivateButton(sender, RGBColors.color5)
        OpenChildForm(New FormMarketing)
    End Sub

    Private Sub btnSetting_Click(sender As Object, e As EventArgs) Handles btnSetting.Click
        ActivateButton(sender, RGBColors.color6)
        OpenChildForm(New FormSetting)
    End Sub

    'Drag Form'
    <DllImport("user32.DLL", EntryPoint:="ReleaseCapture")>
    Private Shared Sub ReleaseCapture()
    End Sub
    <DllImport("user32.DLL", EntryPoint:="SendMessage")>
    Private Shared Sub SendMessage(ByVal hWnd As System.IntPtr, ByVal wMsg As Integer, ByVal wParam As Integer, ByVal lParam As Integer)
    End Sub

    Private Sub PanelTitleBar_MouseDown(sender As Object, e As MouseEventArgs) Handles PanelTitleBar.MouseDown
        ReleaseCapture()
        SendMessage(Me.Handle, &H112&, &HF012&, 0)
    End Sub

    'Close-Maximize-Minimize'
    Private Sub btnExit_Click(sender As Object, e As EventArgs) Handles btnExit.Click
        Application.Exit()
    End Sub

    Private Sub btnMaximize_Click(sender As Object, e As EventArgs) Handles btnMaximize.Click
        If WindowState = FormWindowState.Normal Then
            WindowState = FormWindowState.Maximized
        Else
            WindowState = FormWindowState.Normal
        End If
    End Sub

    Private Sub btnMinimize_Click(sender As Object, e As EventArgs) Handles btnMinimize.Click
        WindowState = FormWindowState.Minimized
    End Sub

    'Remove transparent border in maximized state'
    Private Sub Form1_Resize(sender As Object, e As EventArgs) Handles MyBase.Resize
        If WindowState = FormWindowState.Maximized Then
            FormBorderStyle = FormBorderStyle.None
        Else
            FormBorderStyle = FormBorderStyle.Sizable
        End If
    End Sub

End Class

'............................................'
Public Structure RGBColors
    Public Shared color1 As Color = Color.FromArgb(172, 126, 241)
    Public Shared color2 As Color = Color.FromArgb(249, 118, 176)
    Public Shared color3 As Color = Color.FromArgb(253, 138, 114)
    Public Shared color4 As Color = Color.FromArgb(95, 77, 221)
    Public Shared color5 As Color = Color.FromArgb(249, 88, 155)
    Public Shared color6 As Color = Color.FromArgb(24, 161, 251)
End Structure

Ver Vídeo Tutorial

C#

VB .NET

Los comentarios están cerrados.