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
ola buenos días, antes que nada agradecer por tus videos ya que son de gran ayuda y aporte a la comunidad de vb, bueno quisiera proponer que isieras un proyecto en donde podamos enviar mensajes por WhatsApp desde nuestra apliacion en vb, ya que esto esta de moda hoy en día y es de mucha importancia tener algo asi integrado en nuestros proyectos, Gracias.
[…] Formulario Moderno+Iconos Font Awesome, WinForm, C# – VB.NET […]
Awesome post! Keep up the great work! 🙂
hola gracias por tus videos tutoriales son los mejores que he visto en el internet (Mi Criterio Personal), necesito que si puedes hagas un tutorial como abrir documentos pdf en un formulario, pero ojo que ya este en los recursos del formulario,ejemplo que cuando le de clic a un label por ejemplo se abra el documento pdf en el formulario, de antemano muchas gracias…..
I wish mankind victory over disease
Awesome post! Thank you.
What software did you use to read the texts?
春暖花开,下次再来!
学习啦,很久没浏览过了!
Hello,
Thanks for this tutorial, Someone has project files for this ? In VB.Net
And would like to make a request for a job to make and finish my ACARS Project.
With this UI Forms Thanks
Regards Fred
This is a good blog, happy every day
Hola RJ. Te felicito por el tutorial, me estoy iniciando en programación y realmente lo explicas muy fácil. Pero tengo un problema cuando hago clic en alguno de los botones.
System.NullReferenceException
HResult=0x80004003
Mensaje = Referencia a objeto no establecida como instancia de un objeto.
Origen = Comisiones
Seguimiento de la pila:
at Comisiones.frmMenuPrincipal.ActivateButton(Object senderBtn, Color customColor) in frmMenuPrincipal.vb:line 34
——> esta es la linea 34 (leftBorderBtn.BackColor = customColor)
Gracias por la ayuda.
Looks good!I like this!
这个不错耶,我喜欢!
The server is very fast.
初来乍到,多多关照!消灭新冠,人人平安!
COVID-19 is raging.
Are you ok
Google
We came across a cool website which you could possibly get pleasure from. Take a appear for those who want.
Google
We came across a cool internet site that you just may well enjoy. Take a appear for those who want.
Wish you good health, dear
新冠肆虐,注意安全!
Wish You All The Best In 2021!
不知道说什么好,还是祝疫情早点结束吧!