Cómo agregar gráficos a una aplicación de formulario de Windows C#

Windows Forms es un marco que le permite crear aplicaciones de escritorio. Puede hacer clic y arrastrar componentes como botones a una interfaz de usuario visual. También te ayuda a crear manualmente varias formas dentro de tu código.

Este artículo le mostrará cómo agregar líneas, formas e imágenes a su aplicación. Este tutorial usa Visual Studio 2019 Community Edition para mostrar ejemplos.

¿Cuáles son las clases integradas que se utilizan para dibujar gráficos?

Windows Forms utiliza el lenguaje de programación c#. Sus clases y métodos integrados le permiten dibujar varias formas en un lienzo de Windows Forms. Estos incluyen las clases Graphics, Pen, Color y Brush.

Para ver el código fuente de un ejemplo en ejecución del tutorial anterior, visite el repositorio GitHub. Puede probar los siguientes ejemplos una vez que haya creó una aplicación Winforms.

Cómo agregar una pintura en el controlador de eventos de carga de formulario

Primero, agregue un controlador de eventos para dibujar formas cuando se carga el lienzo.

1. Agregue una función Paint para el formulario.

   privado void Form1_Paint (remitente del objeto, PaintEventArgs e)
   {
    // El código va aquí
   }

2. Vaya a la pestaña Vista de diseño.
3. En la ventana Propiedades, seleccione el icono del rayo para abrir la pestaña "Eventos".
4. En "Paint", en "Apariencia", seleccione la función Form1_Paint. Esto ejecutará la función cuando ejecute la aplicación.

Cómo dibujar líneas en un lienzo de formulario de Windows

Puede usar un método Color, Pen y DrawLine() para dibujar líneas en un lienzo.

1. Dentro de la función Form1_Paint(), cree un objeto Color con el color que desea que tenga la línea. Luego, crea un objeto Pen para dibujar la línea.

   Color negro = Color. FromArgb (255, 0, 0, 0);
   Pen blackPen = nuevo Pen (negro);
   

2. El método DrawLine() de la clase Graphics dibujará una línea con el lápiz. Esto comenzará a dibujar una línea desde una posición x, y a otra posición x, y.

   mi. Gráficos. DrawLine (blackPen, 300, 200, 800, 200);
   

3. Puede modificar las propiedades del objeto pluma para cambiar su ancho, estilo de guion y tapa inicial o final.

   lápiz negro. Ancho = 20;
   lápiz negro. DashStyle = Sistema. Dibujo. Drawing2D.DashStyle. Pizca;
   lápiz negro. StartCap = Sistema. Dibujo. Dibujo2D.LineCap. FlechaAncla;
   mi. Gráficos. DrawLine (blackPen, 300, 200, 800, 200);
   

4. Presione el botón verde de reproducción en la parte superior de Visual Studio para ver los cambios.

Cómo dibujar formas como rectángulos y círculos

Puede usar las clases de formas para diferentes formas o dibujar formas manualmente en el lienzo.

1. Cree un objeto Color y Pluma como se muestra en los pasos anteriores. Luego, use el método DrawRectangle() para crear el rectángulo. Los argumentos son las coordenadas x e y de la parte superior izquierda del rectángulo, junto con su ancho y alto.

   Color rojo = Color. FromArgb (255, 255, 0, 0);
   Bolígrafo bolígrafo rojo = bolígrafo nuevo (rojo);
   boligrafo rojo. Ancho = 5;
   mi. Gráficos. DibujarRectángulo (redPen, 100, 100, 500, 200);
   

2. También puede crear un rectángulo usando la clase Rectangle. Primero, cree un objeto Rectángulo. Los argumentos también son las coordenadas x e y para la esquina superior izquierda, el ancho y la altura.

   Rectángulo rectángulo = nuevo Rectángulo (100, 350, 500, 200);
   

3. Utilice la función DrawRectangle() para dibujar el rectángulo. En lugar de pasar x, y, ancho y alto como antes, puede usar el objeto Rectangle en su lugar.

   mi. Gráficos. DrawRectangle (redPen, rectángulo);
   

4. Presione el botón verde de reproducción en la parte superior de Visual Studio para ver los cambios.
5. Vuelva al código para dibujar otras formas. Utilice la función DrawEllipse() para dibujar un círculo.

   Color verde = Color. FromArgb (255, 0, 255, 0);
   Bolígrafo bolígrafo verde = bolígrafo nuevo (verde);
   bolígrafo verde. Ancho = 5;
   mi. Gráficos. DrawEllipse (greenPen, 400, 150, 400, 400);

   Cuando dibuja un círculo, las coordenadas x e y (x=400, y=150) se refieren a la esquina superior izquierda del círculo, no al centro del círculo.
6. Para dibujar otras formas, como triángulos o hexágonos, utilice el método DrawPolygon(). Aquí puede especificar una lista de coordenadas para representar los puntos de la forma.

   Color azul = Color. FromArgb (255, 0, 0, 255);
   Bolígrafo bluePen = nuevo Bolígrafo (azul);
   bolígrafo azul. Ancho = 5;
   PuntoF[] coordenadasParaTriángulo = new PuntoF[] {
    nuevo PuntoF(400, 150),
    nuevo PuntoF(300, 300),
    nuevo PuntoF(500, 300)
   };
   mi. Gráficos. DibujarPolígono (plumaazul, coordenadasParaTriángulo);
   

   El método DrawPolygon() dibujará líneas entre los puntos especificados. ​​​​​​

Cómo usar la clase de pincel para rellenar formas con color

Puede usar los métodos FillRectangle(), FillEllipses() o FillTriangle() para crear formas con un color sólido.

1. Primero, cree un objeto de pincel.

   Color morado = Color. FromArgb (255, 128, 0, 0);
   SolidBrush solidBrush = nuevo SolidBrush (púrpura);

2. Utilice los métodos FillRectangle(), FillEllipses() o FillTriangle(). Funcionan de la misma manera que las funciones de dibujo anteriores, excepto que en lugar de un Pen, usan un objeto Brush.

   mi. Gráficos. FillRectangle (cepillo sólido, 50, 50, 200, 250);
   mi. Gráficos. FillEllipse (cepillo sólido, 300, 50, 200, 200);
   mi. Gráficos. FillPolygon (solidBrush, new PointF[] { new PointF(700, 150), new PointF(600, 300), new PointF(800, 300) });

3. También puede ingresar un objeto de forma directamente en lugar de proporcionar coordenadas.

   Rectángulo rectángulo = nuevo Rectángulo (100, 350, 500, 200);
   mi. Gráficos. FillRectangle (solidBrush, rectángulo);

4. Utilice HatchBrush para rellenar la forma con un estilo de relleno diferente, como un patrón horizontal o vertical.

   Color azul = Color. FromArgb (255, 0, 0, 255);
   Color verde = Color. FromArgb (255, 0, 255, 0);
   HatchBrush hatchBrush = new HatchBrush (HatchStyle. Horizontal, verde, azul);
   mi. Gráficos. FillRectangle (hatchBrush, 50, 50, 200, 250);

5. Puede usar TextureBrush para rellenar una forma usando una imagen. Aquí, cree un mapa de bits apuntando a un archivo de imagen. En lugar de crear un pincel con un color, créalo con la imagen.

   Imagen de mapa de bits = Imagen (mapa de bits). FromFile(@"C:\Users\Sharl\Desktop\flag.bmp", true);
   TextureBrush textureBrush = new TextureBrush (imagen);
   mi. Gráficos. FillRectangle (cepillo de textura, 100, 100, 500, 400);

Cómo representar imágenes en el formulario

Para representar una imagen, cree un objeto de control PictureBox y agréguelo al formulario.

1. Cree un objeto de control PictureBox utilizando un archivo de imagen.

   Imagen de PictureBox = new PictureBox();
   imagen. ImageLocation = @"C:\Users\Sharl\Desktop\flagLarge.bmp";
   

2. Establezca el tamaño de la imagen y agréguela al formulario para que se muestre.

   imagen. SizeMode = PictureBoxSizeMode. Tamaño automático;
   este. Control S. Añade una foto);

3. Presione el botón de inicio verde en la parte superior para ver la imagen.

Agregar más formas a su formulario de Windows

Ahora debería comprender cómo agregar líneas, formas e imágenes a su formulario de Windows. Puede combinar formas para crear nuevas formas. También puede jugar con las funciones integradas para crear formas más complejas.

Sobre el Autor

Sharlene Von Drehnen (7 artículos publicados)

Sharlene es redactora técnica en MUO y también trabaja a tiempo completo en desarrollo de software. Es Licenciada en TI y tiene experiencia previa en Aseguramiento de la Calidad y tutoría Universitaria. Sharlene ama jugar y tocar el piano.

Más de Sharlene Von Drehnen