Control personalizado, velocímetro con C#

Aintzane Conde

Control personalizado Velocímetro con C#

Control personalizado, velocímetro con C#

Aintzane Conde

Control personalizado Velocímetro con C#
Se trata de crear un control de usuario personalizado para poder utilizar un control de tipo velocímetro. Abrimos una Biblioteca de clases de Microsoft Visual C# Express 2010.

Control personalizado, velocímetro con C# La pantalla que nos aparecerá al seleccionar la opción señalada es la siguiente:

Aintzane Conde

Hacemos clic con el botón derecho sobre Class1.cs y lo eliminamos. Ahora pinchamos sobre ClassLibrary1, también con el botón derecho para Agregar un Control de usuario:

Control personalizado, velocímetro con C#

Aintzane Conde

Del Cuadro de herramientas del menú desplegable de la izquierda arrastramos un Label al recuadro que se indica en la imagen superior (User control1), y le cambiaremos la propiedad (Name) de label1 a LblValor. Pinchando de nuevo en el User control1, seleccionamos del menú superior Ver y elegimos Código. Debemos escribir el código que se encuentra al final de este artículo. Damos al botón Iniciar depuración (Play), y cerramos la advertencia que nos aparece.

Control personalizado, velocímetro con C# Cerramos Microsoft Visual C# Express 2010 y abrimos un nuevo proyecto:

Aintzane Conde

Seleccionamos del Explorador de soluciones de la parte superior derecha de la pantalla, con el botón derecho, WindowsFormsApplication1 (o nombre de nuestro proyecto), Agregar referencia. Nos aparecerá un cuadro de diálogo con una pestaña llamada Examinar: debemos elegir la ubicación en la que hemos guardado el control de usuario creado y, de ahí, accederemos a bin, Debug, y agregamos el archivo de extensión dll que nos aparece:

Control personalizado, velocímetro con C#

Aintzane Conde

Desplegamos el Cuadro de herramientas y, con el botón derecho, pinchamos sobre el espacio en blanco de éste. Nos aparecerá la opción Elegir elementos y buscaremos el mismo archivo anterior. Aceptamos y nos aparecerá un nuevo control en el cuadro de herramientas que debemos arrastrar a nuestro formulario. En las Propiedades de este control encontramos la denominada Mode, que podremos fijar en Normal (parecido a un Progress bar) o en Velocímetro. Si utilizamos esta última nos aparecerá:

A partir de este punto, podemos utilizar nuestros datos para representarlos mediante este nuevo control.

Control personalizado, velocímetro con C#

Aintzane Conde

Código (leer los datos)
using using using using using using using using System; System.Collections.Generic; System.ComponentModel; System.Drawing; System.Data; System.Linq; System.Text; System.Windows.Forms;

using System.Drawing.Drawing2D; namespace ClassLibrary1 { public partial class UserControl1 : UserControl { public UserControl1() { InitializeComponent(); } #region Variables Graphics Graf; protected int Val = 0; protected Color ColorBarra = Color.CornflowerBlue; protected Color ColorValor = Color.Black; protected LinearGradientMode GradMode = LinearGradientMode.Vertical; public enum Modos { Normal, Velocímetro } Modos Modo; #endregion #region Propiedades public Modos Modes { get { return Modo; } set { Modo = value; if (value.ToString() != "Normal") { LblValor.Visible = false; } else { LblValor.Visible = false; } } } public Color color_de_barra { get { return ColorBarra; } set { ColorBarra = value; } } public Color color_de_valor { get { return ColorValor; } set { ColorValor = value; LblValor.ForeColor = value; }

Control personalizado, velocímetro con C#
} public LinearGradientMode GradientMode { get { return GradMode; } set { GradMode = value; } }

Aintzane Conde

public int Valor { get { return Val; } set { if (value <= 100 && value >= 0) { Val = value; } if (Modo.ToString() == "Normal") { LblValor.Text = Val.ToString() + "%"; } this.Refresh(); } } #endregion #region Voids protected override void OnPaint(PaintEventArgs e) { Graf = this.CreateGraphics(); Graf.SmoothingMode = SmoothingMode.HighQuality; if (Modo.ToString() == "Normal") { Rectangle Rec = new Rectangle(0, 0, this.Width, this.Height); LinearGradientBrush LGB = new LinearGradientBrush(Rec, Color.FromArgb(255, Color.White), Color.FromArgb(0, Color.White), GradMode); int Porcentaje = this.Width * Val / 100; Graf.FillRectangle(new SolidBrush(ColorBarra), 0, 0, Porcentaje, this.Height); Graf.FillRectangle(LGB, 0, 0, Porcentaje, this.Height); LGB.Dispose(); } else { int Porcentaje = Val * 3 + 180; float Tamaño = this.Height / 4; double Angulo = Porcentaje * Math.PI / 100; Graf.DrawLine(new Pen(Color.Black, 2), this.ClientSize.Width / 2, this.ClientSize.Height / 2, this.ClientSize.Width / 2 + (float)(Tamaño * Math.Sin(Angulo)), this.ClientSize.Height / 2 - (float)(Tamaño * Math.Cos(Angulo))); } } private void Design() { float Ra = this.Height / 2; Design();

base.OnPaint(e);

Control personalizado, velocímetro con C#
float CentroX = this.ClientSize.Width / 2; float CentroY = this.ClientSize.Height / 2; int Num = 0; for (int Cont = 30; Cont <= 80; Cont++) { if (Cont % 5 == 0) { Graf.DrawLine(new Pen(Color.Black, CentroX + (float)(Ra / 1.50F * CentroY - (float)(Ra / 1.50F * CentroX + (float)(Ra / 1.70F * CentroY - (float)(Ra / 1.70F *

Aintzane Conde

2), Math.Sin(Cont Math.Cos(Cont Math.Sin(Cont Math.Cos(Cont

* * * *

6 6 6 6

* * * *

Math.PI Math.PI Math.PI Math.PI

/ / / /

180)), 180)), 180)), 180)));

Graf.DrawString((Num + "%").ToString(), new Font("Palatino Linotype", 9), new SolidBrush(Color.Black), (CentroX - 10) + (float)((Ra + 15) / 1.50F * Math.Sin(Cont * 6 * Math.PI / 180)), (CentroY - 10) - (float)((Ra + 15) / 1.50F * Math.Cos(Cont * 6 * Math.PI / 180))); Num += 10; } else { Graf.DrawLine(new Pen(Color.Red, 2), CentroX + (float)(Ra / 1.50F * Math.Sin(Cont CentroY - (float)(Ra / 1.50F * Math.Cos(Cont CentroX + (float)(Ra / 1.60F * Math.Sin(Cont CentroY - (float)(Ra / 1.60F * Math.Cos(Cont } } } #endregion

* * * *

6 6 6 6

* * * *

Math.PI Math.PI Math.PI Math.PI

/ / / /

180)), 180)), 180)), 180)));

} }

Sign up to vote on this title
UsefulNot useful