Díganos qué opina sobre la experiencia de descarga del PDF.

Tutoriales de Visual Studio | Visual Basic

Cree aplicaciones de Visual Basic con Visual Studio.

Introducción

ｃ GUÍA PASO A PASO

Instalar Visual Studio

ｂ INTRODUCCIÓN

Iniciar una visita guiada

Creación de aplicaciones de Visual Basic

ｇ TUTORIAL

Creación de una aplicación de consola

Crear una aplicación de escritorio de Windows

Crear una aplicación de Windows Forms

Más información sobre el lenguaje de Visual Basic

Conocer Visual Studio

ｇ TUTORIAL

Abrir código desde un repositorio

Escribir y editar código

Compilar y generar

Depurar el código

Probar el código

ｃ GUÍA PASO A PASO

Acceder a datos
Le damos la bienvenida al IDE de Visual
Studio | Visual Basic
Artículo • 10/03/2023 • Tiempo de lectura: 16 minutos

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

Un entorno de desarrollo integrado (IDE) es un programa con numerosas características

que respalda muchos aspectos del desarrollo de software. El IDE de Visual Studio es un
panel de inicio creativo que se puede usar para editar, depurar y compilar código y,
después, publicar una aplicación. Aparte del editor y el depurador estándar que
proporcionan la mayoría de IDE, Visual Studio incluye compiladores, herramientas de
finalización de código, diseñadores gráficos y muchas más características para facilitar el
proceso de desarrollo de software.

En la imagen anterior se muestra Visual Studio con un proyecto abierto de Visual Basic
con las ventanas principales y su funcionalidad:

En la parte superior derecha del Explorador de soluciones, puede ver y administrar

los archivos de código y navegar por ellos. El Explorador de soluciones puede
ayudar a organizar el código al agrupar los archivos en soluciones y proyectos.

La ventana del editor central, donde es probable que pase la mayor parte del
tiempo, muestra el contenido del archivo. En ella, podrá editar código o diseñar
una interfaz de usuario, como una ventana con botones y cuadros de texto.
 En la parte inferior derecha de Git Changes (Cambios de Git), puede realizar el
seguimiento de elementos de trabajo y compartir código con otros usuarios
mediante tecnologías de control de versiones, como Git y GitHub .

Ediciones
Visual Studio está disponible para Windows y Mac. Visual Studio para Mac tiene muchas
de las mismas características que Visual Studio para Windows y está optimizado para el
desarrollo de aplicaciones móviles y multiplataforma. Este artículo se centra en la
versión de Visual Studio para Windows.

Existen tres ediciones de Visual Studio: Community, Professional y Enterprise. Consulte

Comparar las ediciones de Visual Studio para obtener información sobre las
características que cada edición admite.

Características de productividad populares

Algunas características conocidas de Visual Studio que mejoran la productividad al
desarrollar software incluyen:

Subrayados ondulados y Acciones rápidas

Los subrayados ondulados son rayas con formas de onda debajo de las palabras
que alertan de errores o posibles problemas en el código a medida que se escribe.
Estas pistas visuales le ayudan a corregir problemas inmediatamente, sin esperar a
detectar errores durante la compilación o el tiempo de ejecución. Si mantiene el
puntero sobre un subrayado rojo, verá más información sobre el error. También
puede aparecer una bombilla en el margen izquierdo que muestra acciones rápidas
que puede realizar para corregir el error.

Refactorización

La refactorización incluye operaciones como el cambio de nombre inteligente de

variables, la extracción de una o más líneas de código en un nuevo método y el
cambio del orden de los parámetros de método.
IntelliSense

IntelliSense es un conjunto de características que muestran información sobre el

código directamente en el editor y, en algunos casos, escriben pequeños
fragmentos de código automáticamente. Es como tener documentación básica
insertada en el editor, lo que evita tener que buscar información escrita en
cualquier otro lugar.

La siguiente ilustración muestra cómo IntelliSense muestra una lista de miembros

de un tipo:

Las características de IntelliSense varían según el lenguaje. Para más información,

vea IntelliSense para C#, IntelliSense para Visual C++, IntelliSense para JavaScript e
IntelliSense de Visual Basic.

Búsqueda de Visual Studio

Los menús, las opciones y las propiedades de Visual Studio pueden parecer
abrumadores en ocasiones. La búsqueda de Visual Studio, o Ctrl+Q, es una
excelente manera de encontrar rápidamente las características del IDE y el código
en un solo lugar.

Al empezar a escribir el nombre de lo que está buscando, Visual Studio muestra

resultados que llevan a donde necesita ir. Si necesita agregar funcionalidad, por
ejemplo, otro lenguaje de programación, puede abrir el Instalador de Visual Studio
desde los resultados del cuadro de búsqueda para instalar la carga de trabajo o el
componente.

Live Share

Edite y depure en colaboración con otros usuarios en tiempo real, sin importar el
tipo de aplicación o el lenguaje de programación. Puede compartir el proyecto al
instante y de forma segura. También puede compartir sesiones de depuración,
instancias de terminal, aplicaciones web de localhost, llamadas de voz, etc.

Jerarquía de llamadas

En la ventana Jerarquía de llamadas se muestran los métodos que llaman a un

método seleccionado. Esta información puede ser útil si está pensando en cambiar
o quitar el método, o si está intentando realizar el seguimiento de un error.

CodeLens

CodeLens ayuda a buscar referencias al código, cambios en él, errores vinculados,

elementos de trabajo, revisiones de código y pruebas unitarias, sin salir del editor.

Ir a definición
La característica Ir a definición lleva directamente a la ubicación de una definición
de tipo o función.

Ver la definición

En la ventana Ver la definición se muestra una definición de tipo o método sin

abrir un archivo aparte.

Recarga activa

Recarga activa permite editar los archivos de código de la aplicación y aplicar los
cambios de código inmediatamente a la aplicación en ejecución.
Instalar Visual Studio
En esta sección, creará un proyecto sencillo para probar algunas de las cosas que puede
hacer con Visual Studio. Aprenderá a cambiar el tema de color, a usar IntelliSense como
ayuda para crear código y a depurar una aplicación para ver el valor de una variable
durante la ejecución de la aplicación.

Para empezar, descargue Visual Studio e instálelo en su sistema. En el instalador

modular, elegirá e instalará cargas de trabajo, que son grupos de características
necesarias para los lenguajes de programación o las plataformas que prefiera. Para usar
los pasos siguientes para crear un programa, asegúrese de seleccionar la carga de
trabajo Desarrollo de escritorio de .NET durante la instalación.

Cuando se abre Visual Studio por primera vez, puede iniciar sesión con su cuenta de
Microsoft o con su cuenta profesional o educativa.

Personalizar Visual Studio

Puede personalizar la interfaz de usuario de Visual Studio, incluso cambiar el tema de
color predeterminado.

Cambio del tema de color

Para cambiar el tema de color:

1. Abra Visual Studio. En la ventana de inicio, seleccione Continuar sin código.

2. En la barra de menús de Visual Studio, seleccione Herramientas>Opciones para
abrir el cuadro de diálogo Opciones.

3. En la página de opciones Entorno>General, cambie la selección de Tema de color

a Azul o Claro y, luego, seleccione Aceptar.

El tema de color de todo el IDE se cambia en consecuencia. En la captura de

pantalla siguiente se muestra el tema Azul:
Selección de la configuración del entorno
Puede configurar Visual Studio para que use la configuración de entorno adaptada a los
desarrolladores de Visual Basic.

1. En la barra de menús, elija Herramientas>Importar y exportar configuraciones.

2. En el Asistente para importar y exportar configuraciones, seleccione Restablecer

todas las configuraciones y luego Siguiente.

3. En la página Guardar configuración actual, seleccione si quiere guardar la

configuración actual antes de restablecerla. Si no personalizó la configuración,
seleccione No, simplemente restablecer la configuración reemplazando mi
configuración actual. Luego, seleccione Siguiente.

4. En la página Elija una colección predeterminada de configuraciones, elija

Visual Basic y, luego, seleccione Finalizar.

5. En la página Restablecimiento completado, haga clic en Cerrar.

Para obtener información sobre otras maneras de personalizar el IDE, vea Personalizar
Visual Studio.

Creación de un programa
Profundicemos y creemos un programa sencillo.
1. En la barra de menús de Visual Studio, elija Archivo>Nuevo>Proyecto. También
puede presionar Ctrl+Mayús+N.

La ventana Crear un nuevo proyecto se abre y muestra varias plantillas de

proyecto. Una plantilla contiene los archivos básicos y la configuración necesarios
para un tipo de proyecto concreto.

2. Para buscar una plantilla, puede escribir palabras clave en el cuadro de búsqueda.
La lista de plantillas disponibles se filtra por las palabras clave que escribió. Puede
filtrar aún más los resultados de la plantilla eligiendo Visual Basic en la lista
desplegable Todos los lenguajes, Windows en la lista Todas las plataformas y
Consola en la lista Todos los tipos de proyecto.

Seleccione la plantilla Aplicación de consola de Visual Basic y, luego, elija

Siguiente.

3. En la ventana Configurar el nuevo proyecto, escriba HelloWorld en el cuadro

Nombre del proyecto. Opcionalmente, cambie la ubicación predeterminada del
directorio del proyecto C:\Usuarios\<nombre>\origen\repositorios y, luego,
seleccione Siguiente.
4. En la ventana Información adicional, compruebe que .NET 6.0 aparece en el menú
desplegable Plataforma de destino y, luego, seleccione Crear.

Visual Studio crea el proyecto. El programa es una aplicación sencilla "Hola

mundo" que llama al método Console.WriteLine() para mostrar la cadena ¡Hola
mundo! en la ventana de consola.

Los archivos del proyecto aparecen en el lado derecho del IDE de Visual Studio, en
una ventana denominada Explorador de soluciones. En la ventana Explorador de
soluciones, seleccione el archivo Program.vb. El código de Visual Basic para la
aplicación se abre en la ventana del editor central, que ocupa la mayor parte del
espacio.

El código se colorea automáticamente para indicar las diferentes partes, como

palabras clave y tipos. Los números de línea le ayudan a encontrar el código.

Las líneas discontinuas verticales pequeñas del código indican la estructura de

código o los bloques de código que van juntos. También puede seleccionar los
pequeños cuadrados con los signos de menos o más para contraer o expandir los
bloques de código. Esta característica de esquematización del código le permite
ocultar el código que no necesita, lo que ayuda a minimizar el desorden en la
pantalla.

Hay muchos otros menús y ventanas de herramientas disponibles.

5. Para iniciar la aplicación, elija Depurar>Iniciar sin depurar en el menú superior de
Visual Studio. También puede presionar Ctrl+F5.

Visual Studio compila la aplicación y se abre una ventana de consola con el

mensaje ¡Hola mundo! ¡Ya tiene una aplicación en ejecución!

6. Para cerrar la ventana de la consola presione cualquier tecla.

7. Vamos a agregar más código a la aplicación. Agregue el código de Visual Basic

siguiente antes de la línea que dice Console.WriteLine("Hello World!") :

VB

Console.WriteLine("What is your name?")

Dim name = Console.ReadLine()
 Este código muestra What is your name? en la ventana de la consola y luego
espera a que el usuario escriba algún texto.

8. Cambie la línea que indica Console.WriteLine("Hello World!") por la siguiente:

VB

Console.WriteLine("Hello " + name + "!")

9. Vuelva a ejecutar la aplicación mediante la selección de Depurar>Iniciar sin

depurar o presionando Ctrl+F5.

Visual Studio recompila la aplicación y se abre una ventana de consola que le

solicita su nombre.

10. Escriba su nombre en la ventana de la consola y presione Entrar.

11. Presione cualquier tecla para cerrar la ventana de consola y detener la ejecución
del programa.

Usar IntelliSense y la refactorización

Veamos un par de formas en las que la refactorización e IntelliSense pueden ayudar a
crear código de forma más eficaz.

Primero cambie el nombre de la variable name :

1. Haga doble clic en la variable name y escriba el nuevo nombre, username.

Aparece un cuadro alrededor de la variable y una bombilla en el margen.

2. Seleccione el icono de bombilla para mostrar las Acciones rápidas disponibles.

Seleccione Rename 'name' to 'username' (Cambiar "name" a "username").
 Se cambia el nombre de la variable en el proyecto, que en este caso es solo en dos
lugares.

Ahora echemos un vistazo a IntelliSense.

1. Debajo de la línea que dice Console.WriteLine("Hello " + username + "!") ,

escriba el código siguiente:

VB

Dim now = Date.

Los miembros de la clase DateTime se muestran en un cuadro. La descripción del

miembro seleccionado actualmente se muestra en un cuadro independiente.

2. Seleccione el miembro denominado Now, que es una propiedad de la clase. Haga

doble clic en Now o seleccione esta opción y presione TAB.

3. Debajo de la línea, escriba las líneas de código siguientes:

VB

Dim dayOfYear = now.DayOfYear

Console.Write("Day of year: ")
Console.WriteLine(dayOfYear)
  Sugerencia

Console.Write se diferencia de Console.WriteLine en que no agrega un

terminador de línea después de la impresión. Esto significa que el siguiente
fragmento de texto que se envía a la salida se imprimirá en la misma línea.
Puede mantener el puntero sobre cada uno de estos métodos del código para
ver su descripción.

A continuación, se usará de nuevo la refactorización para que el código sea más

conciso.

1. Seleccione la variable now en la línea Dim now = Date.Now . Un icono de bombilla

aparece en el margen de esa línea.

2. Seleccione el icono de bombilla para ver las sugerencias disponibles en

Visual Studio. En este caso, se muestra la refactorización Variable temporal en línea
para quitar una línea de código sin cambiar el comportamiento general del código.

3. Seleccione Variable temporal en línea para refactorizar el código.

4. Vuelva a ejecutar el programa presionando Ctrl+F5. La salida tendrá un aspecto

similar a este:
Depurar código
Cuando escriba código, debe ejecutarlo y probarlo para ver si hay errores. El sistema de
depuración de Visual Studio permite examinar el código por cada instrucción e
inspeccionar las variables a medida que se avanza. Puede establecer puntos de
interrupción que detengan la ejecución del código en una línea determinada y observar
cómo cambia el valor de la variable a medida que se ejecuta el código.

Establezca un punto de interrupción para ver el valor de la variable username mientras el

programa se está ejecutando.

1. Establezca un punto de interrupción en la línea de código que indica

Console.WriteLine("Hello " + username + "!") ; para ello, haga clic en el margen

izquierdo, o interno, junto a la línea. También puede seleccionar la línea de código

y, después, presionar F9.

Aparece un círculo rojo en el margen interno y la línea está resaltada.

 2. Para iniciar la depuración, seleccione Depurar>Iniciar depuración o presione F5.

3. Cuando aparezca la ventana de la consola y se le solicite su nombre, escríbalo.

El foco se devuelve al editor de código de Visual Studio y la línea de código con el

punto de interrupción se resalta en amarillo. El resaltado amarillo significa que esta
línea de código se ejecutará a continuación. El punto de interrupción hace que la
aplicación pause la ejecución en esta línea.

4. Mantenga el ratón sobre la variable username para ver su valor. También puede
hacer clic con el botón derecho en username y seleccionar Agregar inspección
para agregar la variable a la ventana Inspección, donde también puede ver su
valor.

5. Presione de nuevo F5 para terminar de ejecutar la aplicación.

Una vez que la aplicación se esté ejecutando, puede aplicar los cambios de código a la
aplicación en ejecución si hace clic en el botón "Recarga activa".

Para más información sobre la depuración en Visual Studio, consulte el recorrido por la
característica de depuración.
Pasos siguientes
Profundice aún más en Visual Studio con alguno de estos artículos introductorios:

Aprender a usar el editor de código

Información sobre proyectos y soluciones

Consulte también
Descubra más características de Visual Studio.
Visite visualstudio.microsoft.com .
Lea el blog de Visual Studio .
Información sobre cómo usar el editor
de código con Visual Basic
Artículo • 19/06/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta introducción de 10 minutos al editor de código de Visual Studio, se agrega

código a un archivo para ver algunas de las formas en que Visual Studio hace que
escribir y comprender el código de Visual Basic (así como desplazarse por él) sea más
fácil.

 Sugerencia

Si todavía no ha instalado Visual Studio, vaya a la página de descargas de Visual

Studio para instalarlo de forma gratuita.

En este artículo se da por hecho que ya está familiarizado con Visual Basic. Si no lo está,
le aconsejamos que antes eche un vistazo a un tutorial como Creación de una aplicación
de consola de Visual Basic (VB) sencilla.

 Sugerencia

Para realizar los procedimientos de este artículo, asegúrese de que tiene la

configuración de Visual Basic seleccionada en Visual Studio. Para más información
sobre cómo seleccionar configuraciones del entorno de desarrollo integrado (IDE),
vea Select environment settings (Seleccionar la configuración del entorno).

Crear un archivo de código

Empezaremos creando un archivo y agregándole código.

1. Abra Visual Studio. Presione Esc o seleccione Continuar sin código en la ventana
de inicio para abrir el entorno de desarrollo.

2. En el menú Archivo de la barra de menús, elija Nuevo>Archivo.

3. En el cuadro de diálogo Nuevo archivo, en la categoría General, elija Clase de

Visual Basic y, después, elija Abrir.
 Se abre un archivo nuevo en el editor con el esqueleto de una clase de Visual
Basic. (Ya habrá podido observar que no es necesario crear un proyecto de
Visual Studio completo para aprovechar algunas de las ventajas que ofrece el
editor de código, como el resaltado de sintaxis. Lo único que necesita es un
archivo de código.)

Uso de fragmentos de código

Visual Studio proporciona fragmentos de código muy prácticos que pueden servir para
generar bloques de código de uso común de forma rápida y sencilla. Existen fragmentos
de código disponibles para diferentes lenguajes de programación, como Visual Basic, C#
y C++. Vamos a agregar el fragmento de código Sub de Visual Basic a nuestro archivo.

1. Coloque el cursor encima de la línea End Class y escriba sub.

Aparece un cuadro de diálogo emergente con información sobre la palabra clave

Sub y en el que se indica cómo insertar el fragmento de código Sub.

2. Presione la tecla TAB dos veces para insertar el fragmento de código.

El esquema del procedimiento Sub MySub() se agrega al archivo.

Los fragmentos de código disponibles varían según el lenguaje de programación. Para

ver los fragmentos de código disponibles para Visual Basic, abra el menú contextual que
aparece al hacer clic con el botón derecho en el editor de código y elija Fragmento de
código>Insertar fragmento de código (o presione CTRL+K, CTRL+X). Hay fragmentos
de código de Visual Basic disponibles en las siguientes categorías:

Marcar código como comentario

La barra de herramientas, que es la fila de botones debajo de la barra de menús de
Visual Studio, puede ayudar a mejorar la productividad mientras se codifica. Por
ejemplo, puede activar o desactivar el modo de finalización de IntelliSense, aumentar o
reducir una sangría o marcar como comentario código que no se quiere compilar.
(IntelliSense es una ayuda de codificación que muestra una lista de métodos
coincidentes, entre otras cosas). En esta sección se comenta algún código.

1. Pegue el siguiente código en el cuerpo del procedimiento MySub() .

VB

' _words is a string array that we'll sort alphabetically

Dim _words = New String() {
"the",
"quick",
"brown",
"fox",
"jumps"
}

Dim morewords = New String() {

"over",
"the",
"lazy",
"dog"
}

Dim query = From word In _words

Order By word.Length
Select word
 2. No usaremos la matriz morewords , pero puede que sí lo hagamos más adelante, así
que no la eliminaremos por completo. En su lugar, lo que haremos será convertir
esas líneas en comentarios. Seleccione toda la definición de morewords hasta la
llave de cierre y, luego, seleccione el botón Marcar como comentario las líneas
seleccionadas en la barra de herramientas. Si prefiere usar el teclado, presione
Ctrl+K, Ctrl+C.

El carácter de comentario de Visual Basic ' se agrega al principio de cada línea

seleccionada para marcar el código como comentario.

Contraer bloques de código

Puede contraer secciones de código para centrarse solo en las partes que sean de su
interés. Para practicar, vamos a contraer la matriz _words a una línea de código.
Seleccione el cuadradito gris con el signo menos que se ve en el margen de la línea Dim
_words = New String() { . Si prefiere usar el teclado, coloque el cursor en cualquier lugar

en la definición de matriz y presione Ctrl+M, Ctrl+M.

El bloque de código se contrae para mostrar únicamente la primera línea seguida de un

botón de puntos suspensivos ( ... ). Para expandir el bloque de código de nuevo,
seleccione el mismo cuadro gris (que ahora tiene un signo más), o bien presione
CTRL+M, CTRL+M otra vez. Esta característica se denomina Esquematización y es
especialmente útil cuando se contraen métodos muy largos o clases enteras.

Ver definiciones de símbolos

Gracias al editor de Visual Studio, es muy sencillo inspeccionar la definición de un tipo o
un miembro de clase. Una forma consiste en ir al archivo que contiene la definición, por
ejemplo, seleccionando Ir a definición en cualquier lugar donde se haga referencia al
símbolo. Otra más rápida aún (y que no desplaza el enfoque del archivo en el que está
trabajando) es usar Ver la definición. Vamos a ver la definición del tipo String .

1. Haga clic con el botón derecho en la palabra String y elija Ver la definición en el
menú de contenido. O bien, presione Alt+F12.

Se abrirá una ventana emergente con la definición de la clase String . Puede

desplazarse dentro de la ventana emergente o incluso ver la definición de otro tipo
desde el código inspeccionado.

2. Para cerrar la ventana Ver la definición, seleccione el pequeño cuadro con una "x"
en la esquina superior derecha de la ventana emergente.

Usar IntelliSense para completar palabras

IntelliSense es un recurso impagable cuando se escribe código. Así, puede mostrar
información sobre los miembros disponibles de un tipo o detalles de los parámetros
para las distintas sobrecargas de un método. IntelliSense puede servir también para
completar una palabra después de escribir una serie de caracteres y, así, eliminar
cualquier tipo de ambigüedad. Se va a agregar una línea de código para imprimir las
cadenas ordenadas en la ventana de la consola, que es el lugar estándar para la salida
del programa.

1. Empiece a escribir el siguiente código debajo de la variable query :

VB

For Each str In qu

Verá cómo IntelliSense muestra Información rápida sobre el símbolo query .

 2. Presione Tab para insertar el resto de la palabra query por medio de la
funcionalidad de finalización de palabras de IntelliSense.

3. Termine el bloque de código de modo que se parezca al siguiente código.

VB

For Each str In query

Console.WriteLine(str)
Next

Refactorizar un nombre
Nadie crea código correctamente la primera vez y una de las cosas que probablemente
se tengan que cambiar es el nombre de una variable o un método. Vamos a probar la
funcionalidad de refactorización de Visual Studio para cambiar el nombre de la variable
_words a words .

1. Coloque el cursor sobre la definición de la variable _words , haga clic con el botón
derecho y elija Cambiar nombre en el menú contextual.

Se abre un cuadro de diálogo emergente Cambiar nombre en la parte superior

derecha del editor.

2. Con la variable _words aún seleccionada, escriba el nombre words. Observe que la
referencia a words en la consulta también cambia automáticamente de nombre.
Antes de presionar ENTRAR o Aplicar, active la casilla Incluir comentarios del
cuadro emergente Cambiar nombre.

3. Presione ENTRAR o seleccione Aplicar.

Ambas instancias de words cambian de nombre, así como la referencia a words en

el comentario de código.
Pasos siguientes
Información sobre proyectos y soluciones

Vea también
Fragmentos de código
Navegación en el código
Esquematización
Ir a definición y Ver la definición
Refactorización
Uso de IntelliSense
Información sobre proyectos y
soluciones con Visual Basic
Artículo • 19/06/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En este artículo introductorio se explica qué significa crear una solución y un proyecto en
Visual Studio. Una solución es un contenedor que se usa para organizar uno o más
proyectos de código relacionados, por ejemplo, un proyecto de biblioteca de clases y un
proyecto de prueba correspondiente. Echaremos un vistazo a las propiedades de un
proyecto y a algunos de los archivos que puede contener. También se crea una
referencia de un proyecto a otro.

 Sugerencia

Si todavía no ha instalado Visual Studio, vaya a la página de descargas de Visual

Studio para instalarlo de forma gratuita.

Se crean una solución y un proyecto desde cero como ejercicio educativo para
comprender el concepto de proyecto. Cuando use Visual Studio, es probable que
emplee alguna de las distintas plantillas de proyecto que Visual Studio ofrece al crear un
nuevo proyecto.

７ Nota

No hacen falta soluciones ni proyectos para desarrollar aplicaciones en Visual

Studio. Basta con abrir una carpeta que contenga código para empezar a codificar,
compilar y depurar. Por ejemplo, si clona un repositorio de GitHub , podría no
contener soluciones y proyectos de Visual Studio. Para obtener más información,
vea Desarrollo de código en Visual Studio sin proyectos o soluciones.

Soluciones y proyectos
A pesar de su nombre, una solución no es una "respuesta", sino simplemente
contenedores que Visual Studio usa para organizar uno o más proyectos relacionados.
Cuando se abre una solución en Visual Studio, esta carga automáticamente todos los
proyectos que la solución contiene.
Crear una solución
Comenzaremos nuestro periplo creando una solución vacía. Cuando se familiarice con
Visual Studio, lo más probable es que no cree soluciones vacías con frecuencia. Al crear
un proyecto, Visual Studio crea automáticamente una solución para hospedar ese
proyecto si es que no hay ya una solución abierta.

1. Abra Visual Studio.

2. En la ventana de inicio, elija Crear un proyecto nuevo.

3. En la página Crear un proyecto nuevo, escriba solución en blanco en el cuadro de

búsqueda, seleccione la plantilla Solución en blanco y elija Siguiente.

4. Asígnele a la solución el nombre QuickSolution y elija Crear.

Aparece una solución en el Explorador de soluciones, en el lado derecho de la

ventana de Visual Studio. Seguramente use el Explorador de soluciones a menudo
para examinar el contenido de los proyectos.

Agregar un proyecto
Ahora, agreguemos nuestro primer proyecto a la solución. Comenzaremos con un
proyecto vacío y le agregaremos los elementos que necesitamos.
1. En el menú contextual que aparece al hacer clic con el botón derecho en Solución
"QuickSolution" en el Explorador de soluciones, seleccione Agregar>Nuevo
proyecto.

Se abre un cuadro de diálogo de nombre Agregar un nuevo proyecto.

2. Escriba el texto vacío en el cuadro de búsqueda de la parte superior y, luego,

seleccione Visual Basic en la lista desplegable Todos los lenguajes.

3. Seleccione la plantilla Proyecto vacío (.NET Framework) y luego Siguiente.

4. Asigne el nombre QuickDate al proyecto y luego seleccione Crear.

Un proyecto denominado QuickDate aparece debajo de la solución en el

Explorador de soluciones. Actualmente solo contiene un archivo denominado
App.config.

７ Nota

Si no ve la plantilla Proyecto vacío (.NET Framework), tiene que instalar la

carga de trabajoDesarrollo de escritorio de .NET de Visual Studio. Visual
Studio usa la instalación basada en la carga de trabajo para instalar
únicamente los componentes necesarios para el tipo de desarrollo que lleva a
cabo. Una manera fácil de instalar una nueva carga de trabajo al crear un
nuevo proyecto es seleccionar el vínculo Instalar más herramientas y
características debajo del texto que indica ¿No encuentra lo que busca? .
Una vez que se abra el Instalador de Visual Studio, elija la carga de trabajo de
desarrollo de escritorio de .NET y luego haga clic en el botón Modificar.
Agregar un elemento al proyecto
Hay un proyecto vacío. Vamos a agregar un archivo de código.

1. En el menú contextual que aparece al hacer clic con el botón derecho en el

proyecto QuickDate del Explorador de soluciones, elija Agregar>Nuevo
elemento.

Se abrirá el cuadro de diálogo Agregar nuevo elemento.

2. Expanda Elementos comunes y elija Código. En el panel central, seleccione la

plantilla de elemento Clase. Ponga el nombre Calendar a la clase y luego haga clic
en el botón Agregar.

Un archivo denominado Calendar.vb se agrega al proyecto. El fragmento .vb del

final es la extensión de archivo de los archivos de código de Visual Basic. El archivo
aparece en la jerarquía visual del proyecto en el Explorador de soluciones y su
contenido se abre en el editor.

3. Reemplace el contenido del archivo Calendar.vb por el siguiente código:

VB

Class Calendar
Public Shared Function GetCurrentDate() As Date
Return DateTime.Now.Date
 End Function
End Class

La clase Calendar contiene una sola función, GetCurrentDate , que devuelve la

fecha actual.

4. Abra las propiedades del proyecto haciendo doble clic en Mi proyecto en el

Explorador de soluciones. En la pestaña Aplicación, cambie Tipo de aplicación
por Biblioteca de clases. Este paso es necesario para compilar el proyecto
correctamente.

5. Compile el proyecto haciendo clic con el botón derecho en QuickDate en el

Explorador de soluciones y seleccionando Compilar. Debería aparecer un mensaje
de compilación correcta en la ventana Resultados.

Agregar un segundo proyecto

Es común que las soluciones contengan más de un proyecto y, a menudo, estos
proyectos se hacen referencia entre sí. Algunos proyectos de una solución pueden ser
bibliotecas de clases; otros, aplicaciones ejecutables, y otros, proyectos de prueba
unitaria o sitios web.

Vamos a agregar un proyecto de prueba unitaria a la solución. Esta vez se empieza a

partir de una plantilla de proyecto, así que no es necesario agregar otro archivo de
código al proyecto.

1. En el menú contextual que aparece al hacer clic con el botón derecho en Solución
"QuickSolution" en el Explorador de soluciones, seleccione Agregar>Nuevo
proyecto.

2. En el cuadro de diálogo Agregar un nuevo proyecto, escriba el texto prueba

unitaria en el cuadro de búsqueda de la parte superior y, luego, seleccione Visual
Basic en la lista desplegable Todos los lenguajes.

3. Seleccione la plantilla de proyecto Proyecto de prueba unitaria (.NET Framework)

y luego seleccione Siguiente.

4. Asigne el nombre QuickTest al proyecto y luego seleccione Crear.

Se agregará un segundo proyecto al Explorador de soluciones, mientras que un

archivo denominado UnitTest1.vb se abre en el editor.

Agregar una referencia de proyecto

Usaremos el nuevo proyecto de prueba unitaria para probar nuestro método en el
proyecto QuickDate, por lo que necesitamos agregar una referencia a ese proyecto. La
referencia crea una dependencia de compilación entre ambos proyectos, lo que significa
que, al compilar la solución, QuickDate se compila antes que QuickTest.

1. Seleccione el nodo Referencias en el proyecto QuickTest y, en el menú contextual

que aparece al hacer clic con el botón derecho, seleccione Agregar referencia.

Se abre el cuadro de diálogo Administrador de referencias.

2. En el panel izquierdo, expanda Proyectos y elija Solución. En el panel central,

active la casilla junto a QuickDate y, después, seleccione el botón Aceptar.

Se agrega una referencia al proyecto QuickDate.

Agregar código de prueba

1. Ahora vamos a agregar código de prueba al archivo de código de Visual Basic.
Reemplace el contenido del archivo UnitTest1.vb por el siguiente código.

VB
 <TestClass()> Public Class UnitTest1

<TestMethod()> Public Sub TestGetCurrentDate()

Assert.AreEqual(Date.Now.Date,
QuickDate.Calendar.GetCurrentDate())
End Sub

End Class

Se ve una línea ondulada de color rojo debajo de algunas partes del código.
Solucionaremos este error cuando convirtamos el proyecto de prueba en un
ensamblado de confianza del proyecto QuickDate.

2. En el proyecto QuickDate, abra el archivo Calendar.vb, si aún no está abierto, y

agregue la siguiente instrucción Imports y el atributo InternalsVisibleToAttribute
para resolver el error en el proyecto de prueba.

VB

Imports System.Runtime.CompilerServices

<Assembly: InternalsVisibleTo("QuickTest")>

El archivo de código debe tener este aspecto:

Propiedades de proyecto
La línea del archivo Calendar.vb que contiene el atributo InternalsVisibleToAttribute hace
referencia al nombre de ensamblado (nombre de archivo) del proyecto QuickTest. El
nombre del ensamblado no siempre es el mismo que el nombre del proyecto. Para
averiguar el nombre del ensamblado de un proyecto, abra las propiedades del proyecto.

1. En el Explorador de soluciones, seleccione el proyecto QuickTest. En el menú

contextual que se abre al hacer clic con el botón derecho, seleccione Propiedades
 o, simplemente, presione Alt+ENTRAR. (También puede hacer doble clic en Mi
proyecto en el Explorador de soluciones).

Las páginas de propiedades del proyecto se abren en la pestaña Aplicación. Las

páginas de propiedades contienen varios valores para el proyecto. Fíjese en que el
nombre de ensamblado del proyecto QuickTest es, efectivamente, "QuickTest". Si
quisiera cambiar el nombre del ensamblado, aquí es donde lo haría. Así, al
compilar el proyecto de prueba, el nombre del archivo binario resultante cambiaría
de QuickTest.dll a lo que hubiera elegido.

2. Explore algunas de las otras pestañas de las páginas de propiedades del proyecto,
como Compilar y Configuración. Estas pestañas son diferentes para los distintos
tipos de proyectos.

(Opcional) Ejecutar la prueba

Si quiere comprobar que la prueba unitaria funciona, seleccione Probar>Ejecutar todas
las pruebas desde la barra de menús. Se abre una ventana denominada Explorador de
pruebas, donde debería ver que la prueba TestGetCurrentDate se supera.
  Sugerencia

Si la ventana Explorador de pruebas no se abre automáticamente, ábrala al elegir

Prueba>Windows>Explorador de pruebas en la barra de menús.

Pasos siguientes
Si desea seguir explorando Visual Studio, considere la posibilidad de crear una
aplicación siguiendo uno de los tutoriales de Visual Basic.

Consulte también
Crear proyectos y soluciones
Administración de propiedades de soluciones y proyectos
Administración de referencias en un proyecto
Desarrollo de código en Visual Studio sin proyectos o soluciones
Introducción al IDE de Visual Studio
Características de Visual Studio
Artículo • 19/06/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En este artículo se describen características para desarrolladores experimentados o para

aquellos desarrolladores que ya están familiarizados con Visual Studio. Puede encontrar
una introducción básica a Visual Studio en Introducción al IDE de Visual Studio.

Instalación modular
En el instalador modular de Visual Studio, elegirá e instalará las cargas de trabajo que
desee. Las cargas de trabajo son grupos de características que los lenguajes de
programación o las plataformas necesitan para funcionar. Esta estrategia modular ayuda
a reducir la superficie de instalación de Visual Studio, por lo que se instala y actualiza
más rápido.

Si todavía no ha instalado Visual Studio, vaya a la página de descargas de Visual

Studio para instalarlo de forma gratuita.

Para obtener más información sobre la configuración de Visual Studio en el sistema, vea
Instalación de Visual Studio.

Creación de aplicaciones de Azure habilitadas

para la nube
Visual Studio ofrece un conjunto de herramientas para crear fácilmente aplicaciones
habilitadas para la nube de Microsoft Azure. Puede configurar, compilar, depurar,
empaquetar e implementar aplicaciones y servicios de Azure directamente desde el
entorno de desarrollo integrado (IDE) de Visual Studio. Para obtener las plantillas de
proyecto y las herramientas de Azure, seleccione la carga de trabajo Desarrollo de
Azure al instalar Visual Studio.

） Importante
 La ventana de Cloud Explorer se retira en Visual Studio 2022. Para más información,
consulte Administración de los recursos asociados con las cuentas de Azure en
Visual Studio Cloud Explorer.

Use Azure Portal para acceder a los recursos de Azure según sea necesario. Puede
seguir usando el nodo de Azure del Explorador de servidores en versiones
anteriores de Visual Studio.

Puede usar servicios de Azure con sus aplicaciones agregando Servicios conectados,
por ejemplo:

El servicio conectado de Active Directory, para usar cuentas de Azure Active

Directory (Azure AD) para conectarse a las aplicaciones web.
Servicio conectado Azure Storage para el almacenamiento de blobs, colas y tablas
Servicio conectado Key Vault para administrar secretos para las aplicaciones web

Los servicios conectados disponibles dependerán del tipo de proyecto que tenga. Para
agregar un servicio, haga clic con el botón derecho en el proyecto en el Explorador de
soluciones y elija Agregar>Servicio conectado.

En la pantalla Servicios conectados, seleccione el vínculo o el signo más para agregar

una dependencia de servicio. En la pantalla Agregar dependencia, seleccione el servicio
que quiere agregar y siga las pantallas para conectarse a su suscripción y servicio de
Azure.
Para obtener más información, vea Move to the cloud With Visual Studio and Azure
(Pasarse a la nube con Visual Studio y Azure).

Creación de aplicaciones web

Visual Studio puede ayudarle a escribir aplicaciones para la Web. Puede crear
aplicaciones web mediante ASP.NET, Node.js, Python, JavaScript y TypeScript.
Visual Studio admite muchos marcos web, como Angular, jQuery y Express.

ASP.NET Core y .NET Core funcionan en los sistemas operativos Windows, Mac y
Linux. ASP.NET Core es una actualización principal a MVC, WebAPI y SignalR. ASP.NET
Core se diseñó desde la base para ofrecer una pila de .NET eficiente y componible, con
el fin de compilar servicios y aplicaciones web modernos basados en la nube.

Para obtener más información, vea Herramientas web modernas .

Compilar aplicaciones y juegos multiplataforma

Visual Studio puede crear aplicaciones y juegos para macOS, Linux y Windows, así como
para Android, iOS y otros dispositivos móviles . Con Visual Studio, puede crear:

Aplicaciones de .NET Core que se ejecutan en Windows, macOS y Linux.

Aplicaciones móviles para iOS, Android y Windows en C# y F# medianteXamarin .

Juegos 2D y 3D en C# mediante Visual Studio Tools para Unity.

Aplicaciones de C++ nativas para dispositivos iOS, Android y Windows. Comparta

código común en bibliotecas para iOS, Android y Windows mediante C++ para
desarrollo multiplataforma.

Conectarse a bases de datos

El Explorador de servidores ayuda a explorar y administrar instancias y recursos de
servidor de forma local y remota, y en Azure, Microsoft 365, Salesforce.com y sitios web.
Para abrir el Explorador de servidores, elija Ver>Explorador de servidores. Para obtener
más información sobre el uso del Explorador de servidores, vea Adición de nuevas
conexiones.

El Explorador de objetos de SQL Server ofrece una vista de los objetos de base de
datos similar a la de SQL Server Management Studio. Con el Explorador de objetos de
SQL Server puede realizar trabajos de administración y diseño de bases de datos ligeras.
Algunos ejemplos son la edición de datos de tabla, la comparación de esquemas y la
ejecución de consultas mediante menús contextuales.

Para abrir el Explorador de objetos de SQL Server, seleccione su icono en la parte

superior de la ventana Explorador de servidores o seleccione Ver>Explorador de
objetos de SQL Server en el menú superior de Visual Studio.

SQL Server Data Tools (SSDT) es un eficaz entorno de desarrollo para SQL Server, Azure
SQL Database y Azure SQL Data Warehouse. Con SSDT, puede compilar, depurar,
mantener y refactorizar bases de datos. Puede trabajar con un proyecto de base de
datos o directamente con una instancia de base de datos conectada de manera local o
externa. Para obtener SSDT, use el Instalador de Visual Studio para instalar la carga de
trabajo Almacenamiento y procesamiento de datos.
Depure, pruebe y mejore su código
Cuando escribe código, debe ejecutarlo y probarlo para comprobar que funciona sin
errores. Con el sistema de depuración de Visual Studio, puede depurar el código que se
ejecuta en el proyecto local, en un dispositivo remoto o en un emulador de dispositivo.
Ejecute el código una instrucción cada vez e inspeccione las variables mientras avanza.
O bien, establezca puntos de interrupción que solo se alcanzan cuando una condición
especificada es verdadera. Puede administrar las opciones de depuración en el propio
editor de código para que no tenga que salir del código.

Para más información sobre la depuración en Visual Studio, consulte Primer vistazo al
depurador.

Para mejorar el rendimiento de la aplicación, consulte la característica de generación de

perfiles de Visual Studio.

Visual Studio ofrece opciones de prueba, como pruebas unitarias, Live Unit Testing,
IntelliTest y pruebas de carga y rendimiento. Visual Studio también cuenta con funciones
avanzadas de análisis de código para detectar errores de diseño, de seguridad y de otro
tipo.

Implementar la aplicación finalizada

Visual Studio dispone de herramientas para implementar las aplicaciones en usuarios o
clientes mediante Microsoft Store, un sitio de SharePoint o las tecnologías de
InstallShield o Windows Installer. Puede acceder a todas estas opciones mediante el IDE
Visual Studio. Para más información, consulte Implementar aplicaciones, servicios y
componentes.

Administrar el código fuente y colaborar con

otras personas
En Visual Studio, puede administrar el código fuente en los repositorios de Git
hospedados por cualquier proveedor, incluido GitHub. También puede buscar una
instancia de Azure DevOps Server a la que conectarse.

Si desea la información detallada, consulte la página Experiencia de Git en Visual Studio

y la página de navegación Documentación sobre el control de versiones de
Visual Studio. Además, si desea un tutorial paso a paso sobre cómo conectarse a un
repositorio de Git o de Azure DevOps mediante Visual Studio, consulte la página
Apertura de un proyecto desde un repositorio.
  Sugerencia

Seguimos compilando el conjunto de características de Git y lo recorreremos en

iteración en función de sus comentarios. Para más información sobre una
actualización de características reciente con un vínculo a una encuesta en la que
puede compartir sus comentarios al respecto, consulte la entrada de blog
Compatibilidad con varios repositorios en Visual Studio .

Pasos siguientes
Si Visual Studio no tiene la funcionalidad exacta que necesita, puede agregarla.
Personalice el IDE en función de su flujo de trabajo y estilo, agregue
compatibilidad con herramientas externas que aún no se hayan integrado con
Visual Studio y modifique la funcionalidad existente para aumentar la
productividad. Para obtener la versión más reciente de las Herramientas de
extensibilidad de Visual Studio (SDK de VS), consulte Kit de desarrollo de software
(SDK) de Visual Studio.

Puede usar .NET Compiler Platform Roslyn para escribir sus propios analizadores y
generadores de código. Encuentre todo lo que necesita en Roslyn .

Busque las extensiones existentes para Visual Studio creadas por los
desarrolladores de Microsoft y la comunidad de desarrollo de Visual Studio.

Para obtener más información acerca de la extensión de Visual Studio, consulte

Extender el IDE de Visual Studio .

Vea también
Introducción al IDE de Visual Studio
Novedades de Visual Studio 2017
Novedades de Visual Studio 2019
Novedades de Visual Studio 2022
Tutorial: Creación de una aplicación de
consola de Visual Basic (VB) sencilla
Artículo • 08/05/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En este artículo se muestra cómo se va a usar Visual Studio para crear una aplicación de
Visual Basic sencilla, una aplicación de consola. En esta aplicación, se pide al usuario su
nombre y, a continuación, se muestra de nuevo con la hora actual. También explorará
algunas características del entorno de desarrollo integrado (IDE) de Visual Studio,
incluido el control de código fuente en Git. Visual Basic es un lenguaje de programación
con seguridad de tipos diseñado para ser fácil de aprender. Una aplicación de consola
toma la entrada y muestra la salida en una ventana de línea de comandos, también
conocida como consola.

En este tutorial, aprenderá a:

＂ Creación de un proyecto de Visual Studio

＂ Ejecución de la aplicación predeterminada
＂ Adición de código para solicitar la entrada de usuario
＂ Crédito adicional: adición de dos números
＂ Adición de control de código fuente Git
＂ Limpieza de recursos

Requisitos previos
Si todavía no ha instalado Visual Studio, vaya a la página de descargas de Visual
Studio para instalarlo de forma gratuita.

Crear un proyecto
En primer lugar, crearemos un proyecto de aplicación de Visual Basic. La plantilla de
proyecto predeterminada incluye todos los archivos que necesitará para una aplicación
que se puede ejecutar.

1. Abra Visual Studio.

2. En la ventana de inicio, elija Crear un proyecto nuevo.

3. En la ventana Crear un nuevo proyecto, elija Visual Basic en la lista Idioma. A
continuación, seleccione Windows en la lista Plataforma y Consola en la lista Tipos
de proyecto.

Después de aplicar los filtros de lenguaje, plataforma y tipo de proyecto, elija la

plantilla Aplicación de consola y, luego, seleccione Siguiente.

７ Nota
 Si no ve la plantilla Aplicación de consola, puede instalarla desde la ventana
Crear un proyecto. En el mensaje ¿No encuentra lo que busca? , elija el
vínculo Instalar más herramientas y características.

A continuación, en el Instalador de Visual Studio, elija la carga de trabajo

Desarrollo de escritorio de .NET.

Después, elija el botón Modificar en el Instalador de Visual Studio. Es posible

que se le pida que guarde su trabajo. Seguidamente, elija Continuar para
instalar la carga de trabajo. Luego, vuelva al paso 2 de este procedimiento
Creación de un proyecto.

4. En la ventana Configurar el nuevo proyecto, escriba WhatIsYourName en el cuadro

Nombre del proyecto. Después, elija Siguiente.

5. En la ventana Información adicional, .NET 6.0 (Compatibilidad a largo plazo) ya

debe estar seleccionado para la plataforma de destino. Si no es así, seleccione
.NET 6.0 (Compatibilidad a largo plazo) . Luego, elija Crear.
 Visual Studio se abre en el nuevo proyecto.

Ejecutar la aplicación
Tras seleccionar la plantilla de proyecto de Visual Basic y asignar un nombre al proyecto,
Visual Studio crea un archivo Program.vb. El código predeterminad llama al método
WriteLine que muestra la cadena literal "Hello World!" en la ventana de la consola.

Hay dos maneras de ejecutar este código, dentro de Visual Studio en modo de
depuración y desde el equipo como una aplicación independiente normal.

Ejecución de la aplicación en modo de depuración

1. Seleccione el botón WhatIsYourName o presione F5 para ejecutar el código

predeterminado en modo de depuración.
 2. Cuando la aplicación se ejecuta en la consola de depuración de Microsoft
Visual Studio, se muestra "Hello World!" Presione cualquier tecla para cerrar la
ventana de la consola de depuración y salir de la aplicación.

Ejecución de la aplicación como independiente

Para ver la salida fuera de Visual Studio, en una ventana de la consola del sistema,
compile y ejecute el archivo ejecutable (archivo .exe).

1. En el menú Compilar, elija Compilar solución.

2. En el Explorador de soluciones, haga clic con el botón derecho en

WhatIsYourName y elija Abrir archivo en Explorador de archivos.

3. En el Explorador de archivos, vaya al directorio bin\Debug\net6.0 y ejecute

WhatIsYourName.exe.

4. El procedimiento Main finaliza después de que se ejecute su única instrucción y la

ventana de consola se cierre inmediatamente. Para mantener la consola visible
hasta que el usuario presione una tecla, consulte la sección siguiente.

Adición de código para solicitar la entrada de

usuario
A continuación, agregará el código de Visual Basic que le pedirá su nombre y lo
mostrará junto con la fecha y hora actuales. Además, agregará código que pausa la
ventana de consola hasta que el usuario presione una tecla.

1. Escriba el siguiente código de Visual Basic después de la línea Sub Main(args As

String()) y antes de la línea End Sub , reemplazando la línea WriteLine:

VB

Console.Write("Please enter your name: ")

Dim name = Console.ReadLine()
Dim currentDate = DateTime.Now
Console.WriteLine($"Hello, {name}, on {currentDate:d} at
{currentDate:t}")
Console.Write("Press any key to continue...")
Console.ReadKey(True)

Write y WriteLine escriben una cadena en la consola.

ReadLine lee la entrada de la consola, en este caso una cadena.
DateTime representa un valor datetime y Now devuelve la hora actual.
ReadKey() pausa la aplicación y espera una pulsación de tecla.

2. Seleccione el botón WhatIsYourName o presione F5 para compilar y ejecutar la

aplicación en modo de depuración.

3. Cuando se abra la ventana de la consola de depuración, escriba su nombre. La

ventana de consola debe ser similar a la captura de pantalla siguiente:
 4. Presione cualquier tecla para finalizar la aplicación y, a continuación, presione
cualquier tecla para cerrar la ventana de la consola de depuración.

Ahora que el nuevo código está en la aplicación, compile y ejecute el archivo ejecutable
(archivo .exe) en una ventana de la consola del sistema, tal como se describió
anteriormente en Ejecución de la aplicación como independiente. Ahora, al presionar
una tecla, la aplicación se cierra, lo que cierra la ventana de consola.

Crédito adicional: adición de dos números

En este ejemplo se muestra cómo leer en números, en lugar de una cadena, y realizar
algunas operaciones aritméticas. Pruebe a cambiar el código de:

VB

Module Program
Sub Main(args As String())
Console.Write("Please enter your name: ")
Dim name = Console.ReadLine()
Dim currentDate = DateTime.Now
Console.WriteLine($"Hello, {name}, on {currentDate:d} at
{currentDate:t}")
Console.Write("Press any key to continue...")
Console.ReadKey(True)
End Sub
End Module

a:

VB
 Module Program
Public num1 As Integer
Public num2 As Integer
Public answer As Integer
Sub Main(args As String())
Console.Write("Type a number and press Enter")
num1 = Console.ReadLine()
Console.Write("Type another number to add to it and press Enter")
num2 = Console.ReadLine()
answer = num1 + num2
Console.WriteLine("The answer is " & answer)
Console.Write("Press any key to continue...")
Console.ReadKey(True)
End Sub
End Module

A continuación, ejecute la aplicación actualizada como se describe en "Ejecución de la

aplicación".

Adición de control de código fuente Git

Ahora que ha creado una aplicación, es posible que quiera agregarla a un repositorio de
Git. Visual Studio facilita el proceso con las herramientas de Git que puede usar
directamente desde el IDE.

 Sugerencia

Git es el sistema de control de versiones moderno más usado, por lo que, tanto si
es un desarrollador profesional como si está aprendiendo a codificar, Git puede ser
muy útil. Si ha empezado a usar Git recientemente, el sitio web https://git-
scm.com/ es un buen punto de partida. Allí encontrará hojas de referencia
rápida, un libro en línea conocido y vídeos de conceptos básicos de Git.

Para asociar el código a Git, empiece por crear un nuevo repositorio de Git donde se
encuentra el código.

1. En la barra de estado de la esquina inferior derecha de Visual Studio, seleccione

Agregar al control de código fuente y, a continuación, Git.
2. Cuadro de diálogo Crear un repositorio GIT inicie sesión en GitHub.

El nombre del repositorio se rellena automáticamente en función de la ubicación

de la carpeta. De forma predeterminada, el nuevo repositorio es privado, lo que
significa que usted es el único que puede acceder a él.

 Sugerencia

Tanto si el repositorio es público como privado, es mejor tener una copia de

seguridad remota del código almacenada de forma segura en GitHub. Incluso
si no trabaja con un equipo, un repositorio remoto pone el código a su
disposición desde cualquier equipo.

3. Seleccione Crear e insertar.

Después de crear el repositorio, verá los detalles de estado en la barra de estado.

El primer icono con las flechas muestra cuántas confirmaciones salientes o

entrantes hay en la rama actual. Puede usar este icono para extraer las
 confirmaciones entrantes o insertar las confirmaciones salientes. Puede elegir ver
estas confirmaciones en primer lugar. Para ello, seleccione el icono y, a
continuación, Ver salientes y entrantes.

El segundo icono con el lápiz muestra el número de cambios no confirmados en el

código. Puede seleccionar este icono para ver esos cambios en la ventana
Cambios de Git.

Para obtener más información sobre cómo usar Git con la aplicación, consulte la
documentación del control de versiones de Visual Studio.

Limpieza de recursos
Si no va a seguir usando esta aplicación, elimine el proyecto.

1. En el Explorador de soluciones, haga clic con el botón derecho en

WhatIsYourName para abrir el menú contextual del proyecto. A continuación,
seleccione Abrir carpeta en el Explorador de archivos.

2. Cierre Visual Studio.

3. En el cuadro de diálogo Explorador de archivos, suba dos niveles de carpetas.

4. Haga clic con el botón derecho en la carpeta WhatIsYourName y seleccione

Eliminar.

Pasos siguientes
Enhorabuena por completar este tutorial. Para más información, continúe con el tutorial
siguiente.

Creación de una biblioteca con Visual Basic y el SDK de .NET Core en Visual Studio

Consulte también
Tutoriales sobre el lenguaje Visual Basic
Referencia del lenguaje Visual Basic
Archivos de código de IntelliSense para Visual Basic
Creación de una aplicación "Hello,
world" (XAML)
Artículo • 14/12/2022 • Tiempo de lectura: 8 minutos

Este tutorial le enseña a usar XAML y C# para crear una aplicación sencilla "Hello, world"
para la Plataforma universal de Windows (UWP) en Windows. Con un único proyecto en
Microsoft Visual Studio, puede compilar una aplicación que se ejecute en todas las
versiones de Windows 10 y Windows 11.

Aquí aprenderás a:

Crear un nuevo proyecto de Visual Studio diseñado para Windows 10 y UWP.

Escribe XAML para cambiar la interfaz de usuario en la página de inicio.
Ejecutar el proyecto en el escritorio local de Visual Studio.
Usa un SpeechSynthesizer para que la aplicación hable al presionar un botón.

Antes de comenzar...
¿Qué es una aplicación universal de Windows?
Descargue Visual Studio (y Windows). Si necesitas un poco de ayuda, obtén
información sobre cómo prepararte.
También se supone que estás usando el diseño de ventana predeterminado de
Visual Studio. Si cambias el diseño predeterminado, puedes restablecerlo en el
menú Ventana con el comando Restablecer diseño de la ventana.

７ Nota

En este tutorial se usa Visual Studio Community 2017. Si usa otra versión de Visual
Studio, es posible que tenga una apariencia un poco diferente.

Paso 1: Crear un nuevo proyecto en Visual

Studio
1. Inicia Visual Studio.

2. En el menú Archivo, seleccione Nuevo > Proyecto... para abrir el cuadro de

diálogo Nuevo proyecto.
3. En la lista de plantillas del lado izquierdo, abra Instalado > Visual C# > Windows
Universal para ver la lista de plantillas de proyecto para UWP.

(Si no ve ninguna plantilla universal, es posible que no tenga los componentes

para crear aplicaciones para UWP. Para repetir el proceso de instalación y agregar
la compatibilidad con UWP, haga clic en Abrir el instalador de Visual Studio en el
cuadro de diálogo Nuevo proyecto. Consulte Preparación).

4. Elige la plantilla Aplicación vacía (Windows Universal) y escribe "HelloWorld"

como Nombre. Seleccione Aceptar.

７ Nota
 Si es la primera vez que usa Visual Studio, es posible que se le solicite habilitar
el Modo desarrollador en el diálogo de configuración. El modo de
desarrollador es una opción de configuración especial que habilita
determinadas funciones, como permiso para ejecutar aplicaciones
directamente, en lugar de solo desde la Store. Para obtener más información,
lea Habilitar el dispositivo para el desarrollo. Para continuar con esta guía,
selecciona Modo de desarrollador, haz clic en Sí y cierra el cuadro de diálogo.

5. Se visualiza el cuadro de diálogo de versión mínima/de destino. La configuración

predeterminada es correcta para este tutorial, por lo tanto, seleccione Aceptar
para crear el proyecto.

6. Cuando se abra el nuevo proyecto, sus archivos se muestran en el panel

Explorador de soluciones de la derecha. Es posible que debas elegir la pestaña
 Explorador de soluciones en lugar de la pestaña Propiedades para ver los
archivos.

Aunque Aplicación vacía (Universal Window) es una plantilla mínima, contiene muchos
archivos. Estos archivos son esenciales para todas las aplicaciones para UWP que usan
C#. Todos los proyectos que crees en Visual Studio contendrán estos archivos.

¿Qué hay en los archivos?

Para ver y editar un archivo de tu proyecto, haz doble clic en el archivo en el Explorador
de soluciones. Expande un archivo XAML como una carpeta para ver su archivo de
código asociado. Los archivos XAML se abren en una vista en dos paneles que muestra
la superficie de diseño y el editor de XAML.

７ Nota

¿Qué es XAML? El lenguaje de marcado de aplicaciones extensible (XAML) es el

lenguaje que se usa para definir la interfaz de usuario de la aplicación. Puede
especificarse manualmente, o crearse con las herramientas de diseño de Visual
 Studio. Un archivo .xaml tiene un archivo de código subyacente .xaml.cs que
contiene la lógica. Juntos, el XAML y el código subyacente forman una clase
completa. Para obtener más información, consulta Introducción a XAML.

App.xaml y App.xaml.cs

App.xaml es donde declaras recursos que se usan en la aplicación.

App.xaml.cs es el archivo de código subyacente de App.xaml. Como todas las
páginas de código subyacente, contiene un constructor que llama al método
InitializeComponent . Tú no escribes el método InitializeComponent . Lo genera

Visual Studio, y su principal propósito es inicializar los elementos declarados en el

archivo XAML.
App.xaml.cs es el punto de entrada para la aplicación.
App.xaml.cs también contiene métodos para controlar la activación y la suspensión
de la aplicación.

MainPage.xaml

MainPage.xaml es donde defines la interfaz de usuario para la aplicación. Puedes

agregar elementos directamente con el marcado XAML o puedes usar las
herramientas de diseño suministradas por Visual Studio.
MainPage.xaml.cs es la página de código subyacente de MainPage.xaml. Es el sitio
donde agregas los controladores de eventos y la lógica de la aplicación.
Estos dos archivos juntos definen una nueva clase denominada MainPage , que se
hereda de Página, en el espacio de nombres HelloWorld .

Package.appxmanifest

Un archivo de manifiesto que describe tu aplicación: su nombre, descripción,

icono, página de inicio, etc.
Incluye una lista de dependencias, recursos y archivos que contiene la aplicación.

Un conjunto de imágenes de logotipo

Assets/Square150x150Logo.scale-200.png y Wide310x150Logo.scale 200.png

representan a tu aplicación (en tamaño mediano o ancho) en el menú Inicio.
Assets/Square44x44Logo.png representa a la aplicación en la lista de aplicaciones
del menú Inicio, la barra de tareas y el administrador de tareas.
Assets/StoreLogo.png representa tu aplicación en Microsoft Store.
Assets/SplashScreen.scale-200.png es la pantalla de presentación que se muestra
cuando se inicia la aplicación.
Assets/LockScreenLogo.scale-200.png puede usarse para representar la aplicación
en la pantalla de bloqueo cuando el sistema está bloqueado.
Paso 2: Agregar un botón

Uso de la vista de diseñador

Vamos a agregar un botón a nuestra página. En este tutorial, trabajas con solo algunos
de los archivos mencionados anteriormente: App.xaml, MainPage.xaml y
MainPage.xaml.cs.

1. Haz doble clic en MainPage.xaml para abrirlo en la vista de Diseño.

Verás que hay una vista gráfica en la parte superior de la pantalla y la vista del
código XAML debajo. Puedes realizar cambios en cualquiera de los dos, pero por
ahora vamos a utilizar la vista gráfica.

2. Haz clic en la pestaña vertical Herramientas a la izquierda para abrir la lista de

controles de interfaz de usuario. (Puedes hacer clic en el icono de anclaje en la
barra de título para mantenerlo visible.)
3. Expande Controles de XAML comunesy arrastra el Botón hacia el centro del lienzo
de diseño.
 Si buscas en la ventana de código XAML, verás que el botón se ha agregado allí
también:

XAML

<Button x:Name="button" Content="Button" HorizontalAlignment="Left" Margin =

"152,293,0,0" VerticalAlignment="Top"/>

4. Cambia el texto del botón.

Haz clic en la vista del código XAML y cambia el contenido del "Botón" a "Hello,
world!".

XAML

<Button x:Name="button" Content="Hello, world!" HorizontalAlignment="Left"

Margin = "152,293,0,0" VerticalAlignment="Top"/>

Observa cómo se muestra el botón en las actualizaciones del lienzo de diseño para
mostrar el texto nuevo.

Paso 3: Inicio de la aplicación

En este punto, has creado una aplicación muy sencilla. Este es un buen momento para
compilar, implementar e iniciar tu aplicación para ver su aspecto. Puedes depurar la
aplicación en el equipo local, en un simulador, un emulador o en un dispositivo remoto.
Este es el menú del dispositivo de destino de Visual Studio.

Iniciar la aplicación en un dispositivo de escritorio

De forma predeterminada, la aplicación se ejecuta en el equipo local. El menú del
dispositivo de destino proporciona varias opciones para depurar la aplicación en
dispositivos de la familia de dispositivos de escritorio.

Simulador
Equipo local
Equipo remoto

Para empezar la depuración en el equipo local

1. En el menú del dispositivo de destino ( ) de la barra de

herramientas Estándar, asegúrese de que Equipo local esté seleccionado. (Es la
selección predeterminada).
2. Haga clic en el botón Iniciar depuración ( ) en la barra de herramientas.

-o bien-

En el menú Depurar, haz clic en Iniciar depuración.

-o bien-

Presiona F5.

La aplicación se abre en una ventana y, en primer lugar, aparece una pantalla de

presentación predeterminada. Esta pantalla se define mediante una imagen
(SplashScreen.png) y un color de fondo (especificado en el archivo de manifiesto de la
aplicación).

La pantalla de presentación desaparece y, a continuación, aparece tu aplicación. Tiene

esta apariencia.

Presiona la tecla Windows para abrir el menú Inicio y mostrar todas las aplicaciones. Ten
en cuenta que al implementar la aplicación localmente se agrega su icono al menú
Inicio. Para ejecutar la aplicación de nuevo más adelante (no en modo de depuración),
pulsa o haz clic en su icono en el menú Inicio.

No hace muchas cosas (todavía), pero te felicitamos, has compilado tu primera

aplicación para UWP.

Para detener la depuración

Haga clic en el botón Detener depuración ( ) en la barra de herramientas.

-o bien-

En el menú Depurar, haz clic en Detener depuración.

-o bien-

Cierra la ventana de la aplicación.

Paso 4: Controladores de eventos
Un "controlador de eventos" suena complicado, pero es simplemente otra forma de
designar el código que se llama cuando se produce un evento (por ejemplo, cuando el
usuario hace clic en tu botón).

1. Para el funcionamiento de la aplicación, si no lo has hecho ya.

2. Haz doble clic en el control de botón en el lienzo de diseño para hacer que Visual
Studio cree un controlador de eventos para el botón.

Por supuesto, también puedes crear todo el código manualmente. O puedes hacer clic
en el botón para seleccionarlo y buscar en el panel Propiedades en la esquina inferior
derecha. Si cambias a Eventos (el pequeño relámpago) puedes agregar el nombre del
controlador de eventos.

3. Edita el código del controlador de eventos en MainPage.xaml.cs, la página de

código subyacente. Aquí es cuando se pone interesante. El controlador de eventos
predeterminado tiene este aspecto:

C#

private void Button_Click(object sender, RoutedEventArgs e)

{

Vamos a cambiarlo para que tenga esta apariencia:

C#

private async void Button_Click(object sender, RoutedEventArgs e)

{
MediaElement mediaElement = new MediaElement();
var synth = new Windows.Media.SpeechSynthesis.SpeechSynthesizer();
Windows.Media.SpeechSynthesis.SpeechSynthesisStream stream = await
synth.SynthesizeTextToStreamAsync("Hello, World!");
mediaElement.SetSource(stream, stream.ContentType);
mediaElement.Play();
}

Asegúrate de que la firma del método ahora incluya la palabra clave async, o se
producirá un error cuando se intente ejecutar la aplicación.

¿Qué acabamos de hacer?

Este código usa algunas API de Windows para crear un objeto de síntesis de voz y luego
le proporciona algo de texto para que lo lea. (Para obtener más información sobre el
uso de SpeechSynthesis, consulta los documentos sobre el Espacio de nombres
SpeechSynthesis.)

Cuando ejecutes la aplicación y hagas clic en el botón, tu equipo (o teléfono)

literalmente dirá "¡Hello, World!".

Resumen
Enhorabuena, ha creado su primera aplicación para Windows y la UWP.

Para aprender a usar XAML el diseño de los controles que usará la aplicación, prueba el
tutorial sobre la cuadrícula, o dirígete directamente a los pasos siguientes.

Consulte también
Tu primera aplicación
Publicar tu aplicación para UWP
Artículos sobre el desarrollo de aplicaciones para UWP
Ejemplos de código para desarrolladores de UWP
¿Qué es una aplicación universal de Windows?
Registrarse para obtener una cuenta de Windows
Tutorial: Creación de una aplicación
WPF con Visual Basic
Artículo • 19/06/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En este tutorial, creará una aplicación mediante Visual Basic en el entorno de desarrollo
integrado (IDE) de Visual Studio. El programa usará el marco de interfaz de usuario de
Windows Presentation Foundation (WPF). Use este tutorial para familiarizarse con
muchas de las herramientas, los cuadros de diálogo y los diseñadores que puede usar
en Visual Studio.

En este tutorial, aprenderá a:

＂ Creación del proyecto

＂ Configurar una ventana y agregar texto
＂ Agregar botones y código
＂ Depurar y probar la aplicación
＂ Depurar con puntos de interrupción
＂ Compilar una versión de lanzamiento

¿Qué es WPF?
WPF, o Windows Presentation Foundation, es un marco de interfaz de usuario que crea
aplicaciones cliente de escritorio. La plataforma de desarrollo de WPF admite un amplio
conjunto de características de desarrollo de aplicaciones, incluido un modelo de
aplicación, recursos, controles, gráficos, diseños, enlace de datos, documentos y
seguridad.

WPF forma parte de .NET, por lo que si ya ha creado aplicaciones con .NET mediante
ASP.NET o Windows Forms, la experiencia de programación debe resultarle familiar.
WPF usa el lenguaje XAML para proporcionar un modelo declarativo para la
programación de aplicaciones. Para obtener más información, vea Información general
sobre .NET de WPF.

Requisitos previos
Necesitará Visual Studio para completar este tutorial. Visite la página de descargas de
Visual Studio para obtener una versión gratuita.
Creación del proyecto
Cuando cree una aplicación en Visual Studio, primero creará un proyecto. En este
tutorial, cree un proyecto de Windows Presentation Foundation.

1. Abra Visual Studio.

2. En la ventana de inicio, elija Crear un proyecto nuevo.

3. En la ventana Crear un proyecto nuevo, busque "WPF" y seleccione Visual Basic en

la lista desplegable Todos los lenguajes. Elija Aplicación de WPF
(.NET Framework) y, luego, seleccione Siguiente.
 4. Asígnele al proyecto un nombre, HelloWPFApp, y seleccione Crear.

Visual Studio crea el proyecto y la solución HelloWPFApp. El Explorador de

soluciones muestra los diversos archivos.

WPF Designer muestra una vista de diseño y una vista XAML de MainWindow.xaml en
una vista en dos paneles.

７ Nota
 Para más información sobre XAML, consulte la información general de XAML para
WPF.

Configurar una ventana y agregar texto

Mediante la ventana Propiedades, puede mostrar y cambiar las opciones de los
elementos del proyecto, los controles y otros elementos.

1. En el Explorador de soluciones, abra el archivo MainWindow.xaml.

2. En la vista XAML, cambie el valor de la propiedad Window.Title de

Title="MainWindow" a Title="Greetings" .

3. En el lado izquierdo del IDE de Visual Studio, seleccione la pestaña Cuadro de

herramientas. Si no la ve, seleccione Ver>Cuadro de herramientas en la barra de
menús o presione Ctrl+Alt+X.

4. Expanda Controles WPF comunes o escriba Text en la barra de búsqueda para

encontrar TextBlock.

5. Seleccione el elemento TextBlock y arrástrelo a la ventana de la superficie de

diseño. Puede arrastrar el control TextBlock para moverlo. Use las guías para
colocar el control.
 El marcado XAML debe tener un aspecto similar a este ejemplo:

XAML

<TextBlock HorizontalAlignment="Left" Margin="381,100,0,0"

TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top"/>

6. En la vista XAML, ubique el marcado de TextBlock y cambie el atributo Text:

XAML

Text="Select a message option and then choose the Display button."

Si es necesario, vuelva a centrar TextBlock.

7. Seleccione el botón Guardar todo de la barra de herramientas para guardar la

aplicación. O bien, para guardar la aplicación, elija Archivo>Guardar todo en la
barra de menús o presione Ctrl+Mayús+S. El procedimiento recomendado
consiste en guardar desde el principio y a menudo.

Agregar botones y código

La aplicación usa dos botones de radio y un botón. Siga estos pasos para agregarlos.
Agregará código de Visual Basic al botón. Dicho código hace referencia a la selección
del botón de radio.

1. En el Cuadro de herramientas, busque RadioButton.

2. Agregue dos controles RadioButton a la superficie de diseño. Para ello, seleccione
el elemento RadioButton y arrástrelo a la superficie de diseño. Para mover los
botones, selecciónelos y use las teclas de dirección. Coloque los botones uno al
lado de otro bajo el control TextBlock.

3. En la ventana Propiedades del control RadioButton izquierdo, cambie la propiedad

Name, que se encuentra en la parte superior de la ventana Propiedades, a
HelloButton.
4. En la ventana Propiedades del control RadioButton derecho, cambie la propiedad
Name a GoodbyeButton.

5. Cambie el atributo Content de HelloButton y GoodbyeButton a "Hello" y

"Goodbye" en el XAML.

XAML

<Grid>
<TextBlock HorizontalAlignment="Left" Margin="252,47,0,0"
TextWrapping="Wrap" Text="Select a message option and then choose the
Display button." VerticalAlignment="Top"/>
<RadioButton x:Name="HelloButton" Content="Hello"
HorizontalAlignment="Left" Margin="297,161,0,0"
VerticalAlignment="Top"/>
<RadioButton x:Name="GoodbyeButton" Content="Goodbye"
HorizontalAlignment="Left" Margin="488,161,0,0"
VerticalAlignment="Top"/>
</Grid>

6. En la vista XAML, busque el marcado de HelloButton y agregue un atributo

IsChecked:

XAML

IsChecked="True"
 El atributo IsChecked con el valor True significa que HelloButton está activado de
manera predeterminada. Esta configuración significa que el botón de radio
siempre está seleccionado, incluso cuando se inicia el programa.

7. En el Cuadro de herramientas, busque el control Button y, luego, agregue un

botón a la superficie de diseño, bajo los controles RadioButton.

8. En la vista XAML, cambie el valor de Content del control Button de

Content="Button" a Content="Display" .

XAML

<Button Content="Display" HorizontalAlignment="Left"

VerticalAlignment="Top" Width="75" Margin="215,204,0,0"/>

La ventana debería tener un aspecto similar al de la imagen siguiente.

9. En la superficie de diseño, haga doble clic en el botón Mostrar .

Se abre Greetings.xaml.vb con el cursor en el evento Button_Click .

VB

Private Sub Button_Click(sender As Object, e As RoutedEventArgs)

End Sub

10. Agregue el siguiente código:

VB
 If HelloButton.IsChecked = True Then
MessageBox.Show("Hello.")
ElseIf GoodbyeButton.IsChecked = True Then
MessageBox.Show("Goodbye.")
End If

Depurar y probar la aplicación

Después, depurará la aplicación para buscar errores y probar que los dos cuadros de
mensaje aparecen correctamente. Para ver cómo funciona este proceso, el primer paso
introduce deliberadamente un error en el programa.

1. En el Explorador de soluciones, haga clic con el botón derecho en

MainWindow.xaml y seleccione Cambiar nombre. Cambie el nombre del archivo
por Greetings.xaml.

2. Para iniciar el depurador, presione F5 o seleccione Depurar y, a continuación,

Iniciar depuración.

Aparece la ventana Modo de interrupción y en la ventana Salida se indica que se

produjo una excepción.

3. Detenga el depurador. Para ello, elija Depurar>Detener depuración.

Cambió el nombre de MainWindow.xaml a Greetings.xaml al comienzo de esta

sección. El código sigue haciendo referencia a MainWindow.xaml como el URI de
inicio de la aplicación, por lo que no se puede iniciar el proyecto.

4. En el Explorador de soluciones, abra el archivo Application.xaml.

5. Cambie StartupUri="MainWindow.xaml" a StartupUri="Greetings.xaml" .

 6. Vuelva a iniciar el depurador (presione F5). Ahora debería ver la ventana Greetings
de la aplicación.

7. Seleccione Hello y el botón Display y, luego, Goodbye y el botón Display. Use el

icono de cierre que está en la esquina superior derecha para detener la
depuración.

Para más información, consulte los artículos sobre cómo compilar una aplicación de
WPF y cómo depurar WPF.

Depurar con puntos de interrupción

Puede probar el código durante la depuración. Para ello, agregue algunos puntos de
interrupción.

1. Abra Greetings.xaml.vb y seleccione la línea siguiente: MessageBox.Show("Hello.")

2. Para agregar un punto de interrupción, presione F9 o seleccione Depurar y, luego,

Alternar punto de interrupción.

Aparece un círculo rojo al lado de la línea de código en el margen izquierdo de la

ventana del editor.

3. Seleccione la línea siguiente: MessageBox.Show("Goodbye.") .

4. Presione la tecla F9 para agregar un punto de interrupción y, después, presione F5

para iniciar la depuración.

5. En la ventana Greetings, seleccione el botón Hello y, luego, seleccione Display.

 La línea MessageBox.Show("Hello.") se resalta en amarillo. En la parte inferior del
IDE, las ventanas Automático, Variables locales e Inspección se acoplan juntas a la
izquierda. Las ventanas Pila de llamadas, Puntos de interrupción, Configuración
de excepciones, Comando, Inmediato y Salida se acoplan juntos a la derecha.

6. En la barra de menús, elija Depurar>Paso a paso para salir.

La aplicación se vuelve a iniciar. Aparece un cuadro de diálogo con la palabra

"Hello".

7. Elija el botón Aceptar para cerrar el cuadro de diálogo.

8. En la ventana Greetings , elija el botón de radio Goodbye y después elija el botón

Mostrar .

La línea MessageBox.Show("Goodbye.") se resalta en amarillo.

9. Presione la tecla F5 para continuar con la depuración. Cuando aparezca el cuadro

de diálogo, elija Aceptar para cerrarlo.

10. Cierre la ventana de la aplicación para detener la depuración.

11. En la barra de menús, elija Depurar>Deshabilitar todos los puntos de

interrupción.

Compilar una versión de lanzamiento

Ahora que comprobó que todo funciona, puede preparar una versión de lanzamiento de
la aplicación.

1. Seleccione Compilar>Limpiar solución para eliminar los archivos intermedios y de

salida que se crearon durante las compilaciones anteriores.
 2. Cambie la configuración de compilación de HelloWPFApp de Depurar a Liberar
mediante el control de lista desplegable en la barra de herramientas.

3. Seleccione Compilar>Compilar solución.

Enhorabuena por completar este tutorial. Puede encontrar el .exe creado en el directorio
de soluciones y proyectos ( ...\HelloWPFApp\HelloWPFApp\bin\Release).

Pasos siguientes
Avance al artículo siguiente para aprender a crear una aplicación de Windows Forms en
Visual Studio con Visual Basic.

Crear una aplicación de Windows Forms

Vea también
Para más información sobre Visual Studio, consulte estos recursos:

Novedades de Visual Studio 2022

Sugerencias de productividad
Introducción a la programación web de
ASP.NET mediante la sintaxis Razor
(Visual Basic)
Artículo • 23/09/2022 • Tiempo de lectura: 38 minutos

por Tom FitzMacken

En este artículo se proporciona información general sobre la programación con

ASP.NET Web Pages mediante la sintaxis de Razor y Visual Basic. ASP.NET es la
tecnología de Microsoft para ejecutar páginas web dinámicas en servidores web.

Lo que aprenderá:

Las 8 mejores sugerencias de programación para empezar a programar

ASP.NET Web Pages mediante la sintaxis de Razor.
Conceptos básicos de programación que necesitará.
Qué ASP.NET código de servidor y la sintaxis de Razor se trata.

Versiones de software
ASP.NET Web Pages (Razor) 3

Este tutorial también funciona con ASP.NET Web Pages 2.

La mayoría de los ejemplos de uso de ASP.NET Web Pages con la sintaxis de Razor usan
C#. Pero la sintaxis de Razor también admite Visual Basic. Para programar una página
web de ASP.NET en Visual Basic, cree una página web con una extensión de nombre de
archivo .vbhtml y agregue código de Visual Basic. En este artículo se proporciona
información general sobre cómo trabajar con el lenguaje y la sintaxis de Visual Basic
para crear ASP.NET páginas web.

７ Nota

Las plantillas de sitio web predeterminadas para Microsoft WebMatrix (Bakery,

Photo Gallery y Starter Site, etc.) están disponibles en las versiones de C# y Visual
Basic. Puede instalar las plantillas de Visual Basic como paquetes NuGet. Las
plantillas de sitio web se instalan en la carpeta raíz del sitio en una carpeta
denominada Plantillas de Microsoft.
Sugerencias de programación principales 8
En esta sección se enumeran algunas sugerencias que es absolutamente necesario saber
a medida que empieza a escribir ASP.NET código de servidor mediante la sintaxis de
Razor.

1. Agrega código a una página con el carácter @

El @ carácter inicia expresiones insertadas, bloques de instrucción única y bloques de
varias instrucciones:

vbhtml

<!-- Single statement blocks -->

@Code Dim total = 7 End Code
@Code Dim myMessage = "Hello World" End Code

<!-- Inline expressions -->

<p>The value of your account is: @total </p>
<p>The value of myMessage is: @myMessage</p>

<!-- Multi-statement block -->

@Code
Dim greeting = "Welcome to our site!"
Dim weekDay = DateTime.Now.DayOfWeek
Dim greetingMessage = greeting & " Today is: " & weekDay.ToString()
End Code
<p>The greeting is: @greetingMessage</p>

Resultado que se muestra en un explorador:

 Sugerencia

Codificación HTML
 Al mostrar contenido en una página con el @ carácter , como en los ejemplos
anteriores, ASP.NET codifica la salida. Esto reemplaza los caracteres HTML
reservados (como < y > ) & por códigos que permiten que los caracteres se
muestren como caracteres en una página web en lugar de interpretarse como
etiquetas HTML o entidades. Sin codificación HTML, es posible que la salida del
código del servidor no se muestre correctamente y podría exponer una página a
riesgos de seguridad.

Si su objetivo es generar marcado HTML que represente etiquetas como marcado

(por ejemplo <p></p> , para un párrafo o <em></em> para resaltar texto), consulte la
sección Combinación de texto, marcado y código en bloques de código más
adelante en este artículo.

Puede obtener más información sobre la codificación HTML en Trabajar con

formularios HTML en sitios de ASP.NET Web Pages .

2. Incluya bloques de código con Código... Código final

Un bloque de código incluye una o varias instrucciones de código y se incluye con las
palabras clave Code y End Code . Coloque la palabra clave de apertura Code
inmediatamente después del @ carácter ; no puede haber espacios en blanco entre
ellos.

vbhtml

<!-- Single statement block. -->

@Code
Dim theMonth = DateTime.Now.Month
End Code
<p>The numeric value of the current month: @theMonth</p>

<!-- Multi-statement block. -->

@Code
Dim outsideTemp = 79
Dim weatherMessage = "Hello, it is " & outsideTemp & " degrees."
End Code
<p>Today's weather: @weatherMessage</p>

Resultado que se muestra en un explorador:

3. Dentro de un bloque, finaliza cada instrucción de
código con un salto de línea
En un bloque de código de Visual Basic, cada instrucción termina con un salto de línea.
(Más adelante en el artículo verá una manera de encapsular una instrucción de código
larga en varias líneas si es necesario).

vbhtml

<!-- Single statement block. -->

@Code
Dim theMonth = DateTime.Now.Month
End Code

<!-- Multi-statement block. -->

@Code
Dim outsideTemp = 79
Dim weatherMessage = "Hello, it is " & outsideTemp & " degrees."
End Code

<!-- An inline expression, so no line break needed. -->

<p>Today's weather: @weatherMessage</p>

4. Las variables se usan para almacenar valores

Puede almacenar valores en una variable, incluidas cadenas, números y fechas, etc. Cree
una variable con la Dim palabra clave . Puede insertar valores de variable directamente
en una página mediante @ .

vbhtml

<!-- Storing a string -->

@Code
Dim welcomeMessage = "Welcome, new members!"
End Code
<p>@welcomeMessage</p>
 <!-- Storing a date -->
@Code
Dim year = DateTime.Now.Year
End Code

<!-- Displaying a variable -->

<p>Welcome to our new members who joined in @year!</p>

Resultado que se muestra en un explorador:

5. Incluya valores de cadena literal entre comillas dobles.

Una cadena es una secuencia de caracteres que se tratan como texto. Para especificar
una cadena, debe incluirla entre comillas dobles:

vbhtml

@Code
Dim myString = "This is a string literal"
End Code

Para insertar comillas dobles dentro de un valor de cadena, inserte dos caracteres de
comillas dobles. Si desea que el carácter de comilla doble aparezca una vez en la salida
de la página, escríbalo como "" dentro de la cadena entre comillas y, si desea que
aparezca dos veces, escríbalo como """" dentro de la cadena entre comillas.

vbhtml

<!-- Embedding double quotation marks in a string -->

@Code
Dim myQuote = "The person said: ""Hello, today is Monday."""
End Code
<p>@myQuote</p>

Resultado que se muestra en un explorador:

6. El código de Visual Basic no distingue mayúsculas de
minúsculas
El lenguaje visual Basic no distingue mayúsculas de minúsculas. Las palabras clave de
programación (como Dim , If y True ) y los nombres de variable (como myString , o
subTotal ) se pueden escribir en cualquier caso.

Las siguientes líneas de código asignan un valor a la variable lastname mediante un

nombre en minúsculas y, a continuación, generan el valor de la variable en la página con
un nombre en mayúsculas.

vbhtml

@Code
Dim lastName = "Smith"
' Keywords like dim are also not case sensitive.
DIM someNumber = 7
End Code
<p>The value of the <code>lastName</code> variable is: @LASTNAME</p>

Resultado que se muestra en un explorador:

7. Gran parte de la codificación implica trabajar con

objetos
Un objeto representa una cosa con la que se puede programar: una página, un cuadro
de texto, un archivo, una imagen, una solicitud web, un mensaje de correo electrónico,
un registro de cliente (fila de base de datos), etc. Los objetos tienen propiedades que
describen sus características: un objeto de cuadro de texto tiene una Text propiedad,
un objeto request tiene una Url propiedad, un mensaje de correo electrónico tiene una
From propiedad y un objeto customer tiene una FirstName propiedad . Los objetos

también tienen métodos que son los "verbos" que pueden realizar. Algunos ejemplos
incluyen el método de Save un objeto de archivo, el método de Rotate un objeto de
imagen y el método de un objeto de Send correo electrónico.

A menudo trabajará con el Request objeto , que le proporciona información como los
valores de los campos de formulario en la página (cuadros de texto, etc.), qué tipo de
explorador realizó la solicitud, la dirección URL de la página, la identidad del usuario,
etc. En este ejemplo se muestra cómo obtener acceso a las propiedades del Request
objeto y cómo llamar al MapPath método del Request objeto , que proporciona la ruta
de acceso absoluta de la página en el servidor:

HTML

<table border="1">
<tr>
<td>Requested URL</td>
<td>Relative Path</td>
<td>Full Path</td>
<td>HTTP Request Type</td>
</tr>
<tr>
<td>@Request.Url</td>
<td>@Request.FilePath</td>
<td>@Request.MapPath(Request.FilePath)</td>
<td>@Request.RequestType</td>
</tr>
</table>

Resultado que se muestra en un explorador:

8. Puede escribir código que tome decisiones

Una característica clave de las páginas web dinámicas es que puede determinar qué
hacer en función de las condiciones. La forma más común de hacerlo es con la If
instrucción (y la instrucción opcional Else ).

vbhtml

@Code
Dim result = ""
If IsPost Then
result = "This page was posted using the Submit button."
Else
result = "This was the first request for this page."
End If
End Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Write Code that Makes Decisions</title>
</head>
<body>

<form method="POST" action="" >

<input type="Submit" name="Submit" value="Submit"/>
<p>@result</p>
</form>

</body>
</html>

La instrucción If IsPost es una forma abreviada de escribir If IsPost = True . Junto

con If las instrucciones , hay varias maneras de probar condiciones, repetir bloques de
código, etc., que se describen más adelante en este artículo.

Resultado que se muestra en un explorador (después de hacer clic en Enviar):

 Sugerencia

Métodos HTTP GET y POST y la propiedad IsPost

 El protocolo usado para páginas web (HTTP) admite un número muy limitado de
métodos ("verbos") que se usan para realizar solicitudes al servidor. Los dos más
comunes son GET, que se usa para leer una página y POST, que se usa para enviar
una página. En general, la primera vez que un usuario solicita una página, la página
se solicita mediante GET. Si el usuario rellena un formulario y, a continuación, hace
clic en Enviar, el explorador realiza una solicitud POST al servidor.

En la programación web, a menudo resulta útil saber si se solicita una página como
GET o como POST para que sepa cómo procesar la página. En ASP.NET Web Pages,
puede usar la IsPost propiedad para ver si una solicitud es GET o POST. Si la
solicitud es post, la IsPost propiedad devolverá true y puede hacer cosas como
leer los valores de los cuadros de texto de un formulario. Muchos ejemplos que
verá muestran cómo procesar la página de forma diferente en función del valor de
IsPost .

Ejemplo de código simple

En este procedimiento se muestra cómo crear una página que muestre técnicas de
programación básicas. En el ejemplo, se crea una página que permite a los usuarios
escribir dos números y, a continuación, los agrega y muestra el resultado.

1. En el editor, cree un nuevo archivo y asígnele el nombre AddNumbers.vbhtml.

2. Copie el código y el marcado siguientes en la página, reemplazando todo lo que

ya esté en la página.

vbhtml

@Code
Dim total = 0
Dim totalMessage = ""
if IsPost Then
' Retrieve the numbers that the user entered.
Dim num1 = Request("text1")
Dim num2 = Request("text2")
' Convert the entered strings into integers numbers and add.
total = num1.AsInt() + num2.AsInt()
totalMessage = "Total = " & total
End If
End Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Adding Numbers</title>
<style type="text/css">
 body {background-color: beige; font-family: Verdana, Ariel;
margin: 50px;
}
form {padding: 10px; border-style: solid; width: 250px;}
</style>
</head>
<body>
<p>Enter two whole numbers and click <strong>Add</strong> to
display the result.</p>
<p></p>
<form action="" method="post">
<p><label for="text1">First Number:</label>
<input type="text" name="text1" />
</p>
<p><label for="text2">Second Number:</label>
<input type="text" name="text2" />
</p>
<p><input type="submit" value="Add" /></p>
</form>
<p>@totalMessage</p>
</body>
</html>

Estas son algunas cosas que debe tener en cuenta:

El @ carácter inicia el primer bloque de código de la página y precede a la

totalMessage variable incrustada cerca de la parte inferior.
El bloque situado en la parte superior de la página se incluye en Code...End
Code .

Las variables total , num1 , num2 y totalMessage almacenan varios números y

una cadena.
El valor de cadena literal asignado a la totalMessage variable está entre
comillas dobles.
Dado que el código de Visual Basic no distingue mayúsculas de minúsculas,
cuando la totalMessage variable se usa cerca de la parte inferior de la página,
su nombre solo debe coincidir con la ortografía de la declaración de variable
en la parte superior de la página. El uso de mayúsculas y minúsculas no
importa.
La expresión num1.AsInt() + num2.AsInt() muestra cómo trabajar con
objetos y métodos. El AsInt método de cada variable convierte la cadena
especificada por un usuario en un número entero (un entero) que se puede
agregar.
La <form> etiqueta incluye un method="post" atributo . Esto especifica que
cuando el usuario haga clic en Agregar, la página se enviará al servidor
mediante el método HTTP POST. Cuando se envía la página, el código If
 IsPost se evalúa como true y el código condicional se ejecuta, mostrando el

resultado de agregar los números.

3. Guarde la página y ejecútela en un explorador. (Asegúrese de que la página está

seleccionada en el área de trabajo Archivos antes de ejecutarla). Escriba dos
números enteros y, a continuación, haga clic en el botón Agregar .

Lenguaje y sintaxis de Visual Basic

Anteriormente vio un ejemplo básico de cómo crear una página web de ASP.NET y
cómo puede agregar código de servidor al marcado HTML. Aquí aprenderá los
conceptos básicos del uso de Visual Basic para escribir ASP.NET código de servidor
mediante la sintaxis de Razor, es decir, las reglas del lenguaje de programación.

Si tiene experiencia con la programación (especialmente si ha usado C, C++, C#, Visual

Basic o JavaScript), gran parte de lo que ha leído aquí será familiar. Probablemente deba
familiarizarse solo con cómo se agrega código WebMatrix al marcado en archivos
.vbhtml .

Combinación de texto, marcado y código en bloques de

código
En bloques de código de servidor, a menudo querrá generar texto y marcado en la
página. Si un bloque de código de servidor contiene texto que no es código y que, en
su lugar, se debe representar tal como está, ASP.NET debe poder distinguir ese texto del
código. Hay varias maneras de hacerlo.

Incluya el texto en un elemento de bloque HTML como <p></p> o <em></em> :

vbhtml

@If IsPost Then

' This line has all content between matched <p> tags.
@<p>Hello, the time is @DateTime.Now and this page is a postback!
</p>
Else
' All content between matched tags, followed by server code.
@<p>Hello, <em>Stranger!</em> today is: </p> @DateTime.Now
End If

El elemento HTML puede incluir texto, elementos HTML adicionales y expresiones

de código de servidor. Cuando ASP.NET ve la etiqueta HTML de apertura (por
ejemplo, <p> ), representa todo el elemento y su contenido tal cual en el
explorador (y resuelve las expresiones de código de servidor).

Use el @: operador o el <text> elemento . Genera @: una sola línea de contenido

que contiene texto sin formato o etiquetas HTML no coincidentes; el <text>
elemento incluye varias líneas que se van a generar. Estas opciones son útiles
cuando no desea representar un elemento HTML como parte de la salida.

vbhtml

@If IsPost Then

' Plain text followed by an unmatched HTML tag and server code.
@:The time is: <br /> @DateTime.Now
' Server code and then plain text, matched tags, and more text.
@DateTime.Now @:is the <em>current</em> time.
End If

En el ejemplo siguiente se repite el ejemplo anterior, pero se usa un único par de

<text> etiquetas para incluir el texto que se va a representar.

vbhtml

@If IsPost Then

@<text>
The time is: <br /> @DateTime.Now
@DateTime.Now is the <em>current</em> time.
</text>
End If
 En el ejemplo siguiente, las <text> etiquetas y </text> incluyen tres líneas, todas
las cuales tienen algunas etiquetas HTML sin incluir y etiquetas HTML no
coincidentes ( <br /> ), junto con el código de servidor y las etiquetas HTML
coincidentes. De nuevo, también puede preceder cada línea individualmente con el
@: operador ; cualquier forma funciona.

vbhtml

@Code
dim minTemp = 75
@<text>It is the month of @DateTime.Now.ToString("MMMM"), and
it's a <em>great</em> day! <p>You can go swimming if it's at
least @minTemp degrees.</p></text>
End Code

７ Nota

Cuando se genera texto como se muestra en esta sección , mediante un

elemento HTML, el @: operador o el <text> elemento , ASP.NET no codifica
la salida en HTML. (Como se indicó anteriormente, ASP.NET codifica la salida
de expresiones de código de servidor y bloques de código de servidor
precedidos por @ , excepto en los casos especiales indicados en esta sección).

Espacio en blanco
Los espacios adicionales de una instrucción (y fuera de un literal de cadena) no afectan a
la instrucción :

vbhtml

@Code Dim personName = "Smith" End Code

Dividir instrucciones largas en varias líneas

Puede dividir una instrucción de código larga en varias líneas mediante el carácter de
subrayado _ (que en Visual Basic se denomina carácter de continuación) después de
cada línea de código. Para interrumpir una instrucción en la línea siguiente, al final de la
línea, agregue un espacio y, a continuación, el carácter de continuación. Continúe la
instrucción en la línea siguiente. Puede encapsular instrucciones en tantas líneas como
necesite para mejorar la legibilidad. Las siguientes instrucciones son iguales:
 vbhtml

@Code
Dim familyName _
= "Smith"
End Code

@Code
Dim _
theName _
= _
"Smith"
End Code

Sin embargo, no se puede encapsular una línea en medio de un literal de cadena. El

ejemplo siguiente no funciona:

vbhtml

@Code
' Doesn't work.
Dim test = "This is a long _
string"
End Code

Para combinar una cadena larga que se ajuste a varias líneas como el código anterior,
deberá usar el operador de concatenación ( & ), que verá más adelante en este artículo.

Comentarios de código
Los comentarios le permiten dejar notas para usted u otros usuarios. Los comentarios
de sintaxis de Razor tienen el prefijo @* y terminan con *@ .

CSHTML

@* A single-line comment is added like this example. *@

@*
This is a multiline code comment.
It can continue for any number of lines.
*@

Dentro de los bloques de código, puede usar los comentarios de sintaxis de Razor o
puede usar el carácter de comentario normal de Visual Basic, que es una comilla simple
( ' ) prefijo a cada línea.
 vbhtml

@Code
' You can make comments in blocks by just using ' before each line.
End Code

@Code
' There is no multi-line comment character in Visual Basic.
' You use a ' before each line you want to comment.
End Code

variables
Una variable es un objeto con nombre que se usa para almacenar datos. Puede asignar
un nombre a las variables, pero el nombre debe comenzar con un carácter alfabético y
no puede contener espacios en blanco ni caracteres reservados. En Visual Basic, como
ha visto anteriormente, no importa el caso de las letras de un nombre de variable.

Variables y tipos de datos

Una variable puede tener un tipo de datos específico, que indica qué tipo de datos se
almacenan en la variable. Puede tener variables de cadena que almacenen valores de
cadena (como "Hola mundo"), variables enteras que almacenen valores enteros (como 3
o 79) y variables de fecha que almacenen valores de fecha en diversos formatos (como
12/4/2012 o marzo de 2009). Y hay muchos otros tipos de datos que puede usar.

Sin embargo, no es necesario especificar un tipo para una variable. En la mayoría de los
casos, ASP.NET pueden averiguar el tipo en función de cómo se usan los datos de la
variable. (En ocasiones, debe especificar un tipo; verá ejemplos en los que esto es true).

Para declarar una variable sin especificar un tipo, use Dim más el nombre de la variable
(por ejemplo, Dim myVar ). Para declarar una variable con un tipo, use Dim más el
nombre de la variable, seguido de As y, a continuación, el nombre de tipo (por ejemplo,
Dim myVar As String ).

vbhtml

@Code
' Assigning a string to a variable.
Dim greeting = "Welcome"

' Assigning a number to a variable.

Dim theCount = 3

' Assigning an expression to a variable.

 Dim monthlyTotal = theCount + 5

' Assigning a date value to a variable.

Dim today = DateTime.Today

' Assigning the current page's URL to a variable.

Dim myPath = Request.Url

' Declaring variables using explicit data types.

Dim name as String = "Joe"
Dim count as Integer = 5
Dim tomorrow as DateTime = DateTime.Now.AddDays(1)
End Code

En el ejemplo siguiente se muestran algunas expresiones insertadas que usan las

variables de una página web.

vbhtml

@Code
' Embedding the value of a variable into HTML markup.
' Precede the markup with @ because we are in a code block.
@<p>@greeting, friends!</p>
End Code

<!-- Using a variable with an inline expression in HTML. -->

<p>The predicted annual total is: @( monthlyTotal * 12)</p>

<!-- Displaying the page URL with a variable. -->

<p>The URL to this page is: @myPath</p>

Resultado mostrado en un explorador:

Conversión y prueba de tipos de datos

Aunque ASP.NET normalmente puede determinar automáticamente un tipo de datos, a
veces no puede hacerlo. Por lo tanto, es posible que tenga que ayudar a ASP.NET
realizar una conversión explícita. Incluso si no tiene que convertir tipos, a veces resulta
útil probar para ver con qué tipo de datos podría estar trabajando.
El caso más común es que tiene que convertir una cadena a otro tipo, como un entero o
una fecha. En el ejemplo siguiente se muestra un caso típico en el que debe convertir
una cadena en un número.

vbhtml

@Code
Dim total = 0
Dim totalMessage = ""
if IsPost Then
' Retrieve the numbers that the user entered.
Dim num1 = Request("text1")
Dim num2 = Request("text2")
' Convert the entered strings into integers numbers and add.
total = num1.AsInt() + num2.AsInt()
totalMessage = "Total = " & total
End If
End Code

Como regla, la entrada del usuario le llega como cadenas. Incluso si ha pedido al
usuario que escriba un número e incluso si ha escrito un dígito, cuando se envía la
entrada del usuario y lo lee en el código, los datos están en formato de cadena. Por lo
tanto, debe convertir la cadena en un número. En el ejemplo, si intenta realizar la
aritmética en los valores sin convertirlos, se produce el siguiente error, porque ASP.NET
no puede agregar dos cadenas:

Cannot implicitly convert type 'string' to 'int'.

Para convertir los valores en enteros, llame al AsInt método . Si la conversión se realiza
correctamente, puede agregar los números.

En la tabla siguiente se enumeran algunos métodos comunes de conversión y prueba

para variables.

Método

Descripción

Ejemplo

AsInt(), IsInt()

Convierte una cadena que representa un número entero (como "593") en un entero.
VB
 Dim myIntNumber = 0
Dim myStringNum = "539"
If myStringNum.IsInt() Then
myIntNumber = myStringNum.AsInt()
End If

AsBool(), IsBool()

Convierte una cadena como "true" o "false" en un tipo booleano.

VB

Dim myStringBool = "True"

Dim myVar = myStringBool.AsBool()

AsFloat(), IsFloat()

Convierte una cadena que tiene un valor decimal como "1,3" o "7,439" en un número de
punto flotante.
VB

Dim myStringFloat = "41.432895"

Dim myFloatNum = myStringFloat.AsFloat()

AsDecimal(), IsDecimal()

Convierte una cadena que tiene un valor decimal como "1,3" o "7,439" en un número
decimal. (En ASP.NET, un número decimal es más preciso que un número de punto
flotante).
VB

Dim myStringDec = "10317.425"

Dim myDecNum = myStringDec.AsDecimal()

AsDateTime(), IsDateTime()

Convierte una cadena que representa un valor de fecha y hora en el tipo ASP.NET
DateTime .

VB

Dim myDateString = "12/27/2012"

Dim newDate = myDateString.AsDateTime()
ToString()

Convierte cualquier otro tipo de datos en una cadena.

VB

Dim num1 As Integer = 17

Dim num2 As Integer = 76

' myString is set to 1776

Dim myString as String = num1.ToString() & _
num2.ToString()

Operadores
Un operador es una palabra clave o un carácter que indica ASP.NET qué tipo de
comando realizar en una expresión. Visual Basic admite muchos operadores, pero solo
tiene que reconocer algunos para empezar a desarrollar ASP.NET páginas web. En la
tabla siguiente se resumen los operadores más comunes.

Operador

Descripción

Ejemplos

+ - * /

Operadores matemáticos usados en expresiones numéricas.

VB

@(5 + 13)

Dim netWorth = 150000

Dim newTotal = netWorth * 2
@(newTotal / 2)

Asignación e igualdad. En función del contexto, asigna el valor en el lado derecho de

una instrucción al objeto del lado izquierdo o comprueba los valores de igualdad.
VB

Dim age = 17
 Dim income = Request("AnnualIncome")

<>

Desigualdad. Devuelve True si los valores no son iguales.

VB

Dim theNum = 13
If theNum <> 15 Then
' Do something.
End If

< > <= >=

Menor que, mayor que, menor o igual que y mayor o igual.

VB

If 2 < 3 Then
' Do something.
End If

Dim currentCount = 12
If currentCount >= 12 Then
' Do something.
End If

&

Concatenación, que se usa para combinar cadenas.

vbhtml

' The displayed result is "abcdef".

@("abc" & "def")

+= -=

Operadores de incremento y decremento, que agregan y restan 1 (respectivamente) de

una variable.
VB

Dim theCount As Integer = 0

theCount += 1 ' Adds 1 to count
.

Punto. Se usa para distinguir objetos y sus propiedades y métodos.

VB

Dim myUrl = Request.Url

Dim count = Request("Count").AsInt()

()

Paréntesis. Se usa para agrupar expresiones, para pasar parámetros a métodos y para
acceder a los miembros de matrices y colecciones.
vbhtml

@(3 + 7)

@Request.MapPath(Request.FilePath)

Not

No. Invierte un valor true en false y viceversa. Normalmente se usa como forma
abreviada de probar False para (es decir, para no True ).
VB

Dim taskCompleted As Boolean = False

' Processing.
If Not taskCompleted Then
' Continue processing
End If

AndAlso OrElse

AND lógico y OR, que se usan para vincular condiciones juntas.

VB

Dim myTaskCompleted As Boolean = false

Dim totalCount As Integer = 0
' Processing.
If (Not myTaskCompleted) AndAlso _
totalCount < 12 Then
' Continue processing.
End If
Trabajar con rutas de acceso de archivos y
carpetas en el código
A menudo trabajará con rutas de acceso de archivos y carpetas en el código. Este es un
ejemplo de estructura de carpetas físicas para un sitio web, ya que podría aparecer en el
equipo de desarrollo:

C:\WebSites\MyWebSite default.cshtml datafile.txt \images Logo.jpg \styles

Styles.css

Estos son algunos detalles esenciales sobre las direcciones URL y las rutas de acceso:

Una dirección URL comienza con un nombre de dominio ( http://www.example.com )

o un nombre de servidor ( http://localhost , http://mycomputer ).
Una dirección URL corresponde a una ruta de acceso física en un equipo host. Por
ejemplo, http://myserver podría corresponder a la carpeta C:\websites\mywebsite
en el servidor.
Una ruta de acceso virtual es abreviada para representar rutas de acceso en el
código sin tener que especificar la ruta de acceso completa. Incluye la parte de una
dirección URL que sigue el nombre de dominio o servidor. Al usar rutas de acceso
virtuales, puede mover el código a un dominio o servidor diferente sin tener que
actualizar las rutas de acceso.

Este es un ejemplo para ayudarle a comprender las diferencias:

Dirección URL completa http://mycompanyserver/humanresources/CompanyPolicy.htm

Nombre de servidor mycompanyserver

Ruta de acceso virtual /humanresources/CompanyPolicy.htm

Ruta de acceso física C:\mywebsites\humanresources\CompanyPolicy.htm

La raíz virtual es /, al igual que la raíz de la unidad C: es . (Las rutas de acceso de carpeta
virtual siempre usan barras diagonales). La ruta de acceso virtual de una carpeta no
tiene que tener el mismo nombre que la carpeta física; puede ser un alias. (En los
servidores de producción, la ruta de acceso virtual rara vez coincide con una ruta de
acceso física exacta).

Cuando se trabaja con archivos y carpetas en el código, a veces es necesario hacer

referencia a la ruta de acceso física y, a veces, una ruta de acceso virtual, en función de
los objetos con los que se trabaja. ASP.NET proporciona estas herramientas para
trabajar con rutas de acceso de archivos y carpetas en el código: el Server.MapPath
método y el operador y Href el ~ método .

Conversión de rutas de acceso virtuales a físicas: el

método Server.MapPath
El Server.MapPath método convierte una ruta de acceso virtual (como /default.cshtml)
en una ruta de acceso física absoluta (como
C:\WebSites\MyWebSiteFolder\default.cshtml). Use este método cada vez que necesite
una ruta de acceso física completa. Un ejemplo típico es cuando está leyendo o
escribiendo un archivo de texto o un archivo de imagen en el servidor web.

Normalmente, no conoce la ruta de acceso física absoluta del sitio en el servidor de un

sitio de hospedaje, por lo que este método puede convertir la ruta de acceso que
conoce (la ruta de acceso virtual) a la ruta de acceso correspondiente en el servidor. La
ruta de acceso virtual se pasa a un archivo o carpeta al método y devuelve la ruta de
acceso física:

vbhtml

@Code
Dim dataFilePath = "~/dataFile.txt"
End Code

<!-- Displays a physical path C:\Websites\MyWebSite\datafile.txt -->

<p>@Server.MapPath(dataFilePath)</p>

Referencia a la raíz virtual: el operador ~ y el método

Href
En un archivo .cshtml o .vbhtml , puede hacer referencia a la ruta de acceso raíz virtual
mediante el ~ operador . Esto es muy útil porque puede mover páginas alrededor de un
sitio, y los vínculos que contienen a otras páginas no se romperán. También es útil en
caso de que alguna vez mueva su sitio web a una ubicación diferente. Estos son algunos
ejemplos:

vbhtml

@Code
Dim myImagesFolder = "~/images"
Dim myStyleSheet = "~/styles/StyleSheet.css"
End Code
Si el sitio web es http://myserver/myapp , aquí se muestra cómo ASP.NET tratará estas
rutas de acceso cuando se ejecute la página:

myImagesFolder : http://myserver/myapp/images

myStyleSheet : http://myserver/myapp/styles/Stylesheet.css

(En realidad no verá estas rutas de acceso como los valores de la variable, pero ASP.NET
tratará las rutas de acceso como si fuera lo que eran).

Puede usar el operador en el ~ código de servidor (como se indicó anteriormente) y en

el marcado, de la siguiente manera:

HTML

<!-- Examples of using the ~ operator in markup in ASP.NET Web Pages -->

<a href="~/Default">Home</a>
<img src="~/images/MyImages.png" />

En el marcado, se usa el ~ operador para crear rutas de acceso a recursos como

archivos de imagen, otras páginas web y archivos CSS. Cuando se ejecuta la página,
ASP.NET examina la página (código y marcado) y resuelve todas las ~ referencias a la
ruta de acceso adecuada.

Lógica condicional y bucles

ASP.NET código de servidor permite realizar tareas basadas en condiciones y escribir
código que repite instrucciones un número específico de veces, código que ejecuta un
bucle).

Condiciones de prueba
Para probar una condición simple, use la If...Then instrucción , que devuelve True o
False en función de una prueba que especifique:

vbhtml

@Code
Dim showToday = True
If showToday Then
DateTime.Today
End If
End Code
La If palabra clave inicia un bloque. La prueba real (condición) sigue la If palabra
clave y devuelve true o false. La If instrucción finaliza con Then . Las instrucciones que
se ejecutarán si la prueba es verdadera se incluyen entre If y End If . Una If
instrucción puede incluir un Else bloque que especifique las instrucciones que se van a
ejecutar si la condición es falsa:

vbhtml

@Code
Dim showToday = False
If showToday Then
DateTime.Today
Else
@<text>Sorry!</text>
End If
End Code

Si una If instrucción inicia un bloque de código, no es necesario usar las instrucciones

normales Code...End Code para incluir los bloques. Solo puede agregar @ al bloque y
funcionará. Este enfoque funciona con , así como con If otras palabras clave de
programación de Visual Basic seguidas de bloques de código, como For , For Each , Do
While , etc.

vbhtml

@If showToday Then

DateTime.Today
Else
@<text>Sorry!</text>
End If

Puede agregar varias condiciones mediante uno o varios ElseIf bloques:

vbhtml

@Code
Dim theBalance = 4.99
If theBalance = 0 Then
@<p>You have a zero balance.</p>
ElseIf theBalance > 0 AndAlso theBalance <= 5 Then
' If the balance is above 0 but less than
' or equal to $5, display this message.
@<p>Your balance of $@theBalance is very low.</p>
Else
' For balances greater than $5, display balance.
@<p>Your balance is: $@theBalance</p>
 End If
End Code

En este ejemplo, si la primera condición del If bloque no es true, se comprueba la

ElseIf condición. Si se cumple esa condición, se ejecutan las instrucciones del ElseIf
bloque . Si no se cumple ninguna de las condiciones, se ejecutan las instrucciones del
Else bloque . Puede agregar cualquier número de ElseIf bloques y, a continuación,
cerrar con un Else bloque como condición "todo lo demás".

Para probar un gran número de condiciones, use un Select Case bloque :

vbhtml

@Code
Dim weekday = "Wednesday"
Dim greeting = ""

Select Case weekday

Case "Monday"
greeting = "Ok, it's a marvelous Monday."
Case "Tuesday"
greeting = "It's a tremendous Tuesday."
Case "Wednesday"
greeting = "Wild Wednesday is here!"
Case Else
greeting = "It's some other day, oh well."
End Select
End Code
<p>Since it is @weekday, the message for today is: @greeting</p>

El valor que se va a probar está entre paréntesis (en el ejemplo, la variable weekday).
Cada prueba individual usa una Case instrucción que enumera un valor. Si el valor de
una Case instrucción coincide con el valor de prueba, se ejecuta el código de ese Case
bloque.

Resultado de los dos últimos bloques condicionales mostrados en un explorador:

Código de bucle
A menudo, debe ejecutar las mismas instrucciones repetidamente. Para ello, haga un
bucle. Por ejemplo, a menudo se ejecutan las mismas instrucciones para cada elemento
de una colección de datos. Si sabe exactamente cuántas veces desea bucle, puede usar
un For bucle . Este tipo de bucle es especialmente útil para contar o contar hacia abajo:

vbhtml

@For i = 10 To 20
@<p>Item #: @i</p>
Next i

El bucle comienza con la For palabra clave , seguido de tres elementos:

Inmediatamente después de la For instrucción , se declara una variable de

contador (no es necesario usar Dim ) y, a continuación, se indica el intervalo, como
en i = 10 to 20 . Esto significa que la variable i comenzará a contar en 10 y
continuará hasta que alcance 20 (inclusive).
Entre las instrucciones For y Next es el contenido del bloque . Esto puede
contener una o varias instrucciones de código que se ejecutan con cada bucle.
La Next i instrucción finaliza el bucle. Incrementa el contador e inicia la siguiente
iteración del bucle.

La línea de código entre las For líneas y Next contiene el código que se ejecuta para
cada iteración del bucle. El marcado crea un nuevo párrafo ( <p> elemento) cada vez y
agrega una línea a la salida, mostrando el valor de i (el contador). Al ejecutar esta
página, el ejemplo crea 11 líneas que muestran la salida, con el texto de cada línea que
indica el número de elemento.
Si está trabajando con una colección o matriz, a menudo usa un For Each bucle . Una
colección es un grupo de objetos similares y el For Each bucle permite llevar a cabo una
tarea en cada elemento de la colección. Este tipo de bucle es cómodo para las
colecciones, ya que a diferencia de un For bucle, no es necesario incrementar el
contador ni establecer un límite. En su lugar, el código de For Each bucle simplemente
continúa a través de la colección hasta que haya terminado.

En este ejemplo se devuelven los elementos de la Request.ServerVariables colección

(que contiene información sobre el servidor web). Usa un For Each bucle para mostrar
el nombre de cada elemento mediante la creación de un nuevo <li> elemento en una
lista con viñetas HTML.

vbhtml

<ul>
@For Each myItem In Request.ServerVariables
@<li>@myItem</li>
Next myItem
</ul>

La For Each palabra clave va seguida de una variable que representa un único elemento
de la colección (en el ejemplo, myItem ), seguido de la In palabra clave , seguida de la
colección que desea recorrer en bucle. En el cuerpo del For Each bucle, puede acceder
al elemento actual mediante la variable que declaró anteriormente.

Para crear un bucle de uso general más, use la Do While instrucción :

vbhtml

@Code
Dim countNum = 0
Do While countNum < 50
countNum += 1
@<p>Line #@countNum: </p>
Loop
End Code

Este bucle comienza con la Do While palabra clave , seguida de una condición, seguida
del bloque que se va a repetir. Los bucles suelen incrementar (agregar a) o disminuir
(restar de) una variable o un objeto que se usa para contar. En el ejemplo, el +=
operador agrega 1 al valor de una variable cada vez que se ejecuta el bucle. (Para
disminuir una variable en un bucle que cuenta hacia abajo, usaría el operador -
= decremento ).

Objetos y colecciones
Casi todo lo que hay en un sitio web de ASP.NET es un objeto, incluida la propia página
web. En esta sección se describen algunos objetos importantes con los que trabajará
con frecuencia en el código.

Objetos page
El objeto más básico de ASP.NET es la página. Puede acceder a las propiedades del
objeto de página directamente sin ningún objeto calificador. El código siguiente obtiene
la ruta de acceso del archivo de la página mediante el Request objeto de la página:

vbhtml

@Code
Dim path = Request.FilePath
End Code

Puede usar propiedades del Page objeto para obtener una gran cantidad de
información, como:

Request . Como ya ha visto, se trata de una colección de información sobre la

solicitud actual, incluido el tipo de explorador que realizó la solicitud, la dirección
URL de la página, la identidad del usuario, etc.

Response . Se trata de una colección de información sobre la respuesta (página)

que se enviará al explorador cuando el código del servidor haya terminado de

ejecutarse. Por ejemplo, puede usar esta propiedad para escribir información en la
respuesta.

vbhtml

@Code
' Access the page's Request object to retrieve the URL.
Dim pageUrl = Request.Url
End Code
<a href="@pageUrl">My page</a>

Objetos de colección (matrices y diccionarios)

Una colección es un grupo de objetos del mismo tipo, como una colección de objetos
de una base de Customer datos. ASP.NET contiene muchas colecciones integradas,
como la Request.Files colección .
A menudo trabajará con datos en colecciones. Dos tipos de colección comunes son la
matriz y el diccionario. Una matriz es útil cuando desea almacenar una colección de
elementos similares, pero no desea crear una variable independiente para contener cada
elemento:

vbhtml

<h3>Team Members</h3>
@Code
Dim teamMembers() As String = {"Matt", "Joanne", "Robert", "Nancy"}
For Each name In teamMembers
@<p>@name</p>
Next name
End Code

Con las matrices, se declara un tipo de datos específico, como String , Integer o
DateTime . Para indicar que la variable puede contener una matriz, agregue paréntesis al
nombre de la variable en la declaración (como Dim myVar() As String ). Puede acceder a
los elementos de una matriz mediante su posición (índice) o mediante la For Each
instrucción . Los índices de matriz se basan en cero, es decir, el primer elemento está en
la posición 0, el segundo elemento está en la posición 1, etc.

vbhtml

@Code
Dim teamMembers() As String = {"Matt", "Joanne", "Robert", "Nancy"}
@<p>The number of names in the teamMembers array: @teamMembers.Length
</p>
@<p>Robert is now in position: @Array.IndexOf(teamMembers, "Robert")</p>
@<p>The array item at position 2 (zero-based) is @teamMembers(2)</p>
@<h3>Current order of team members in the list</h3>
For Each name In teamMembers
@<p>@name</p>
Next name
@<h3>Reversed order of team members in the list</h3>
Array.Reverse(teamMembers)
For Each reversedItem In teamMembers
@<p>@reversedItem</p>
Next reversedItem
End Code

Puede determinar el número de elementos de una matriz obteniendo su Length

propiedad . Para obtener la posición de un elemento específico en la matriz (es decir,
para buscar en la matriz), use el Array.IndexOf método . También puede hacer cosas
como invertir el contenido de una matriz (el Array.Reverse método) o ordenar el
contenido (el Array.Sort método ).
Salida del código de matriz de cadenas que se muestra en un explorador:

Un diccionario es una colección de pares clave-valor, donde se proporciona la clave (o

nombre) para establecer o recuperar el valor correspondiente:

vbhtml

@Code
Dim myScores = New Dictionary(Of String, Integer)()
myScores.Add("test1", 71)
myScores.Add("test2", 82)
myScores.Add("test3", 100)
myScores.Add("test4", 59)
End Code
<p>My score on test 3 is: @myScores("test3")%</p>
@Code
myScores("test4") = 79
End Code
<p>My corrected score on test 4 is: @myScores("test4")%</p>

Para crear un diccionario, use la New palabra clave para indicar que va a crear un nuevo
Dictionary objeto. Puede asignar un diccionario a una variable mediante la Dim palabra
clave . Los tipos de datos de los elementos del diccionario se indican mediante
paréntesis ( ( ) ). Al final de la declaración, debe agregar otro par de paréntesis, ya que
en realidad es un método que crea un nuevo diccionario.

Para agregar elementos al diccionario, puede llamar al Add método de la variable

dictionary ( myScores en este caso) y, a continuación, especificar una clave y un valor.
Como alternativa, puede usar paréntesis para indicar la clave y realizar una asignación
simple, como en el ejemplo siguiente:

vbhtml

@Code
myScores("test4") = 79
End Code

Para obtener un valor del diccionario, especifique la clave entre paréntesis:

vbhtml

@myScores("test4")

Llamar a métodos con parámetros

Como ha visto anteriormente en este artículo, los objetos que programa con tienen
métodos. Por ejemplo, un Database objeto podría tener un Database.Connect método .
Muchos métodos también tienen uno o varios parámetros. Un parámetro es un valor
que se pasa a un método para permitir que el método complete su tarea. Por ejemplo,
examine una declaración para el Request.MapPath método , que toma tres parámetros:

VB

Public Overridable Function MapPath (virtualPath As String, _

baseVirtualDir As String, _
allowCrossAppMapping As Boolean)

Este método devuelve la ruta de acceso física en el servidor que corresponde a una ruta
de acceso virtual especificada. Los tres parámetros del método son virtualPath ,
baseVirtualDir y allowCrossAppMapping . (Tenga en cuenta que, en la declaración, los
parámetros se enumeran con los tipos de datos de los datos que aceptarán). Al llamar a
este método, debe proporcionar valores para los tres parámetros.

Al usar Visual Basic con la sintaxis de Razor, tiene dos opciones para pasar parámetros a
un método: parámetros posicionales o parámetros con nombre. Para llamar a un método
mediante parámetros posicionales, se pasan los parámetros en un orden estricto
especificado en la declaración de método. (Normalmente, conocería este orden leyendo
la documentación del método). Debe seguir el orden y no se puede omitir ninguno de
los parámetros; si es necesario, se pasa una cadena vacía ( "" ) o null para un parámetro
posicional para el que no tiene un valor.

En el ejemplo siguiente se supone que tiene una carpeta denominada scripts en el sitio
web. El código llama al Request.MapPath método y pasa valores para los tres parámetros
en el orden correcto. A continuación, muestra la ruta de acceso asignada resultante.

vbhtml

@Code
' Pass parameters to a method using positional parameters.
Dim myPathPositional = Request.MapPath("/scripts", "/", true)
End Code
<p>@myPathPositional</p>

Cuando hay muchos parámetros para un método, puede mantener el código más limpio
y legible mediante parámetros con nombre. Para llamar a un método mediante
parámetros con nombre, especifique el nombre del parámetro seguido de := y, a
continuación, proporcione el valor . Una ventaja de los parámetros con nombre es que
puede agregarlos en cualquier orden que desee. (Una desventaja es que la llamada al
método no es tan compacta).

En el ejemplo siguiente se llama al mismo método que anteriormente, pero se usan

parámetros con nombre para proporcionar los valores:

vbhtml

@Code
' Pass parameters to a method using named parameters.
Dim myPathNamed = Request.MapPath(baseVirtualDir:= "/",
allowCrossAppMapping:= true, virtualPath:= "/scripts")
End Code
<p>@myPathNamed</p>

Como puede ver, los parámetros se pasan en un orden diferente. Sin embargo, si
ejecuta el ejemplo anterior y este ejemplo, devolverá el mismo valor.

Control de errores

instrucciones Try-Catch
A menudo tendrá instrucciones en el código que podrían producir errores por motivos
fuera del control. Por ejemplo:

Si el código intenta abrir, crear, leer o escribir un archivo, es posible que se

produzcan todos los tipos de errores. Es posible que el archivo que desee no
exista, podría estar bloqueado, es posible que el código no tenga permisos, etc.
Del mismo modo, si el código intenta actualizar los registros de una base de datos,
puede haber problemas de permisos, la conexión a la base de datos podría
quitarse, los datos que se guardarán podrían no ser válidos, etc.

En términos de programación, estas situaciones se denominan excepciones. Si el código

encuentra una excepción, genera (produce) un mensaje de error que es, en el mejor de
los casos, molesto para los usuarios.

En situaciones en las que el código puede encontrar excepciones y, para evitar mensajes
de error de este tipo, puede usar instrucciones Try/Catch . En la Try instrucción ,
ejecutará el código que está comprobando. En una o varias Catch instrucciones, puede
buscar errores específicos (tipos específicos de excepciones) que podrían haberse
producido. Puede incluir tantas Catch instrucciones como necesite para buscar errores
previstos.

７ Nota
 Se recomienda evitar el uso del Response.Redirect método en Try/Catch
instrucciones , ya que puede provocar una excepción en la página.

En el ejemplo siguiente se muestra una página que crea un archivo de texto en la

primera solicitud y, a continuación, muestra un botón que permite al usuario abrir el
archivo. En el ejemplo se usa deliberadamente un nombre de archivo incorrecto para
que cause una excepción. El código incluye Catch instrucciones para dos posibles
excepciones: FileNotFoundException , que se produce si el nombre de archivo es
incorrecto y DirectoryNotFoundException , que se produce si ASP.NET ni siquiera puede
encontrar la carpeta. (Puede quitar la marca de comentario de una instrucción en el
ejemplo para ver cómo se ejecuta cuando todo funciona correctamente).

Si el código no controló la excepción, verá una página de error como la captura de

pantalla anterior. Sin embargo, la Try/Catch sección ayuda a evitar que el usuario vea
estos tipos de errores.

vbhtml

@Code
Dim dataFilePath = "~/dataFile.txt"
Dim fileContents = ""
Dim physicalPath = Server.MapPath(dataFilePath)
Dim userMessage = "Hello world, the time is " + DateTime.Now
Dim userErrMsg = ""
Dim errMsg = ""

If IsPost Then
' When the user clicks the "Open File" button and posts
' the page, try to open the file.
Try
' This code fails because of faulty path to the file.
fileContents = File.ReadAllText("c:\batafile.txt")

' This code works. To eliminate error on page,

' comment the above line of code and uncomment this one.
' fileContents = File.ReadAllText(physicalPath)

Catch ex As FileNotFoundException
' You can use the exception object for debugging, logging, etc.
errMsg = ex.Message
' Create a friendly error message for users.
userErrMsg = "The file could not be opened, please contact " _
& "your system administrator."

Catch ex As DirectoryNotFoundException
' Similar to previous exception.
errMsg = ex.Message
userErrMsg = "The file could not be opened, please contact " _
& "your system administrator."
 End Try
Else
' The first time the page is requested, create the text file.
File.WriteAllText(physicalPath, userMessage)
End If
End Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Try-Catch Statements</title>
</head>
<body>
<form method="POST" action="" >
<input type="Submit" name="Submit" value="Open File"/>
</form>

<p>@fileContents</p>
<p>@userErrMsg</p>

</body>
</html>

Recursos adicionales

Documentación de referencia
ASP.NET
Visual Basic (lenguaje)
Tutorial: Creación de una aplicación de
WinForms con Visual Basic
Artículo • 10/04/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En este tutorial, creará una aplicación de Visual Basic que tendrá una interfaz de usuario
de Windows Forms. El entorno de desarrollo integrado (IDE) de Visual Studio incluye
toda las herramientas que necesita para crear una aplicación de Windows Forms.

En este tutorial, aprenderá a:

＂ Crear un proyecto
＂ Agregar un botón al formulario
＂ Agregar una etiqueta y un código
＂ Ejecución de la aplicación

Requisitos previos
Necesitará Visual Studio para completar este tutorial. Visite la página de descargas de
Visual Studio para obtener una versión gratuita.

Crear un proyecto
Cree un proyecto de aplicación de Visual Basic. En el tipo de proyecto se incluyen todos
los archivos de plantilla que vamos a necesitar, sin necesidad de agregar nada más.

1. Abra Visual Studio.

2. En la ventana de inicio, elija Crear un proyecto nuevo.

3. En la ventana Crear un proyecto nuevo, seleccione la plantilla Aplicación de
Windows Forms (.NET Framework) para Visual Basic.

Puede refinar la búsqueda para acceder rápidamente a la plantilla que desee. Por
ejemplo, escriba Aplicación de Windows Forms en el cuadro de búsqueda. Luego,
seleccione Visual Basic en la lista Lenguaje y, luego, Windows en la lista
Plataforma.

７ Nota
 Si no ve la plantilla Aplicación de Windows Forms (.NET Framework), puede
instalarla desde la ventana Crear un proyecto nuevo. En el mensaje ¿No
encuentra lo que busca? , elija el vínculo Instalar más herramientas y
características.

Luego, en el Instalador de Visual Studio, elija la carga de trabajo Desarrollo de

escritorio de .NET.

Después, seleccione Modificar en el Instalador de Visual Studio. Es posible

que se le pida que guarde su trabajo.

4. En la ventana Configurar el proyecto nuevo, escriba HelloWorld como el nombre

del proyecto. Seleccione Crear.

Visual Studio se abre en el nuevo proyecto.

Agregar un botón al formulario

Tras seleccionar la plantilla de proyecto de Visual Basic y asignar un nombre al archivo,
Visual Studio abre un formulario automáticamente. Un formulario es una interfaz de
usuario de Windows. Agregará controles al formulario para crear una aplicación "Hola
mundo".

1. En el lado izquierdo del IDE de Visual Studio, seleccione la pestaña Cuadro de

herramientas. Si no la ve, seleccione Ver>Cuadro de herramientas en la barra de
menús o presione Ctrl+Alt+X.

Seleccione el icono Anclar para acoplar la ventana Cuadro de herramientas.

2. Seleccione el control Botón y arrástrelo al formulario.

3. En la sección Apariencia de la ventana Propiedades, en Text, escriba Click this (Clic

aquí) y seleccione ENTRAR.
 Si no ve la ventana Propiedades, puede abrirla desde la barra de menús.
Seleccione Ver>Ventana Propiedades o presione F4.

4. En la sección Diseño de la ventana Propiedades, cambie el nombre de Button1 a

btnClickThis y, luego, presione ENTRAR.

７ Nota
 Si ha ordenado la lista alfabéticamente en la ventana Propiedades, Button1
aparece en cambio en la sección (DataBindings) .

Incorporación de una etiqueta y un código

Ahora que agregó un control de botón para crear una acción, agregue un control de
etiqueta al que enviar texto.

1. Seleccione el control Label de la ventana Cuadro de herramientas y arrástrelo al

formulario. Colóquelo debajo del botón Click this (Clic aquí).

2. En la sección Diseño o (DataBindings) de la ventana Propiedades, cambie el

nombre de Label1 a lblHelloWorld y presione ENTRAR.

3. En la ventana Form1.vb [Design] (Form1.vb [Diseño]), haga doble clic en el botón

Click this (Clic aquí) para abrir la ventana Form1.vb.

Otra opción es expandir Form1.vb en el Explorador de soluciones y seleccione

Form1.

4. En la ventana Form1.vb, entre las líneas Private Sub y End Sub, escriba
lblHelloWorld.Text = "Hello World!" tal y como se muestra en la siguiente captura
de pantalla:

Ejecución de la aplicación
La aplicación está lista para compilarse y ejecutarse.

1. Seleccione Inicio para ejecutar la aplicación.

 Son varias las cosas que pasan. En el IDE de Visual Studio, se abren las ventanas
Herramientas de diagnóstico y Salida. Fuera del IDE, aparece un cuadro de
diálogo Form1, que incluye el botón Click this (Clic aquí) y texto que dice Label1.

2. Seleccione el botón Click this en el cuadro de diálogo Form1.

El texto Label1 cambia a Hola mundo.

3. Cierre el cuadro de diálogo Form1 para dejar de ejecutar la aplicación.

Pasos siguientes
Para más información sobre Windows Forms, vaya al tutorial siguiente:

Tutorial: Crear un visor de imágenes

Vea también
Más tutoriales de Visual Basic
Tutoriales de C#
Tutoriales de C++
Tutorial: Creación de una aplicación de
visor de imágenes de Windows Forms
en Visual Studio
Artículo • 21/06/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta serie de tres tutoriales, creará una aplicación de Windows Forms que carga una
imagen y la muestra. El entorno de desarrollo integrado (IDE) de Visual Studio
proporciona las herramientas necesarias para crear la aplicación. Para obtener más
información, consulte Le damos la bienvenida al IDE de Visual Studio.

En este primer tutorial, obtendrá información sobre cómo hacer lo siguiente:

＂ Creación de un proyecto de Visual Studio que utilice Windows Forms

＂ Adición de un elemento de diseño
＂ Ejecución de la aplicación

Prerrequisitos
Necesitará Visual Studio para completar este tutorial. Visite la página de descargas de
Visual Studio para obtener una versión gratuita.

Creación del proyecto de Windows Forms

Al crear un visor de imagen, el primer paso consiste en crear un proyecto de aplicación
de Windows Forms.

1. Abra Visual Studio.

2. En la ventana de inicio, seleccione Crear un proyecto.

3. En la ventana Crear un proyecto, busque Windows Forms. Después, seleccione
Escritorio en la lista Tipo de proyecto.

4. Seleccione la plantilla Aplicación de Windows Forms (.NET Framework) para C# o

Visual Basic y, luego, Siguiente.

７ Nota
 Si no ve la plantilla Aplicación de Windows Forms (.NET Framework), puede
instalarla desde la ventana Crear un proyecto nuevo. En el mensaje ¿No
encuentra lo que busca? , seleccione el vínculo Instalar más herramientas y
características.

Luego, en el Instalador de Visual Studio, seleccione Desarrollo de escritorio

de .NET.

Seleccione Modificar en el Instalador de Visual Studio. Es posible que se le

pida que guarde su trabajo. Seguidamente, seleccione Continuar para instalar
la carga de trabajo.

5. En la ventana Configure su nuevo proyecto, asigne al proyecto el nombre

PictureViewer y, después, seleccione Crear.

Visual Studio crea una solución para la aplicación. Una solución es un contenedor de
todos los proyectos y archivos necesarios para la aplicación.
En este momento, Visual Studio muestra un formulario vacío en el Diseñador de
Windows Forms.

Adición de un elemento de diseño

La aplicación de visualización de imágenes contiene un cuadro de imagen, una casilla y
cuatro botones, que agregará en el siguiente tutorial. El elemento de diseño controla su
ubicación en el formulario. En esta sección se muestra cómo cambiar el título del
formulario, ajustar su tamaño y agregar un elemento de diseño.

1. En el proyecto, seleccione el Diseñador de Windows Forms. La pestaña se

denomina Form1.cs [Design] para C# o Form1.vb [Design] para Visual Basic.

2. Seleccione cualquier parte de Form1.

3. En la ventana Propiedades, ahora se muestran las propiedades del formulario. La

ventana Propiedades suele estar en la parte inferior derecha de Visual Studio. En
esta sección se controlan varias propiedades, como los colores de primer plano y
de fondo, el texto del título que aparece en la parte superior del formulario y el
tamaño del formulario.

Si no ve la ventana Propiedades, seleccione Ver>Ventana Propiedades.

4. Busque la propiedad Text en la ventana Propiedades. En función del orden de la

lista, puede que deba desplazarse hacia abajo. Escriba el valor Visor de imágenes y
elija Entrar.

El formulario ahora tiene escrito el texto Visor de imágenes en la barra de título.

７ Nota

Puede mostrar las propiedades por categoría o por orden alfabético. Use los
botones de la ventana Propiedades para alternar entre una opción y la otra.

5. Vuelva a seleccionar el formulario. Seleccione el controlador de arrastre situado en

la parte inferior derecha del formulario. El controlador es un pequeño cuadrado
blanco situado en la esquina inferior derecha del formulario.
 Arrastre el controlador para cambiar el tamaño del formulario de modo que
resulte más ancho y un poco más alto. Si se fija en la ventana Propiedades,
observará que la propiedad Size ha cambiado. También puede modificar el tamaño
del formulario cambiando la propiedad Size.

6. En el lado izquierdo del IDE de Visual Studio, seleccione la pestaña Cuadro de

herramientas. Si no la ve, seleccione Ver>Cuadro de herramientas en la barra de
menús o presione Ctrl+Alt+X.

7. Seleccione el símbolo del triángulo pequeño situado junto a Contenedores para

abrir el grupo.

8. Haga doble clic en TableLayoutPanel del cuadro de herramientas. También puede

arrastrar un control del cuadro de herramientas al formulario. El control
TableLayoutPanel aparece en el formulario.
 ７ Nota

Si, después de agregar el control TableLayoutPanel, aparece una ventana

dentro del formulario con el título Tareas de TableLayoutPanel, haga clic en
cualquier parte del formulario para cerrarla.

9. Seleccione el control TableLayoutPanel. Para comprobar qué control está

seleccionado, consulte la ventana Propiedades.

10. Con el control TableLayoutPanel seleccionado, busque la propiedad Dock, que

tiene el valor Ninguno. Seleccione la flecha desplegable y, después, Rellenar, que
es el botón grande situado en el centro del menú desplegable.
 El acoplamiento hace referencia a cómo se adjunta una ventana a otra ventana o
área.

El control TableLayoutPanel ahora rellena todo el formulario. Si vuelve a cambiar el

tamaño del formulario, TableLayoutPanel permanecerá acoplado y cambiará de
tamaño para ajustarse al formulario.

11. En el formulario, seleccione el control TableLayoutPanel. En la esquina superior

derecha, hay un pequeño botón en forma de triángulo negro.

Seleccione el triángulo para mostrar la lista de tareas del control.

12. Seleccione Editar filas y columnas para abrir el cuadro de diálogo Estilos de
columna y fila.

13. Seleccione Column1 y establezca su tamaño en el 15 por ciento. Asegúrese de que

el botón Porcentaje esté seleccionado.

14. Seleccione Column2 y establézcala en el 85 por ciento.

 15. En Mostrar, en la parte superior del cuadro de diálogo Estilos de columna y fila,
seleccione Filas. Establezca Row1 en el 90 por ciento y Row2 en el 10 por ciento.
Seleccione Aceptar para guardar los cambios.

El control TableLayoutPanel ahora tiene una fila superior grande, una fila inferior
pequeña, una columna izquierda pequeña y una columna derecha grande.

El diseño se ha completado.

７ Nota
 Antes de ejecutar la aplicación, seleccione el botón Guardar todo de la barra de
herramientas para guardarla. O bien, para guardar la aplicación, elija
Archivo>Guardar todo en la barra de menús o presione Ctrl+Mayús+S. El
procedimiento recomendado consiste en guardar desde el principio y a menudo.

Ejecutar la aplicación
Al crear un proyecto de aplicación de Windows Forms, se compila un programa que se
ejecuta. En este punto, la aplicación de visor de imágenes no hace gran cosa. Por ahora,
muestra una ventana vacía en la que se ve Visor de imágenes en la barra de título.

Para ejecutar la aplicación, siga estos pasos.

1. Utilice uno de los métodos siguientes:

Presione la tecla F5.

En la barra de menús, seleccione Depurar>Iniciar depuración.
En la barra de herramientas, seleccione el botón Iniciar.

Visual Studio ejecuta la aplicación. Aparece una ventana con el título Visor de
imágenes.

Fíjese en la barra de herramientas del IDE de Visual Studio. Al ejecutar una

aplicación, aparecen más botones en la barra de herramientas. Estos botones
permiten hacer cosas como detener e iniciar la aplicación, y ayudan a realizar el
seguimiento de los errores.
 2. Use uno de los métodos siguientes para detener la aplicación:

Haga clic en el botón Detener depuración de la barra de herramientas.

En la barra de menús, seleccione Depurar>Detener depuración.
En el teclado, presione Mayús+F5.
Seleccione X en la esquina superior de la ventana Visor de imágenes.

Cuando se ejecuta la aplicación desde el IDE de Visual Studio, se denomina

depuración. Ejecuta la aplicación para buscar y corregir errores. Siga el mismo
procedimiento para ejecutar y depurar otros programas. Para más información
sobre la depuración, vea Primer vistazo al depurador.

Pasos siguientes
Pase al siguiente tutorial para obtener información sobre cómo agregar controles al
visor de imágenes.

Parte 2 del tutorial: Adición de controles al visor de imágenes

Tutorial: Adición de controles de
interfaz de usuario a la aplicación de
Windows Forms de visor de imágenes
en Visual Studio
Artículo • 19/06/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta serie de tres tutoriales, creará una aplicación de Windows Forms que carga una
imagen y la muestra. El entorno de desarrollo integrado (IDE) de Visual Studio
proporciona las herramientas necesarias para crear la aplicación. Para obtener más
información, consulte Le damos la bienvenida al IDE de Visual Studio.

Este programa tiene un cuadro de imagen, una casilla y varios botones, que se usan
para controlar la aplicación. En este tutorial se muestra cómo agregar estos controles.

En este segundo tutorial, obtendrá información sobre cómo hacer lo siguiente:

＂ Adición de controles a la aplicación

＂ Adición de botones en un panel de diseño
＂ Cambio de los nombres y las ubicaciones de los controles
＂ Adición de componentes de cuadro de diálogo

Prerrequisitos
Este tutorial se basa en el tutorial anterior, Creación de una aplicación de visor de
imágenes. Si no ha realizado ese tutorial, revíselo primero.

Adición de controles a la aplicación

La aplicación de visor de imágenes usa un control PictureBox para mostrar una imagen.
Usa una casilla y varios botones para administrar la imagen y el fondo, así como para
cerrar la aplicación. Agregará el control PictureBox y una casilla del cuadro de
herramientas al IDE de Visual Studio.

1. Abra Visual Studio. El proyecto de visor de imágenes aparece en Abrir recientes.

2. En el Diseñador de Windows Forms, seleccione el TableLayoutPanel que agregó en

el tutorial anterior. Compruebe que tableLayoutPanel1 aparece en la ventana
 Propiedades.

3. En el lado izquierdo del IDE de Visual Studio, seleccione la pestaña Cuadro de

herramientas. Si no la ve, seleccione Ver>Cuadro de herramientas en la barra de
menús o presione Ctrl+Alt+X. En el cuadro de herramientas, expanda Controles
comunes.

4. Haga doble clic en PictureBox para agregar un control PictureBox al formulario. El

IDE de Visual Studio agrega el control PictureBox a la primera celda vacía de
TableLayoutPanel.

5. Elija el nuevo control PictureBox para seleccionarlo y, después, seleccione el

triángulo negro de este control para mostrar la lista de tareas.

6. Seleccione Acoplar en contenedor primario, que establece la propiedad Dock de

PictureBox en Rellenar. Puede ver este valor en la ventana Propiedades.

7. En la ventana Propiedades de PictureBox, establezca la propiedad ColumnSpan en

2. PictureBox ahora rellena ambas columnas.

8. Establezca la propiedad BorderStyle en Fixed3D.

9. En el Diseñador de Windows Forms, seleccione TableLayoutPanel. Después, en el

cuadro de herramientas, haga doble clic en el elemento CheckBox para agregar
un nuevo control CheckBox. El control PictureBox ocupa las dos primeras celdas
del control TableLayoutPanel, por lo que el control CheckBox se agrega en la celda
inferior izquierda.

10. Elija la propiedad Text y escriba Ajustar.

Adición de botones en un panel de diseño

Hasta ahora, los controles se han agregado a TableLayoutPanel. En estos pasos se
muestra cómo agregar cuatro botones a un nuevo panel de diseño en TableLayoutPanel.

1. Seleccione TableLayoutPanel en el formulario. Abra el cuadro de herramientasy

seleccione Contenedores. Haga doble clic en FlowLayoutPanel para agregar un
nuevo control a la última celda de TableLayoutPanel.

2. Establezca la propiedad Dock de FlowLayoutPanel en Rellenar. Para establecer esta

propiedad, seleccione el triángulo negro y, después, Acoplar en contenedor
primario.

Un elemento FlowLayoutPanel es un contenedor que organiza otros controles en

una fila, una detrás de otra.

3. Seleccione el nuevo FlowLayoutPanel, abra el cuadro de herramientas y, después,

seleccione Controles comunes. Haga doble clic en el elemento Button para
agregar un control de botón denominado button1.

4. Haga doble clic en Button de nuevo para agregar otro botón. El IDE llama al
siguiente button2.

5. Agregue dos botones más de esta manera. Otra opción consiste en seleccionar
button2y, después, Editar>Copiar, o presionar Ctrl+C. Después, seleccione
Editar>Pegar en la barra de menús o presione Ctrl+V para pegar una copia del
botón. Vuelva a pegarlo otra vez. Observe que en el IDE se agregan button3 y
button4 al control FlowLayoutPanel.

6. Seleccione el primer botón y establezca su propiedad Text en Mostrar una

imagen.

7. Establezca las propiedades Text de los tres botones siguientes en Borrar la

imagen, Establecer el color de fondo y Cerrar.

8. Para ajustar el tamaño de los botones y organizarlos, seleccione FlowLayoutPanel.

Establezca la propiedad FlowDirection en RightToLeft.

Los botones deberían alinearse a la derecha de la celda, en orden inverso de modo

que el botón Mostrar una imagen quede a la derecha. Puede arrastrar los botones
por FlowLayoutPanel para organizarlos en cualquier orden.

9. Pulse el botón Cerrar para seleccionarlo. Después, para elegir el resto de los
botones al mismo tiempo, mantenga presionada la tecla Ctrl y selecciónelos.

10. En la ventana Propiedades, establezca la propiedad AutoSize en True. Los botones

cambian de tamaño para ajustarse al texto.
Puede ejecutar el programa para ver el aspecto de los controles. Presione la tecla F5,
seleccione Depurar>Iniciar depuracióno haga clic en el botón Iniciar. Los botones que
ha agregado no hacen nada todavía.

Cambio de los nombres de los controles

Hay cuatro botones en el formulario, denominados button1, button2, button3y button4
en C#. En Visual Basic, la primera letra predeterminada de cualquier nombre de control
se escribe en mayúsculas, por lo que los botones se denominan Button1, Button2,
Button3 y Button4. Siga estos pasos para asignarles nombres más informativos.

1. En el formulario, elija el botón Cerrar . Si todavía están seleccionados todos los

botones, elija Esc para cancelar la selección.

2. En la ventana Propiedades, busque (Nombre) . Cambie el nombre a closeButton.

El IDE no acepta nombres que contengan espacios.

3. Cambie el nombre de los otros tres botones a backgroundButton, clearButtony

showButton. Puede comprobar los nombres eligiendo la lista desplegable de
selección de controles de la ventana Propiedades . Aparecerán los nuevos
nombres de los botones.

Puede cambiar el nombre de cualquier control, como el TableLayoutPanel o la casilla.

Adición de componentes de cuadro de diálogo
La aplicación puede abrir archivos de imagen y elegir un color de fondo usando
componentes. Un componente es como un control. El cuadro de herramientas se usa
para agregar un componente al formulario. Sus propiedades se establecen con la
ventana Propiedades.

A diferencia de lo que sucede con un control, al agregar un componente al formulario

no se agrega un elemento visible. En cambio, se proporcionan determinados
comportamientos que se pueden desencadenar mediante código. Por ejemplo, un
componente es lo que abre un cuadro de diálogo Abrir archivo.

En esta sección, agregará un componente OpenFileDialog y un componente

ColorDialog al formulario.

1. Seleccione el Diseñador de Windows Forms (Form1.cs[Design] ). Después, abra el

cuadro de herramientas y seleccione el grupo Cuadros de diálogo.

2. Haga doble clic en OpenFileDialog para agregar un componente denominado

openFileDialog1 al formulario.

3. Haga doble clic en ColorDialog para agregar un componente denominado

colorDialog1. Los componentes aparecen en la parte inferior del Diseñador de
Windows Forms como iconos.

4. Elija el icono openFileDialog1 y establezca dos propiedades:

Establezca la propiedad Filter en lo siguiente:

Consola

JPEG Files (*.jpg)|*.jpg|PNG Files (*.png)|*.png|BMP Files

(*.bmp)|*.bmp|All files (*.*)|*.*

Establezca la propiedad Title en lo siguiente: Select a picture file (Seleccionar

un archivo de imagen).
 Los valores de la propiedad Filter especifican los tipos que se mostrarán en el
cuadro de diálogo Seleccionar una imagen.

Pasos siguientes
Pase al siguiente tutorial para obtener información sobre cómo agregar código a la
aplicación.

Parte 3 del tutorial: Adición de código al visor de imágenes

Tutorial: Adición de código a la
aplicación de visor de imágenes de
Windows Forms en Visual Studio
Artículo • 20/03/2023 • Tiempo de lectura: 8 minutos

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta serie de tres tutoriales, creará una aplicación de Windows Forms que carga una
imagen y la muestra. El entorno de desarrollo integrado (IDE) de Visual Studio
proporciona las herramientas necesarias para crear la aplicación. Para obtener más
información, consulte Le damos la bienvenida al IDE de Visual Studio.

Los controles usan código de C# o Visual Basic para realizar las acciones asociadas a
ellos.

En este tercer tutorial, obtendrá información sobre cómo hacer lo siguiente:

＂ Adición de controladores de eventos para los controles

＂ Escritura de código para abrir un cuadro de diálogo
＂ Escritura de código para los demás controles
＂ Ejecución de la aplicación

Prerrequisitos
Este tutorial se basa en los tutoriales anteriores, Creación de una aplicación de visor de
imágenes y Adición de controles de interfaz de usuario al visor de imágenes. Si no ha
realizado esos tutoriales, revíselos primero.

Adición de controladores de eventos para los

controles
En esta sección, agregará controladores de eventos para los controles que agregó en el
segundo tutorial, Adición de controles a una aplicación de visor de imágenes. La
aplicación llama a un controlador de eventos cuando tiene lugar una acción, como
seleccionar un botón.

1. Abra Visual Studio. El proyecto de visor de imágenes aparece en Abrir recientes.

2. En el Diseñador de Windows Forms, haga doble clic en el botón Mostrar una
imagen. Como alternativa, puede seleccionar el botón Mostrar una imagen del
formulario y, después, presionar la tecla Entrar.

El IDE de Visual Studio abre una pestaña en la ventana principal. En C#, la pestaña
se denomina Form1.cs. Si usa Visual Basic, la pestaña se denomina Form1.vb.

Esta pestaña muestra el archivo de código subyacente del formulario.

７ Nota

Es posible que la pestaña Form1.vb muestre showButton como ShowButton.

3. Céntrese en esta parte del código.

C#

C#

private void showButton_Click(object sender, EventArgs e)

{
}
 ） Importante

Use el control del lenguaje de programación situado en la parte superior

derecha de esta página para ver el fragmento de código de C# o el de Visual
Basic.

4. Vuelva a elegir la pestaña del Diseñador de Windows Forms y, después, haga

doble clic en el botón Borrar la imagen para abrir su código. Repita el
procedimiento con los dos botones restantes. El IDE de Visual Studio agrega cada
vez un nuevo método al archivo de código del formulario.

5. Haga doble clic en el control CheckBox del Diseñador de Windows Forms para
agregar un método checkBox1_CheckedChanged() . Cuando se activa o desactiva la
casilla, llama a este método.

En el siguiente fragmento de código se muestra el nuevo código que aparece en el

editor de código.

C#

C#

private void clearButton_Click(object sender, EventArgs e)

{
}

private void backgroundButton_Click(object sender, EventArgs e)

{
}

private void closeButton_Click(object sender, EventArgs e)

{
}

private void checkBox1_CheckedChanged(object sender, EventArgs e)

 {
}

Los métodos, incluidos los controladores de eventos, pueden tener cualquier nombre
que se desee. Cuando agregue un controlador de eventos con el IDE, se creará un
nombre basado en el nombre del control y en el evento que se controla.

Por ejemplo, el evento Click para un botón denominado showButton se denomina

showButton_Click() o ShowButton_Click() . Si desea cambiar un nombre de variable de

código, haga clic con el botón secundario en la variable del código y elija
Refactorizar>Cambiar nombre. Todas las instancias de esa variable del código
cambiarán de nombre. Para más información, vea Refactorización de cambio de nombre.

Escritura de código para abrir un cuadro de

diálogo
El botón Mostrar una imagen usa el componente OpenFileDialog para mostrar un
archivo de imagen. Este procedimiento agrega el código utilizado para llamar a ese
componente.

El IDE de Visual Studio ofrece una herramienta eficaz denominada IntelliSense. A medida
que escribe, IntelliSense le sugiere posibles opciones de código.

1. En el Diseñador de Windows Forms, haga doble clic en el botón Mostrar una

imagen. El IDE mueve el cursor dentro del método showButton_Click() o
ShowButton_Click() .

2. Escriba una i en la línea vacía entre las dos llaves { } o entre Private Sub... y End
Sub . Se abrirá una ventana IntelliSense.
 3. En la ventana IntelliSense se debe resaltar la palabra if . Presione la tecla TAB para
insertar if .

4. Seleccione true y escriba op para sobrescribirlo para C# o Op para Visual Basic.

IntelliSense muestra openFileDialog1.

5. Presione la tecla TAB para agregar openFileDialog1.

6. Escriba un punto ( . ) justo después de openFileDialog1. IntelliSense proporciona

todas las propiedades y métodos del componente OpenFileDialog. Empiece a
escribir ShowDialog y presione la tecla TAB. El método ShowDialog() mostrará el
cuadro de diálogo Abrir archivo.

7. Agregue unos paréntesis () inmediatamente después de la "g" en ShowDialog . El

código debería ser openFileDialog1.ShowDialog() .

8. Para C#, agregue un espacio y, después, dos signos igual ( == ). Para Visual Basic,
agregue un espacio y, después, use un solo signo igual ( = ).

9. Agregue otro espacio. Utilice IntelliSense para escribir DialogResult.

10. Escriba un punto para abrir el valor DialogResult en la ventana IntelliSense. Escriba
la letra O y pulse la tecla Tab para insertar Aceptar.

７ Nota

Deberá quedar completa la primera línea de código. Para C#, debe ser similar
a lo siguiente.

if (openFileDialog1.ShowDialog() == DialogResult.OK)

Para Visual Basic, debería ser la siguiente.

If OpenFileDialog1.ShowDialog() = DialogResult.OK Then

11. Agregue la línea de código siguiente.

 C#

C#

pictureBox1.Load(openFileDialog1.FileName);

Puede copiar y pegar o usar IntelliSense para agregarla. El método

showButton_Click() final será similar al código siguiente.

C#

C#

private void showButton_Click(object sender, EventArgs e)

{
if (openFileDialog1.ShowDialog() == DialogResult.OK)
{
pictureBox1.Load(openFileDialog1.FileName);
}
}

1. Agregue el siguiente comentario al código.

C#

C#

private void showButton_Click(object sender, EventArgs e)

{
// Show the Open File dialog. If the user clicks OK, load the
// picture that the user chose.
if (openFileDialog1.ShowDialog() == DialogResult.OK)
{
pictureBox1.Load(openFileDialog1.FileName);
}
}

Se recomienda comentar siempre el código. Los comentarios del código facilitan la

comprensión y el mantenimiento del código en el futuro.

Escritura de código para los demás controles

Si ejecuta la aplicación ahora, podrá seleccionar Mostrar una imagen. El visor de
imágenes abrirá el cuadro de diálogo Abrir archivo, donde podrá seleccionar una
imagen para mostrar.

En esta sección, agregará el código para los demás controladores de eventos.

1. En el Diseñador de Windows Forms, haga doble clic en el botón Borrar la imagen.

Agregue el código entre las llaves.

C#

C#

private void clearButton_Click(object sender, EventArgs e)

{
// Clear the picture.
pictureBox1.Image = null;
}

2. Haga doble clic en el botón Establecer el color de fondo y agregue el código

entre las llaves.

C#

C#

private void backgroundButton_Click(object sender, EventArgs e)

{
// Show the color dialog box. If the user clicks OK, change the
// PictureBox control's background to the color the user chose.
if (colorDialog1.ShowDialog() == DialogResult.OK)
pictureBox1.BackColor = colorDialog1.Color;
}

3. Haga doble clic en el botón Cerrar y agregue el código entre las llaves.

C#

C#

private void closeButton_Click(object sender, EventArgs e)

{
// Close the form.
this.Close();
 }

4. Haga doble clic en la casilla Ajustar y agregue el código entre las llaves.

C#

C#

private void checkBox1_CheckedChanged(object sender, EventArgs e)

{
// If the user selects the Stretch check box,
// change the PictureBox's
// SizeMode property to "Stretch". If the user clears
// the check box, change it to "Normal".
if (checkBox1.Checked)
pictureBox1.SizeMode = PictureBoxSizeMode.StretchImage;
else
pictureBox1.SizeMode = PictureBoxSizeMode.Normal;
}

Ejecución de la aplicación
Puede ejecutar la aplicación en cualquier momento mientras la escribe. Después de
agregar el código en la sección anterior, el visor de imágenes se ha completado. Como
en los tutoriales anteriores, use uno de los métodos siguientes para ejecutar la
aplicación:

Presione la tecla F5.

En la barra de menús, seleccione Depurar>Iniciar depuración.
En la barra de herramientas, seleccione el botón Iniciar.

Aparece una ventana con el título Visor de imágenes. Pruebe todos los controles.

1. Seleccione el botón Establecer el color de fondo. Se abrirá el cuadro de diálogo

Color.
2. Elija un color para establecer el color de fondo.

3. Seleccione Mostrar una imagen para mostrar una imagen.

4. Seleccione y anule la selección de Ajustar.

5. Seleccione el botón Borrar la imagen para asegurarse de que la pantalla se borra.

 6. Seleccione Cerrar para salir de la aplicación.

Pasos siguientes
Felicidades. Ya completó esta serie de tutoriales. Ha realizado estas tareas de
programación y diseño en el IDE de Visual Studio:

Ha creado un proyecto de Visual Studio que usa Windows Forms.

Se ha agregado el diseño de la aplicación de visualización de imágenes.
Ha agregado botones y una casilla.
Ha agregado cuadros de diálogo.
Ha agregado controladores de eventos para los controles.
Ha escrito código de C# o Visual Basic para controlar los eventos.

Continúe aprendiendo con otra serie de tutoriales sobre cómo crear una prueba
matemática cronometrada.

Tutorial 2: Creación de una prueba matemática cronometrada

Tutorial: Creación de una aplicación de
"prueba matemática" WinForms
Artículo • 19/06/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta serie de cuatro tutoriales, creará una prueba matemática. La prueba contiene
cuatro problemas matemáticos aleatorios que un usuario intenta responder en un
tiempo especificado.

El entorno de desarrollo integrado (IDE) de Visual Studio proporciona las herramientas

necesarias para crear la aplicación. Para obtener más información sobre este IDE,
consulte Le damos la bienvenida al IDE de Visual Studio.

En este primer tutorial, obtendrá información sobre cómo hacer lo siguiente:

＂ Crear un proyecto de Visual Studio que utiliza Windows Forms

＂ Agregue etiquetas, un botón y otros controles a un formulario.
＂ Establezca las propiedades de los controles.
＂ Guarde y ejecute el programa.

Requisitos previos
Necesitará Visual Studio para completar este tutorial. Visite la página de descargas de
Visual Studio para obtener una versión gratuita.

Creación del proyecto de Windows Forms

Al crear una prueba matemática, el primer paso consiste en crear un proyecto de
aplicación de Windows Forms.

1. Abra Visual Studio.

2. En la ventana de inicio, seleccione Crear un proyecto.

3. En la ventana Crear un proyecto, busque Windows Forms. Después, seleccione
Escritorio en la lista Tipo de proyecto.

4. Seleccione la plantilla Aplicación de Windows Forms (.NET Framework) para C# o

Visual Basic y, luego, Siguiente.

７ Nota
 Si no ve la plantilla Aplicación de Windows Forms (.NET Framework), puede
instalarla desde la ventana Crear un proyecto nuevo. En el mensaje ¿No
encuentra lo que busca? , seleccione Instalar más herramientas y
características.

Luego, en el Instalador de Visual Studio, seleccione Desarrollo de escritorio

de .NET.

Seleccione Modificar en el Instalador de Visual Studio. Es posible que se le

pida que guarde su trabajo. Seguidamente, seleccione Continuar para instalar
la carga de trabajo.

5. En la ventana Configure su nuevo proyecto, asigne al proyecto el nombre

MathQuiz y, después, seleccione Crear.

Visual Studio crea una solución para la aplicación. Una solución es un contenedor de
todos los proyectos y archivos necesarios para la aplicación.

Establecimiento de las propiedades del

formulario
Tras seleccionar la plantilla y asignar un nombre al archivo, Visual Studio abre un
formulario automáticamente. En esta sección se muestra cómo cambiar algunas
propiedades del formulario.

1. En el proyecto, seleccione el Diseñador de Windows Forms. La pestaña del

diseñador se denomina Form1.cs [Design] para C# o Form1.vb [Design] para
Visual Basic.

2. Seleccione el formulario: Form1.

3. En la ventana Propiedades, ahora se muestran las propiedades del formulario. La

ventana suele estar en la parte inferior derecha de Visual Studio. Si no ve la
ventana Propiedades, seleccione Ver>Ventana Propiedades.
 4. Busque la propiedad Text en la ventana Propiedades. En función del orden de la
lista, puede que deba desplazarse hacia abajo. Escriba el valor Prueba matemática
para el valor Text y, a continuación, seleccione Enter.

El formulario ahora tiene el texto "Prueba matemática" en su barra de título.

７ Nota

Puede mostrar las propiedades por categoría o por orden alfabético. Use los
botones de la ventana Propiedades para alternar entre una opción y la otra.

5. Cambie el tamaño del formulario a 500 píxeles de ancho por 400 píxeles de alto.

Puede cambiar el tamaño del formulario arrastrando sus bordes o arrastrando el

controlador hasta que el tamaño correcto aparezca como el valor Size en la
ventana Propiedades. El controlador de arrastre es un pequeño cuadrado blanco
situado en la esquina inferior derecha del formulario. También puede modificar el
tamaño del formulario cambiando los valores de la propiedad Size.

6. Cambie el valor de la propiedad FormBorderStyle a Fixed3D y establezca la

propiedad MaximizeBox en False.

Estos valores impiden que los jugadores cambien el tamaño del formulario.

Creación del cuadro de tiempo restante

La prueba matemática contiene un cuadro en la esquina superior derecha. En él se
muestra el número de segundos que quedan para completar la prueba. En esta sección
se muestra cómo usar una etiqueta para ese cuadro. Agregará código para el
temporizador de cuenta atrás en un tutorial posterior de esta serie.

1. En el lado izquierdo del IDE de Visual Studio, seleccione la pestaña Cuadro de

herramientas. Si no la ve, seleccione Ver>Cuadro de herramientas en la barra de
menús o presione Ctrl+Alt+X.

2. Seleccione el control Label de la ventana Cuadro de herramientas y arrástrelo al

formulario.

3. En el cuadro Propiedades, establezca las siguientes propiedades para los nuevos

controles:

Establezca el valor (Name) para timeLabel.

Cambie la AutoSize a False para poder cambiar el tamaño del cuadro.
 Cambie BorderStyle a FixedSingle para dibujar una línea alrededor del
cuadro.
Establezca Size en 200, 30.
Seleccione la propiedad Text y, a continuación, pulse la tecla Retroceso para
borrar el valor Text.
Seleccione el signo más ( + ) situado junto a la propiedad Font y, a
continuación, establezca Size en 15,75.

4. Mueva la etiqueta a la esquina superior derecha del formulario. Cuando aparezcan

líneas espaciadoras azules, úselas para colocar el control en el formulario.

5. Agregue otro control Label desde el Cuadro de herramientas y establezca el

tamaño de fuente en 15,75.

6. Establezca la propiedad Text de la etiqueta en Time Left.

7. Mueva la etiqueta para que se alinee a la izquierda de la etiqueta timeLabel.

Agregar controles para los problemas de suma

La primera parte de la prueba es un problema de suma. En esta sección se muestra
cómo usar etiquetas para mostrar ese problema.

1. Agregue un control de etiqueta de Cuadro de herramientas al formulario.

2. En el cuadro Propiedades, establezca las siguientes propiedades para los nuevos

controles:

Establezca Text en ? (signo de interrogación).

Establezca AutoSize en False.
Establezca Size en 60, 50.
Establezca el tamaño de fuente en 18.
Establezca TextAlign en MiddleCenter.
Establezca Location en 50, 75 para colocar el control en el formulario.
Establezca (Name) en plusLeftLabel.

3. En el formulario, seleccione la etiqueta plusLeftLabel que ha creado. Copie la

etiqueta seleccionando Editar>CopiaroCtrl+C.
 4. Pegue la etiqueta en el formulario tres veces seleccionando Editar>Pegar o Ctrl+V
tres veces.

5. Organice las tres nuevas etiquetas para que estén en fila a la derecha de la
etiqueta plusLeftLabel.

6. Establezca la propiedad Text de la segunda etiqueta en + (signo más).

7. Establezca la propiedad (Name) de la tercera etiqueta en plusRightLabel.

8. Establezca la propiedad de la cuarta etiqueta Text en = (signo igual).

9. Agregue un control NumericUpDown del cuadro de herramientas al formulario.

Obtendrá más información sobre este tipo de control más adelante.

10. En el cuadro Propiedades, establezca las siguientes propiedades del control

NumericUpDown:

Establezca el tamaño de fuente en 18.

Establezca el ancho en 100.
Establezca el (Nombre) para sumar.

11. Alinee el control NumericUpDown con los controles de etiqueta para el problema
de suma.

Agregar controles para los problemas de resta,

multiplicación y división
Después, agregue etiquetas al formulario para los problemas matemáticos restantes.

1. Copie los cuatro controles Label y el control NumericUpDown que creó para el
problema de suma. Péguelos en el formulario.

2. Mueva los nuevos controles para que se alineen debajo de los controles de suma.
3. En el cuadro Propiedades, establezca las siguientes propiedades para los nuevos
controles:

Establezca el (Nombre) de la primera etiqueta del signo de interrogación

como minusLeftLabel.
Establezca el valor Text de la segunda etiqueta como - (signo menos).
Establezca el (Nombre) de la segunda etiqueta del signo de interrogación
como minusRightLabel.
Establezca el (Nombre) del control NumericUpDown como difference.

4. Copie los controles de suma y péguelos dos veces más en el formulario.

5. Para la tercera fila:

Establezca el (Nombre) de la primera etiqueta del signo de interrogación

como timesLeftLabel.
Establezca el valor Text de la segunda etiqueta como × (signo de
multiplicación). Puede copiar el signo de multiplicación de este tutorial y
pegarlo en el formulario.
Establezca el (Nombre) de la segunda etiqueta del signo de interrogación
como timesRightLabel.
Establezca el (Nombre) del control NumericUpDown como product.

6. Para la cuarta fila:

Establezca el (Nombre) de la primera etiqueta del signo de interrogación

como dividedLeftLabel.
Establezca el valor Text de la segunda etiqueta como ÷ (signo de división).
Puede copiar el signo de división de este tutorial y pegarlo en el formulario.
Establezca el (Nombre) de la segunda etiqueta del signo de interrogación
como dividedRightLabel.
Establezca el (Nombre) del control NumericUpDown como quotient.
Agregar un botón Iniciar y establecer el orden
del índice de tabulación
En esta sección se muestra cómo agregar un botón de inicio. También especificará el
orden de tabulación de los controles. Este orden determina cómo se mueve el usuario
de un control al siguiente mediante la tecla TAB.

1. Agregue un control Button del cuadro de herramientas al formulario.

2. En el cuadro Propiedades, establezca las siguientes propiedades del botón:

Establezca el (Nombre) en startButton.

Establezca el valor Text como Iniciar la prueba.
Establezca el tamaño de fuente en 14.
Establezca AutoSize en True, para que el tamaño del botón se ajuste
automáticamente al texto.
Establezca TabIndex en 0. Este valor hace que el botón de inicio sea el primer
control que recibe el foco.

3. Centre el botón cerca de la parte inferior del formulario.

 4. En el cuadro Propiedades, establezca la propiedad TabIndex de cada control
NumericUpDown:

Establezca la propiedad TabIndex del control NumericUpDown de sum en 1.

Establezca la propiedad TabIndex del control NumericUpDown de difference
en 2.
Establezca la propiedad TabIndex del control NumericUpDown de product
en 3.
Establezca la propiedad TabIndex del control NumericUpDown de quotient
en 4.

Ejecutar la aplicación
Los problemas matemáticos aún no funcionan en la prueba. Pero puede ejecutar la
aplicación para comprobar si los valores de TabIndex funcionan según lo previsto.

1. Use uno de los métodos siguientes para guardar la aplicación:

Seleccione Ctrl+Mayús+S.
En la barra de menús, seleccione Archivo>Guardar todo.
En la barra de herramientas, seleccione el botón Guardar todo.

2. Utilice uno de los métodos siguientes para ejecutar la aplicación:

 Seleccione F5.
En la barra de menús, seleccione Depurar>Iniciar depuración.
En la barra de herramientas, seleccione el botón Iniciar.

3. Seleccione la tecla TAB varias veces para ver cómo se mueve el foco de un control
al siguiente.

Pasos siguientes
Avance al siguiente tutorial para agregar problemas matemáticos aleatorios y un
controlador de eventos a la prueba matemática.

Parte 2 del tutorial: adición de problemas matemáticos a una aplicación WinForms

de prueba matemática
Tutorial: adición de problemas
matemáticos a una prueba matemática
de la aplicación WinForms
Artículo • 20/03/2023 • Tiempo de lectura: 9 minutos

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta serie de cuatro tutoriales, creará una prueba matemática. El cuestionario

contiene cuatro problemas matemáticos aleatorios que el usuario intentará responder
en un tiempo especificado.

Los controles usan código C# o Visual Basic. En este segundo tutorial, volverá la prueba
más difícil al agregar código para problemas de matemáticas basados en números
aleatorios. También creará un método denominado StartTheQuiz() para rellenar los
problemas.

En este segundo tutorial, obtendrá información sobre cómo hacer lo siguiente:

＂ Escriba código para crear objetos aleatorios para usarlos en problemas

matemáticos.
＂ Agregue un controlador de eventos para el botón de inicio.
＂ Escriba código para iniciar la prueba.

Prerequisites
Este tutorial se basa en uno anterior: Crear una prueba matemática en la aplicación
WinForms. Si no ha completado ese tutorial, hágalo antes.

Crear un problema de suma aleatoria

1. En el proyecto de Visual Studio, seleccione Diseñador de Windows Forms.

2. Seleccione el formulario: Form1.

3. En la barra de menús, seleccione Ver>Código. Aparecerá Form1.cs o Form1.vb,

según el lenguaje de programación que esté utilizando, de modo que podrá ver el
código subyacente del formulario.

4. Cree un objeto Random agregando una instrucción new cerca de la parte superior
del código.
 C#

C#

public partial class Form1 : Form

{
// Create a Random object called randomizer
// to generate random numbers.
Random randomizer = new Random();

） Importante

Use el control del lenguaje de programación situado en la parte superior derecha

de esta página para ver el fragmento de código de C# o el de Visual Basic.

Puede usar instrucciones new como esta para crear botones, etiquetas, paneles,
OpenFileDialogs, ColorDialogs, SoundPlayers, Randoms e incluso formularios. Estos
elementos se denominan objetos.

Al ejecutar el programa, se inicia el formulario. El código subyacente crea un objeto

aleatorio y lo denomina randomizer.

La prueba necesita variables para almacenar los números aleatorios que crea para cada
problema. Antes de usar las variables, debe declararlas, lo que significa que debe
enumerar sus nombres y tipos de datos.

1. Agregue dos variables de entero al formulario y asígneles los nombres addend1 y

addend2.

７ Nota
 Una variable de entero se conoce como int en C# o Integer en Visual Basic.
Este tipo de variable almacena un número positivo o negativo comprendido
entre -2147483648 y 2147483647, y solo puede almacenar números enteros,
no decimales.

Para agregar una variable de entero se utiliza una sintaxis similar a la que usó para
agregar el objeto aleatorio, tal y como se muestra en el código siguiente.

C#

C#

// Create a Random object called randomizer

// to generate random numbers.
Random randomizer = new Random();

// These integer variables store the numbers

// for the addition problem.
int addend1;
int addend2;

1. Agregue un método denominado StartTheQuiz() . Este método usa el método del

objeto aleatorio Next() para generar números aleatorios para las etiquetas.
StartTheQuiz() finalmente rellenará todos los problemas y, a continuación, iniciará

el temporizador, así que agregue esta información al comentario de resumen. La

función debe ser similar al código siguiente.

C#

C#

/// <summary>
/// Start the quiz by filling in all of the problems
/// and starting the timer.
/// </summary>
public void StartTheQuiz()
{
// Fill in the addition problem.
// Generate two random numbers to add.
// Store the values in the variables 'addend1' and 'addend2'.
addend1 = randomizer.Next(51);
addend2 = randomizer.Next(51);

// Convert the two randomly generated numbers

// into strings so that they can be displayed
 // in the label controls.
plusLeftLabel.Text = addend1.ToString();
plusRightLabel.Text = addend2.ToString();

// 'sum' is the name of the NumericUpDown control.

// This step makes sure its value is zero before
// adding any values to it.
sum.Value = 0;
}

Cuando use el método Next() con un objeto aleatorio, como cuando llame a
randomizer.Next(51) , obtendrá un número aleatorio menor que 51 (del 0 al 50). Este

código llama a randomizer.Next(51) para que los dos números aleatorios sumen una
respuesta que esté entre 0 y 100.

Fijémonos con más atención en estas instrucciones.

C#

C#

plusLeftLabel.Text = addend1.ToString();
plusRightLabel.Text = addend2.ToString();

Las instrucciones establecen las propiedades Text de plusLeftLabel y plusRightLabel

para que muestren los dos números aleatorios. Los controles de la etiqueta muestran
valores en formato de texto y, en programación, las cadenas mantienen texto. El
método de ToString() de cada entero convierte el entero en texto que puede mostrar
una etiqueta.

Crear problemas aleatorios de resta,

multiplicación y división
El siguiente paso consiste en declarar variables y proporcionar valores aleatorios para
los otros problemas matemáticos.

1. Agregue variables de enteros para los problemas matemáticos restantes al

formulario, después de las variables de problemas de suma. El código debe tener
un aspecto similar al del siguiente ejemplo.

C#
 C#

public partial class Form1 : Form

{
// Create a Random object called randomizer
// to generate random numbers.
Random randomizer = new Random();

// These integer variables store the numbers

// for the addition problem.
int addend1;
int addend2;

// These integer variables store the numbers

// for the subtraction problem.
int minuend;
int subtrahend;

// These integer variables store the numbers

// for the multiplication problem.
int multiplicand;
int multiplier;

// These integer variables store the numbers

// for the division problem.
int dividend;
int divisor;

1. Modifique el método StartTheQuiz() agregando el código siguiente, empezando

por el comentario "Rellene el problema de resta".

C#

C#

/// <summary>
/// Start the quiz by filling in all of the problem
/// values and starting the timer.
/// </summary>
public void StartTheQuiz()
{
// Fill in the addition problem.
// Generate two random numbers to add.
// Store the values in the variables 'addend1' and 'addend2'.
addend1 = randomizer.Next(51);
addend2 = randomizer.Next(51);

// Convert the two randomly generated numbers

 // into strings so that they can be displayed
// in the label controls.
plusLeftLabel.Text = addend1.ToString();
plusRightLabel.Text = addend2.ToString();

// 'sum' is the name of the NumericUpDown control.

// This step makes sure its value is zero before
// adding any values to it.
sum.Value = 0;

// Fill in the subtraction problem.

minuend = randomizer.Next(1, 101);
subtrahend = randomizer.Next(1, minuend);
minusLeftLabel.Text = minuend.ToString();
minusRightLabel.Text = subtrahend.ToString();
difference.Value = 0;

// Fill in the multiplication problem.

multiplicand = randomizer.Next(2, 11);
multiplier = randomizer.Next(2, 11);
timesLeftLabel.Text = multiplicand.ToString();
timesRightLabel.Text = multiplier.ToString();
product.Value = 0;

// Fill in the division problem.

divisor = randomizer.Next(2, 11);
int temporaryQuotient = randomizer.Next(2, 11);
dividend = divisor * temporaryQuotient;
dividedLeftLabel.Text = dividend.ToString();
dividedRightLabel.Text = divisor.ToString();
quotient.Value = 0;

Este código utiliza el método Next() de la clase Random de forma ligeramente diferente
a como lo hace el problema de suma. Al asignar dos valores al método Next() , este
elige un número aleatorio que sea mayor o igual que el primer valor y menor que el
segundo.

Mediante el uso del método Next() con dos argumentos, puede asegurarse de que el
problema de resta tiene una respuesta positiva, la respuesta de multiplicación es como
máximo de 100 y la respuesta de división no es una fracción.

Adición de un controlador de eventos al botón

de inicio
En esta sección, agregará código para iniciar la prueba cuando se seleccione el botón
Iniciar. El código que se ejecuta en reacción a un evento como una selección de botón
se denomina controlador de eventos.

1. En Diseñador de Windows Forms, haga doble clic en el botón Iniciar la prueba o

selecciónelo y, después, Entrar. Aparece el código del formulario y se ve un nuevo
método.

Estas acciones agregan un controlador de eventos de Clic al botón de inicio.

Cuando el usuario selecciona este botón, la aplicación ejecuta el código que usted
agregará a este nuevo método.

2. Agregue las dos instrucciones siguientes para que el controlador de eventos inicie
la prueba.

C#

C#

private void startButton_Click(object sender, EventArgs e)

{
StartTheQuiz();
startButton.Enabled = false;
}

La primera instrucción llama al nuevo método StartTheQuiz() . La segunda instrucción

establece la propiedad Enabled del control startButton en false , de modo que el
usuario no pueda pulsar el botón durante una prueba.

Ejecutar la aplicación
1. Guarde el código.

2. Ejecute la aplicación y, después, seleccione Iniciar la prueba. Aparecen problemas

matemáticos aleatorios, como se muestra en la captura de pantalla siguiente.
Pasos siguientes
Avance al siguiente tutorial para agregar un temporizador a la prueba matemática y
comprobar las respuestas del usuario.

Parte 3 del tutorial: adición de un temporizador a una aplicación WinForms de

prueba matemática
Tutorial: Incorporación de un
temporizador a una aplicación de
WinForms de prueba matemática
Artículo • 20/03/2023 • Tiempo de lectura: 10 minutos

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta serie de cuatro tutoriales, creará una prueba matemática. El cuestionario

contiene cuatro problemas matemáticos aleatorios que el usuario intentará responder
en un tiempo especificado.

La prueba usa un control Timer. El código subyacente a este control realiza un

seguimiento del tiempo transcurrido y comprueba las respuestas del usuario.

En este tercer tutorial, obtendrá información sobre cómo hacer lo siguiente:

＂ Agregue un control Timer.

＂ Agregue un controlador de eventos para el temporizador.
＂ Escriba código para comprobar las respuestas del usuario, mostrar mensajes y
rellenar las respuestas correctas.

Prerequisites
Este tutorial se basa en tutoriales anteriores, empezando por Crear una prueba
matemática de la aplicación WinForms. Si no ha completado esos tutoriales, revíselos
primero.

Agregar un temporizador de cuenta atrás

Para realizar un seguimiento del tiempo durante la prueba, use un componente de
temporizador. También necesita una variable para almacenar la cantidad de tiempo
restante.

1. Agregue una variable de entero denominada timeLeft de la misma manera que

declaró las variables en tutoriales anteriores. Coloque la declaración timeLeft justo
después de las demás declaraciones. El código debe tener un aspecto similar al del
siguiente ejemplo.

C#
 C#

public partial class Form1 : Form

{
// Create a Random object called randomizer
// to generate random numbers.
Random randomizer = new Random();

// These integer variables store the numbers

// for the addition problem.
int addend1;
int addend2;

// These integer variables store the numbers

// for the subtraction problem.
int minuend;
int subtrahend;

// These integer variables store the numbers

// for the multiplication problem.
int multiplicand;
int multiplier;

// These integer variables store the numbers

// for the division problem.
int dividend;
int divisor;

// This integer variable keeps track of the

// remaining time.
int timeLeft;

） Importante

Use el control del lenguaje de programación situado en la parte superior derecha

de esta página para ver el fragmento de código de C# o el de Visual Basic.
 2. En Diseñador de Windows Forms, mueva un control Timer de la categoría
Componentes del cuadro de herramientas al formulario. El control aparece en el
área gris de la parte inferior de la ventana de diseño.

3. En el formulario, seleccione el icono timer1 que acaba de agregar y establezca su

propiedad Interval en 1000. Dado que este intervalo está en milisegundos, un valor
de 1000 hace que el temporizador genera Tick un evento cada segundo.

Comprobación de las respuestas

Dado que el temporizador genera un evento Tick cada segundo, tiene sentido
comprobar el tiempo transcurrido en un controlador de eventos Tick. También es
práctico comprobar las respuestas en ese controlador de eventos. Si se ha acabado el
tiempo o si las respuestas son correctas, la prueba debe finalizar.

Antes de escribir ese controlador de eventos, agregue un método llamado

CheckTheAnswer() para determinar si las respuestas a los problemas matemáticos son

correctas. Este método debe estar en línea con el resto de métodos, como
StartTheQuiz() . El código debe tener un aspecto similar al del siguiente ejemplo.

C#

C#

/// <summary>
/// Check the answers to see if the user got everything right.
/// </summary>
/// <returns>True if the answer's correct, false otherwise.</returns>
private bool CheckTheAnswer()
{
if ((addend1 + addend2 == sum.Value)
&& (minuend - subtrahend == difference.Value)
&& (multiplicand * multiplier == product.Value)
&& (dividend / divisor == quotient.Value))
return true;
else
return false;
}

Este método determina las respuestas a los problemas matemáticos y compara los
resultados con los valores de los controles NumericUpDown. En este código:

La versión de Visual Basic utilizala palabra clave Function en lugar de la palabra

clave habitual Sub , ya que este método devuelve un valor.
 Dado que no resulta fácil escribir el signo de multiplicación (×) y el signo de
división (÷) mediante el teclado, C# y Visual Basic aceptan el asterisco (*) para la
multiplicación y la barra diagonal (/) para la división.

En C#, && es el operador logical and . En Visual Basic, el operador equivalente es

AndAlso . Use el operador logical and para comprobar si se cumple más de una

condición. En este caso, si todos los valores son correctos, el método devuelve un
valor de true . De lo contrario, el método devuelve el valor false .

La instrucción if usa la propiedad Value de un control NumericUpDown para

acceder al valor actual del control. En la siguiente sección, usará la misma
propiedad para mostrar la respuesta correcta en cada control.

Agregar un controlador de eventos al

temporizador
Ahora que tiene una manera de comprobar las respuestas, puede escribir el código para
el controlador de eventos Tick. Este código se ejecuta cada segundo, después de que el
temporizador genere un evento Tick. Este controlador de eventos comprueba las
respuestas del usuario mediante una llamada a CheckTheAnswer() . También comprueba
cuánto tiempo ha transcurrido en la prueba.

1. En el formulario, haga doble clic en el control Timer o selecciónelo y pulse la tecla

Entrar. Estas acciones agregan un controlador de eventos Tick al temporizador.
Aparece el editor de código y muestra el método del controlador Tick.

2. Agregue las siguientes instrucciones al nuevo método de control de eventos.

C#

C#

private void timer1_Tick(object sender, EventArgs e)

{
if (CheckTheAnswer())
{
// If CheckTheAnswer() returns true, then the user
// got the answer right. Stop the timer
// and show a MessageBox.
timer1.Stop();
MessageBox.Show("You got all the answers right!",
"Congratulations!");
startButton.Enabled = true;
}
 else if (timeLeft > 0)
{
// If CheckTheAnswer() returns false, keep counting
// down. Decrease the time left by one second and
// display the new time left by updating the
// Time Left label.
timeLeft = timeLeft - 1;
timeLabel.Text = timeLeft + " seconds";
}
else
{
// If the user ran out of time, stop the timer, show
// a MessageBox, and fill in the answers.
timer1.Stop();
timeLabel.Text = "Time's up!";
MessageBox.Show("You didn't finish in time.", "Sorry!");
sum.Value = addend1 + addend2;
difference.Value = minuend - subtrahend;
product.Value = multiplicand * multiplier;
quotient.Value = dividend / divisor;
startButton.Enabled = true;
}
}

Cada segundo de la prueba, se ejecuta este método. El código comprueba primero el

valor que CheckTheAnswer() devuelve.

Si todas las respuestas son correctas, ese valor es true y finaliza la prueba:
El temporizador se detiene.
Aparece un mensaje de enhorabuena.
La propiedad Enabled del control startButton se establece en true para que el
jugador pueda iniciar otra prueba.

Si CheckTheAnswer() devuelve false , el código comprueba el valor de timeLeft:

Si esta variable es mayor que 0, el temporizador resta 1 de timeLeft. También
actualiza la propiedad Text del control timeLabel para mostrar al jugador
cuántos segundos quedan.
Si no queda tiempo, el temporizador se detiene y cambia el texto timeLabel a
Se acabó el tiempo. Un cuadro de mensaje anuncia que se ha terminado la
prueba y se revelan las respuestas. El botón Iniciar vuelve a estar disponible.

Inicio del temporizador

Para iniciar el temporizador cuando se inicie la prueba, agregue tres líneas al final del
método StartTheQuiz() , como se muestra en el ejemplo siguiente.
C#

C#

/// <summary>
/// Start the quiz by filling in all of the problem
/// values and starting the timer.
/// </summary>
public void StartTheQuiz()
{
// Fill in the addition problem.
// Generate two random numbers to add.
// Store the values in the variables 'addend1' and 'addend2'.
addend1 = randomizer.Next(51);
addend2 = randomizer.Next(51);

// Convert the two randomly generated numbers

// into strings so that they can be displayed
// in the label controls.
plusLeftLabel.Text = addend1.ToString();
plusRightLabel.Text = addend2.ToString();

// 'sum' is the name of the NumericUpDown control.

// This step makes sure its value is zero before
// adding any values to it.
sum.Value = 0;

// Fill in the subtraction problem.

minuend = randomizer.Next(1, 101);
subtrahend = randomizer.Next(1, minuend);
minusLeftLabel.Text = minuend.ToString();
minusRightLabel.Text = subtrahend.ToString();
difference.Value = 0;

// Fill in the multiplication problem.

multiplicand = randomizer.Next(2, 11);
multiplier = randomizer.Next(2, 11);
timesLeftLabel.Text = multiplicand.ToString();
timesRightLabel.Text = multiplier.ToString();
product.Value = 0;

// Fill in the division problem.

divisor = randomizer.Next(2, 11);
int temporaryQuotient = randomizer.Next(2, 11);
dividend = divisor * temporaryQuotient;
dividedLeftLabel.Text = dividend.ToString();
dividedRightLabel.Text = divisor.ToString();
quotient.Value = 0;

// Start the timer.

timeLeft = 30;
timeLabel.Text = "30 seconds";
 timer1.Start();
}

Al empezar la prueba, este código establece la variable timeLeft en 30 y la propiedad

Text del control timeLabel se establece en 30 segundos. A continuación, el método
Start() del control Timer inicia la cuenta atrás.

Ejecutar la aplicación
1. Guarde el programa y ejecútelo.

2. Seleccione Iniciar la prueba. El temporizador iniciará la cuenta atrás. Cuando se

agota el tiempo, la prueba finaliza y se muestran la respuestas.

3. Inicie otra prueba y proporcione respuestas correctas a los problemas

matemáticos. Cuando responda correctamente dentro del límite de tiempo, se
abrirá un cuadro de mensaje, el botón Iniciar estará disponible y el temporizador
se detendrá.

Pasos siguientes
Avance al siguiente tutorial para aprender a personalizar la prueba matemática.
Tutorial parte 4: Personalización de una aplicación de prueba matemática en
WinForms
Tutorial: Personalización de una
aplicación de prueba matemática en
WinForms
Artículo • 25/04/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta serie de cuatro tutoriales, creará una prueba matemática. La prueba contiene
cuatro problemas matemáticos aleatorios que un usuario intenta responder en un
tiempo especificado.

En este tutorial se muestra cómo mejorar la prueba borrando los valores

predeterminados y personalizando la apariencia de los controles.

En este tutorial final, obtendrá información sobre cómo hacer lo siguiente:

＂ Agregar controladores de eventos para borrar los valores predeterminados del

control NumericUpDown.
＂ Personalizar la prueba.

Prerequisites
Este tutorial se basa en tutoriales anteriores, empezando por Crear una prueba
matemática de la aplicación WinForms. Si no ha completado esos tutoriales, revíselos
primero.

Agregar controladores de eventos para los

controles NumericUpDown.
La prueba contiene controles NumericUpDown que los usuarios de la prueba usan para
escribir números. Al escribir una respuesta, debe seleccionar primero el valor
predeterminado o eliminar ese valor manualmente. Al agregar un controlador de
eventos Enter, puede facilitar la especificación de respuestas. Este código selecciona y
borra el valor actual de cada uno de los controles NumericUpDown en cuanto el usuario
lo elija y comience a escribir un valor diferente.

1. Seleccione el primer control NumericUpDown en el formulario. En el cuadro de

diálogo Propiedades, seleccione el icono Eventos de la barra de herramientas.
 En la pestaña Eventos del cuadro de diálogo Propiedades se muestran todos los
eventos del elemento elegido en el formulario a los que se puede responder. En
este caso, todos los eventos enumerados pertenecen al control NumericUpDown.

2. Seleccione el evento Enter, escriba answer_Enter y elija la tecla Entrar.

Aparece el editor de código y muestra el controlador de eventos Enter que creó

para el control NumericUpDown de suma.

3. En el método del controlador de eventos answer_Enter, agregue el código

siguiente:

C#

C#

private void answer_Enter(object sender, EventArgs e)

{
// Select the whole answer in the NumericUpDown control.
NumericUpDown answerBox = sender as NumericUpDown;

if (answerBox != null)
{
int lengthOfAnswer = answerBox.Value.ToString().Length;
answerBox.Select(0, lengthOfAnswer);
}
}

） Importante
 Use el control del lenguaje de programación situado en la parte superior derecha
de esta página para ver el fragmento de código de C# o el de Visual Basic.

En este código:

La primera línea declara el método. Incluye un parámetro denominado sender . En

C#, el parámetro es object sender . En Visual Basic, es sender As System.Object .
Este parámetro hace referencia al objeto que tiene el evento que se genera, lo que
se conoce como remitente. En este caso, el objeto remitente es el control
NumericUpDown.
La primera línea dentro del método convierte el remitente de un objeto genérico a
un control NumericUpDown. Esa línea también asigna el nombre answerBox al
control NumericUpDown. Todos los controles NumericUpDown del formulario
usarán este método, no solo el control del problema de suma.
En la línea siguiente se comprueba si se ha llevado a cabo correctamente la
conversión de answerBox a un control NumericUpDown.
La primera línea dentro de la instrucción if determina la longitud de la respuesta
que está actualmente en el control NumericUpDown.
La segunda línea dentro de la instrucción if usa la longitud de respuesta para
seleccionar el valor actual en el control.

Cuando el usuario selecciona el control, Visual Studio inicia este evento. Este código
selecciona la respuesta actual. En cuanto el jugador empiece a escribir otra respuesta, se
borrará la respuesta actual y se reemplazará por la nueva.

1. En Diseñador de Windows Forms, seleccione de nuevo el control

NumericUpDown de problema de suma.

2. En la página Eventos del cuadro de diálogo Propiedades, busque el evento Click y,

a continuación, seleccione answer_Enter en el menú desplegable. Este controlador
de eventos es el que acaba de agregar.

3. En Diseñador de Windows Forms, seleccione el control de NumericUpDown de

problema de resta.
 4. En la página Eventos del cuadro de diálogo Propiedades, busque el evento Enter
y, a continuación, seleccione answer_Enter en el menú desplegable. Este
controlador de eventos es el que acaba de agregar. Repita este paso para el
evento Click.

5. Repita los dos pasos anteriores para los controles NumericUpDown de

multiplicación y división.

Ejecutar la aplicación
1. Guarde el programa y ejecútelo.

2. Inicie una prueba y seleccione un control NumericUpDown. El valor existente se

selecciona automáticamente y se borra cuando empieza a escribir un valor
diferente.

Personalizar la prueba
En la última parte del tutorial, explorará algunas maneras de personalizar la prueba y
ampliar sus conocimientos.

Cambiar el color de una etiqueta

 Use la propiedad BackColor del control timeLabel para que esta etiqueta pase a
estar en rojo cuando solo queden cinco segundos para acabar una prueba.

C#

C#

timeLabel.BackColor = Color.Red;

Restablezca el color cuando la prueba haya terminado.

Reproducir un sonido para una respuesta correcta

Proporcione una sugerencia al jugador reproduciendo un sonido cuando especifique
una respuesta correcta en un control NumericUpDown. Para implementar esta
funcionalidad, escriba un controlador de eventos para cada evento ValueChanged del
control. Este tipo de evento se activa cada vez que un usuario cambia el valor del
control.

Pasos siguientes
Felicidades. Ha terminado esta serie de tutoriales. Completó estas tareas de
programación y diseño en el IDE de Visual Studio:

Ha creado un proyecto de Visual Studio que usa Windows Forms.

Agregó etiquetas, un botón y controles NumericUpDown
Agregó un temporizador
Ha configurado controladores de eventos para los controles.
Ha escrito código de C# o Visual Basic para controlar los eventos.

Continúe aprendiendo con otra serie de tutoriales sobre cómo crear un juego de formar
parejas.

Tutorial 3: Creación de un juego de formar parejas

Tutorial: Creación de una aplicación de
WinForms para un juego de formar
parejas
Artículo • 09/03/2023 • Tiempo de lectura: 6 minutos

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta serie de cuatro tutoriales, creará un juego de formar parejas en el que el usuario
que juegue formará parejas de iconos ocultos.

Use estos tutoriales para obtener información sobre las tareas siguientes en el entorno
de desarrollo integrado (IDE) de Visual Studio.

Almacenar objetos, como iconos, en un objeto List<T>.

Use un bucle de foreach en C# o un bucle de For Each en Visual Basic para
recorrer en iteración los elementos de una lista.
Realizar un seguimiento del estado de un formulario mediante variables de
referencia.
Crear un controlador de eventos que responda a eventos que se puedan usar con
varios objetos.
Crear un temporizador para la cuenta atrás y desencadenar un evento una y solo
una vez después de iniciarse.

Cuando termine, tendrá un juego completo.

En este primer tutorial, obtendrá información sobre cómo hacer lo siguiente:

＂ Crear un proyecto de Visual Studio que utiliza Windows Forms

＂ Agregar un elemento de diseño y darle formato
＂ Agregar etiquetas para mostrar y darles formato

Requisitos previos
Necesitará Visual Studio para completar este tutorial. Visite la página de descargas de
Visual Studio para obtener una versión gratuita.

Creación de un proyecto de juego de formar

parejas de Windows Forms
Al crear el juego de formar parejas, el primer paso consiste en crear un proyecto de
aplicación de Windows Forms.

1. Abra Visual Studio.

2. En la ventana de inicio, seleccione Crear un proyecto.

3. En la ventana Crear un proyecto, busque Windows Forms. Después, seleccione

Escritorio en la lista Tipo de proyecto.

4. Seleccione la plantilla Aplicación de Windows Forms (.NET Framework) para C# o

Visual Basic y, luego, Siguiente.

７ Nota
 Si no ve la plantilla Aplicación de Windows Forms (.NET Framework), puede
instalarla desde la ventana Crear un proyecto nuevo. En el mensaje ¿No
encuentra lo que busca? , seleccione el vínculo Instalar más herramientas y
características.

Luego, en el Instalador de Visual Studio, seleccione Desarrollo de escritorio

de .NET.

Seleccione Modificar en el Instalador de Visual Studio. Es posible que se le

pida que guarde su trabajo. Seguidamente, seleccione Continuar para instalar
la carga de trabajo.

5. En la ventana Configure su nuevo proyecto, asigne al proyecto el nombre

MatchingGame y, después, seleccione Crear.

Visual Studio crea una solución para la aplicación. Una solución es un contenedor de
todos los proyectos y archivos necesarios para la aplicación.
En este momento, Visual Studio muestra un formulario vacío en el Diseñador de
Windows Forms.

Creación de un diseño para el juego

En esta sección, creará la cuadrícula de cuatro por cuatro del juego.

1. Haga clic en el formulario para seleccionar el Diseñador de Windows Forms. La

pestaña se denomina Form1.cs [Design] para C# o Form1.vb [Design] para
Visual Basic. En la ventana Propiedades, defina las propiedades del formulario
siguientes.

Cambie la propiedad Text de Form1 a Matching Game. Este texto aparece en

la parte superior de la ventana de juego.
Cambie el tamaño del formulario. Para hacerlo, puede establecer la
propiedad Size en 550, 550, o bien arrastrar la esquina del formulario hasta
que vea el tamaño correcto en la parte inferior del IDE de Visual Studio.

2. En el lado izquierdo del IDE, seleccione la pestaña Cuadro de herramientas. Si no

ve dicha pestaña, seleccione Ver>Cuadro de herramientas en la barra de menús o
haga clic en Ctrl+Alt+X.

3. Arrastre un control TableLayoutPanel de la categoría Contenedores en el cuadro

de herramientas o haga doble clic en él. Establezca las propiedades siguientes para
el panel en la ventana Propiedades.

Establezca la propiedad BackColor en CornflowerBlue. Para establecer esta

propiedad, seleccione la flecha que aparece junto a la propiedad BackColor.
En el cuadro de diálogo BackColor, seleccione Web. En los nombres de
colores disponibles, seleccione CornflowerBlue.

７ Nota

Los colores no están en orden alfabético, y CornflowerBlue está casi al

final de la lista.

Establezca la propiedad Dock en Fill en la lista desplegable. Para ello,

seleccione el botón central grande. Esta opción expande el tamaño de la
tabla de modo que cubra todo el formulario.

Establezca la propiedad CellBorderStyle en Inserción. Este valor proporciona

los bordes visuales entre cada celda del tablero.
 Seleccione el botón del triángulo situado en la esquina superior derecha de
TableLayoutPanel para mostrar su menú de tareas. En el menú de tareas,
seleccione Agregar fila dos veces para agregar dos filas más. Luego,
seleccione Agregar columna dos veces para agregar dos columnas más.

En el menú de tareas, seleccione Editar filas y columnas para abrir la ventana

Estilos de columna y fila. Para cada columna, seleccione la opción Porcentaje
y, luego, establezca el ancho de cada columna en el 25 por ciento.

Seleccione Filas en la lista que aparece en la parte superior de la ventana y,

luego, establezca el alto de cada fila en el 25 por ciento.

Cuando termine, seleccione Aceptar para guardar los cambios.

TableLayoutPanel ahora es una cuadrícula de cuatro por cuatro con 16 celdas cuadradas
del mismo tamaño. Más adelante, los iconos aparecerán en estas filas y columnas.
Incorporación y formato de etiquetas para
mostrar
En esta sección, creará etiquetas para mostrar durante el juego y les dará formato.

1. Asegúrese de que el control TableLayoutPanel esté seleccionado en el editor de

formularios. Debería ver tableLayoutPanel1 en la parte superior de la ventana
Propiedades. Seleccione TableLayoutPanel en el formulario si todavía no está
seleccionado, o hágalo en la lista que se encuentra en la parte superior de la
ventana Propiedades.

2. Como lo hizo antes, abra el cuadro de herramientas y, luego, abra la categoría

Controles comunes. Agregue un control Label a la celda superior izquierda de
TableLayoutPanel. Ahora, el control Label está seleccionado en el IDE. Establezca
las siguientes propiedades para el control.

Establezca la propiedad BackColor de la etiqueta en CornflowerBlue.

Establezca la propiedad AutoSize en False.
Establezca la propiedad Dock en Fill.
Establezca la propiedad TextAlign en MiddleCenter. Para ello, elija el botón
de lista desplegable que se encuentra al lado de la propiedad y, luego,
seleccione el botón central. Este valor garantiza que el icono aparecerá en el
centro de la celda.
Seleccione la propiedad Font. Aparece un botón de puntos suspensivos ( … ).
Seleccione el botón de puntos suspensivos y establezca el valor de Fuente en
Webdings, el Estilo de fuente en Negrita y el Tamaño en 48.
Establezca la propiedad Text de la etiqueta en la letra c.

La celda superior izquierda de TableLayoutPanel ahora contiene un cuadro negro

centrado sobre un fondo azul.

７ Nota

La fuente Webdings es una fuente de iconos que se distribuye con el sistema

operativo Windows. En el juego de formar parejas, el jugador forma parejas
de iconos. Esta fuente muestra los iconos para formar parejas.

En lugar de c, pruebe con distintas letras en la propiedad Text. Un signo de

exclamación es una araña, una N mayúscula es un ojo y una coma es una
guindilla.
 3. Seleccione el control Label y cópielo en la celda siguiente en TableLayoutPanel.
Seleccione las teclas Ctrl+C o, en la barra de menús, Editar>Copiar. Luego,
péguelo con Ctrl+V o con Editar>Pegar.

Una copia de la primera etiqueta aparece en la segunda celda de

TableLayoutPanel. Vuelva a pegar el control; aparecerá otra etiqueta en la tercera
celda. Siga pegando los controles Label hasta que se llenen todas las celdas.

Con este paso se completa el diseño del formulario.

Pasos siguientes
Vaya al tutorial siguiente para aprender a asignar un icono aleatorio a cada etiqueta y
agregar controladores de eventos a las etiquetas.

Incorporación de iconos al juego de formar parejas

Tutorial: Incorporación de iconos a la
aplicación de WinForms del juego de
formar parejas
Artículo • 24/03/2023 • Tiempo de lectura: 8 minutos

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta serie de cuatro tutoriales, creará un juego de formar parejas en el que el usuario
que juegue formará parejas de iconos ocultos.

En el juego, un jugador selecciona un cuadrado para ver un icono y, luego, elige otro
cuadrado. Si los iconos coinciden, permanecen visibles. Si no es así, el juego los oculta.
En este tutorial, asignará iconos a las etiquetas de manera aleatoria. Establece que estén
ocultos y que se muestren al seleccionarlos.

En este segundo tutorial, obtendrá información sobre cómo hacer lo siguiente:

＂ Agregar un objeto aleatorio y una lista de iconos

＂ Asignar un icono aleatorio a cada etiqueta
＂ Agregar controladores de eventos que muestren iconos a las etiquetas

Requisitos previos
Este tutorial se basa en el tutorial anterior, Creación de una aplicación de juego para
formar parejas. Si no ha realizado ese tutorial, revíselo primero.

Agregar un objeto aleatorio y una lista de

iconos
En esta sección, creará un conjunto de símbolos para formar parejas en el juego. Cada
símbolo se agrega a dos celdas aleatorias del elemento TableLayoutPanel en el
formulario.

Use las instrucciones new para crear dos objetos. El primero es un objeto Random que
elige celdas en TableLayoutPanel de manera aleatoria. El segundo es un objeto List<T>,
que almacena los símbolos elegidos aleatoriamente.

1. Abra Visual Studio. El proyecto MatchingGame aparece en Abrir recientes.

 2. Seleccione Form1.cs si utiliza C#, o bien Form1.vb si usa Visual Basic. Luego,
seleccione Ver>Código. Como alternativa, seleccione la tecla F7 o haga doble clic
en Form1. El IDE de Visual Studio muestra el módulo de código para Form1.

3. En el código existente, agregue el siguiente código.

C#

C#

public partial class Form1 : Form

{
// Use this Random object to choose random icons for the
squares
Random random = new Random();

// Each of these letters is an interesting icon

// in the Webdings font,
// and each icon appears twice in this list
List<string> icons = new List<string>()
{
"!", "!", "N", "N", ",", ",", "k", "k",
"b", "b", "v", "v", "w", "w", "z", "z"
};

） Importante

Use el control del lenguaje de programación situado en la parte superior derecha

de esta página para ver el fragmento de código de C# o el de Visual Basic.

Si usa C#, asegúrese de que coloca el código detrás de la llave de apertura y justo
detrás de la declaración de clase ( public partial class Form1 : Form ). Si usa Visual
Basic, coloque el código justo detrás de la declaración de clase ( Public Class Form1 ).
Puede utilizar objetos de lista para realizar un seguimiento de tipos de elementos
distintos. Una lista puede contener números, valores true/false, texto u otros objetos. En
el juego de formar parejas, el objeto de lista tiene 16 cadenas, una para cada celda del
panel TableLayoutPanel. Cada cadena es una sola letra que corresponde a los iconos de
las etiquetas. Estos caracteres aparecen en la fuente Webdings como un bus, una
bicicleta y muchos otros.

７ Nota

Las listas pueden reducir y crecer según sea necesario, algo que es importante en
este programa.

Para más información sobre las listas, consulte List<T>. Si desea ver un ejemplo en C#,
consulte Un ejemplo de lista básico. Si desea ver un ejemplo en Visual Basic, consulte
Uso de una colección Simple.

Asignar un icono aleatorio a cada etiqueta

Cada vez que ejecuta el programa, este asigna los iconos aleatoriamente a los controles
de etiqueta del formulario a través de un método AssignIconsToSquares() . Este código
usa la palabra clave foreach en C# o For Each en Visual Basic.

1. Agregue el método AssignIconsToSquares() .

C#

C#

/// <summary>
/// Assign each icon from the list of icons to a random square
/// </summary>
private void AssignIconsToSquares()
{
// The TableLayoutPanel has 16 labels,
// and the icon list has 16 icons,
// so an icon is pulled at random from the list
// and added to each label
foreach (Control control in tableLayoutPanel1.Controls)
{
Label iconLabel = control as Label;
if (iconLabel != null)
{
int randomNumber = random.Next(icons.Count);
iconLabel.Text = icons[randomNumber];
// iconLabel.ForeColor = iconLabel.BackColor;
 icons.RemoveAt(randomNumber);
}
}
}

Puede escribir este código justo debajo del que agregó en la sección anterior.

７ Nota

Una de las líneas está marcada como comentario a propósito. La agregará más
adelante en este procedimiento.

El método AssignIconsToSquares() recorre en iteración cada control de etiqueta en

TableLayoutPanel. Ejecuta las mismas instrucciones para cada uno de ellos. Las
instrucciones extraen un icono aleatorio de la lista.

La primera línea convierte la variable control en una etiqueta denominada

iconLabel.
La segunda línea es una instrucción if que comprueba que la conversión
funcionó. Si la conversión funciona, se ejecutan las instrucciones de la instrucción
if .

La primera línea de la instrucción if crea una variable denominada

randomNumber que contiene un número aleatorio que se corresponde con uno
de los elementos de la lista de iconos. Usa el método Next() del objeto Random. El
método Next devuelve el número aleatorio. Esta línea también utiliza la propiedad
Count de la lista de iconos para determinar el intervalo en el que se elige el
número aleatorio.
La línea siguiente asigna uno de los elementos de la lista de iconos a la propiedad
Text de la etiqueta.
La línea siguiente oculta los iconos. La línea aquí está marcada como comentario
para que pueda comprobar el resto del código antes de continuar.
La última línea de la instrucción if quita el icono que se agregó al formulario de la
lista.

1. Agregue una llamada al método AssignIconsToSquares() al constructor de Form1.

Este método rellena con iconos el tablero de juego. Se llama a los constructores
cuando se crea un objeto.

C#
 public Form1()
{
InitializeComponent();

AssignIconsToSquares();
}

Para Visual Basic, agregue la llamada de método AssignIconsToSquares() al

método Form1_Load .

VB

Private Sub Form1_Load(sender As Object, e As EventArgs) Handles

MyBase.Load
AssignIconsToSquares()
End Sub

Para más información, consulte Constructores (guía de programación de C#) o

Utilizar constructores y destructores.

2. Guarde el programa y ejecútelo. Ahora, debería mostrar un formulario con iconos

aleatorios asignados a cada etiqueta.

 Sugerencia

Si los iconos de Webdings no se muestran correctamente en el formulario,

establezca la propiedad UseCompatibleTextRendering de etiquetas del
formulario en True.

3. Cierre el programa y, a continuación, ejecútelo de nuevo. Se asignan iconos

diferentes a cada etiqueta.
 Los iconos se muestran visibles ahora porque no los ha ocultado. Para ocultárselos
al jugador, establezca la propiedad ForeColor de cada etiqueta en el mismo color
que su propiedad BackColor.

4. Detenga el programa. Quite las marcas de comentario de la línea de código

comentada dentro del bucle.

C#

C#

iconLabel.ForeColor = iconLabel.BackColor;

Si vuelve a ejecutar el programa, parecerá que los iconos desaparecieron. Solo

aparecerá un fondo azul. Los iconos se asignan de manera aleatoria y siguen ahí.
Incorporación de controlador de eventos a las
etiquetas
En este juego de formar parejas, un jugador revela un icono oculto y luego otro. Si los
iconos coinciden, permanecen visibles. En caso contrario, se vuelven a ocultar.

Para que el juego funcione de esta manera, agregue un controlador de eventos Click
que cambie el color de la etiqueta elegida para que coincida con el fondo.

1. Abra el formulario en el Diseñador de Windows Forms. Seleccione Form1.cs o

Form1.vb y, luego, Ver>Diseñador.

2. Elija el primer control de etiqueta para seleccionarlo y haga doble clic en él para
agregar un controlador de eventos Click denominado label1 _Click() al código.

3. Después, mantenga presionada la tecla Ctrl mientras selecciona cada una de las
otras etiquetas. Asegúrese de que todas las etiquetas están seleccionadas.

4. En la ventana Propiedades, seleccione el botón Eventos, que aparece como un

rayo. Para el evento Clic, seleccione label1_Click en el cuadro.

5. Presione la tecla Entrar. El IDE agrega un controlador de eventos Click

denominado label1 _Click() al código. Como seleccionó todas las etiquetas, el
controlador se enlazará a cada una de las etiquetas.

6. Rellene el resto del código.

C#

C#
 /// <summary>
/// Every label's Click event is handled by this event handler
/// </summary>
/// <param name="sender">The label that was clicked</param>
/// <param name="e"></param>
private void label1_Click(object sender, EventArgs e)
{
Label clickedLabel = sender as Label;

if (clickedLabel != null)
{
// If the clicked label is black, the player clicked
// an icon that's already been revealed --
// ignore the click
if (clickedLabel.ForeColor == Color.Black)
return;

clickedLabel.ForeColor = Color.Black;
}
}

７ Nota

Si copia y pega el bloque label1_Click() de código, en lugar de escribirlo

manualmente, asegúrese de reemplazar el código label1_Click() existente. De lo
contrario, se encontrará con un bloque de código duplicado.

Seleccione Depurar>Iniciar depuración para ejecutar el programa. Debería ver un

formulario vacío con un fondo azul. Elija cualquiera de las celdas del formulario. Debería
mostrarse uno de los iconos. Siga eligiendo distintas partes del formulario. A medida
que elija los iconos, estos deberían mostrarse.
Pasos siguientes
Pase al tutorial siguiente para aprender a cambiar las etiquetas con un temporizador.

Uso de un temporizador en el juego para formar parejas

Tutorial: Incorporación de variables de
referencia y un control de temporizador
a la aplicación de WinForms para un
juego de formar parejas
Artículo • 24/03/2023 • Tiempo de lectura: 10 minutos

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta serie de cuatro tutoriales, creará un juego de formar parejas en el que el usuario
que juegue formará parejas de iconos ocultos.

El programa del juego de formar parejas necesita realizar un seguimiento de los

controles Label que elige el jugador. Después de que un jugador elige la primera
etiqueta, el programa debe mostrar el icono. Una vez elegida la segunda etiqueta, el
programa debe mostrar ambos iconos durante un período breve. Luego, los oculta.

El programa hace un seguimiento de la etiqueta que eligió en primer y segundo lugar

mediante las variables de referencia. Un temporizador oculta los iconos y controla
cuánto tiempo se muestran los iconos.

＂ Agregar referencias de etiqueta.

＂ Agregar un temporizador.

Requisitos previos
Este tutorial se basa en los tutoriales anteriores Creación de una aplicación de juego de
formar parejas e Incorporación de iconos al juego de formar parejas. Complete primero
esos tutoriales.

Agregar referencias a etiquetas

En esta sección, agregará dos variables de referencia al código. Hacen seguimiento de
los objetos Label o hacen referencia a ellos.

1. Para agregar referencias de etiqueta a un formulario, use el siguiente código.

C#
 public partial class Form1 : Form
{
// firstClicked points to the first Label control
// that the player clicks, but it will be null
// if the player hasn't clicked a label yet
Label firstClicked = null;

// secondClicked points to the second Label control

// that the player clicks
Label secondClicked = null;

） Importante

Use el control del lenguaje de programación situado en la parte superior derecha

de esta página para ver el fragmento de código de C# o el de Visual Basic.

Estas instrucciones no hacen que los controles Label aparezcan en el formulario porque
no hay ninguna palabra clave new . Cuando se inicia el programa, tanto firstClicked
como secondClicked se establecen en null para C# o en Nothing para Visual Basic.

2. Modifique el controlador de eventos Click para usar la nueva variable de referencia

firstClicked . Quite la última instrucción del método de controlador de eventos

label1_Click() ( clickedLabel.ForeColor = Color.Black; ) y reemplácela por la

instrucción if , tal como se indica a continuación.

C#

/// <summary>
/// Every label's Click event is handled by this event handler
/// </summary>
/// <param name="sender">The label that was clicked</param>
/// <param name="e"></param>
 private void label1_Click(object sender, EventArgs e)
{
Label clickedLabel = sender as Label;

if (clickedLabel != null)
{
// If the clicked label is black, the player clicked
// an icon that's already been revealed --
// ignore the click
if (clickedLabel.ForeColor == Color.Black)
return;

// If firstClicked is null, this is the first icon

// in the pair that the player clicked,
// so set firstClicked to the label that the player
// clicked, change its color to black, and return
if (firstClicked == null)
{
firstClicked = clickedLabel;
firstClicked.ForeColor = Color.Black;

return;
}
}
}

3. Guarde y ejecute el programa. Elija uno de los controles de etiqueta y aparecerá el

correspondiente icono. Elija el siguiente control de etiqueta y verá que no sucede
nada.
 Solo aparece el primer icono elegido. Los demás iconos son invisibles.

El programa ya realiza un seguimiento de la primera etiqueta que eligió el jugador. La

referencia firstClicked no es null en C# ni Nothing en Visual Basic. Cuando la
instrucción if encuentra que firstClicked no es igual que null o Nothing , ejecuta las
instrucciones.

Agregar un temporizador
La aplicación Juego coincidente usa un control Timer. Un temporizador espera y luego
desencadena un evento, lo que se conoce como tic. Un temporizador puede iniciar una
acción o repetir una de manera periódica.

En el programa, el temporizador permite que un jugador elija dos iconos. Si los iconos
no coinciden, oculta ambos iconos nuevamente después de un período breve.

1. Seleccione la pestaña Cuadro de herramientas y, en la categoría Componentes,

haga doble clic en el componente Temporizador o arrástrelo al formulario. El
icono de temporizador, timer1, aparece en un espacio debajo del formulario.
2. Seleccione el icono Timer1 para seleccionar el temporizador. En la ventana
Propiedades, seleccione el botón Propiedades para ver las propiedades.

3. Establezca la propiedad Interval en 750, que se refiere a 750 milisegundos.

La propiedad Interval indica al temporizador cuánto tiempo debe esperar entre los
tics cuando desencadena el evento Tick. El programa llama al método Start() para
iniciar el temporizador después de que el jugador elige la segunda etiqueta.

4. Elija el icono del control de temporizador y, luego, presione ENTRAR o haga doble
clic en el temporizador. El IDE agrega un controlador de eventos Tic vacío.
Reemplace el código por el siguiente código.

C#

/// <summary>
/// This timer is started when the player clicks
/// two icons that don't match,
/// so it counts three quarters of a second
/// and then turns itself off and hides both icons
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void timer1_Tick(object sender, EventArgs e)
{
// Stop the timer
timer1.Stop();

// Hide both icons

firstClicked.ForeColor = firstClicked.BackColor;
secondClicked.ForeColor = secondClicked.BackColor;

// Reset firstClicked and secondClicked

// so the next time a label is
// clicked, the program knows it's the first click
 firstClicked = null;
secondClicked = null;
}

El controlador de eventos Tic realiza tres operaciones:

Se asegura de que el temporizador no está en marcha mediante una llamada al

método Stop().
Usa las dos variables de referencia, firstClicked y secondClicked , para ocultar de
nuevo los iconos de las dos etiquetas que el jugador eligió.
Restablece las variables de referencia firstClicked y secondClicked a null en C#
y Nothing en Visual Basic.

5. Vaya al editor de código y agregue código al principio y al final del método de

controlador de eventos label1_Click() . Este código comprobará si el
temporizador está habilitado, establecerá la variable de referencia secondClicked e
iniciará el temporizador. El método de controlador de eventos label1_Click()
ahora tiene el siguiente aspecto:

C#

/// <summary>
/// Every label's Click event is handled by this event handler
/// </summary>
/// <param name="sender">The label that was clicked</param>
/// <param name="e"></param>
private void label1_Click(object sender, EventArgs e)
{
// The timer is only on after two non-matching
// icons have been shown to the player,
// so ignore any clicks if the timer is running
if (timer1.Enabled == true)
return;

Label clickedLabel = sender as Label;

if (clickedLabel != null)
{
// If the clicked label is black, the player clicked
// an icon that's already been revealed --
// ignore the click
if (clickedLabel.ForeColor == Color.Black)
return;

// If firstClicked is null, this is the first icon

// in the pair that the player clicked,
 // so set firstClicked to the label that the player
// clicked, change its color to black, and return
if (firstClicked == null)
{
firstClicked = clickedLabel;
firstClicked.ForeColor = Color.Black;
return;
}

// If the player gets this far, the timer isn't

// running and firstClicked isn't null,
// so this must be the second icon the player clicked
// Set its color to black
secondClicked = clickedLabel;
secondClicked.ForeColor = Color.Black;

// If the player gets this far, the player

// clicked two different icons, so start the
// timer (which will wait three quarters of
// a second, and then hide the icons)
timer1.Start();
}
}

El código que se encuentra al principio del método comprueba si el temporizador

se ha iniciado comprobando el valor de la propiedad Enabled. Si el jugador elige el
primer y segundo control Label y se inicia el temporizador, no sucederá nada al
elegir un tercer control.
El código de la parte inferior del método establece la variable de referencia
secondClicked para realizar un seguimiento del segundo control Label. Luego,
establece el color del icono de esa etiqueta en negro para que sea visible. A
continuación, inicia el temporizador en modo de un disparo de forma que espere
750 milisegundos antes de desencadenar un tic único. El controlador de eventos
Tic del temporizador oculta los dos iconos y restablece las variables de referencia
firstClicked y secondClicked . El formulario está listo para que el jugador elija
otro par de iconos.

７ Nota

Si copia y pega el bloque label1_Click() de código, en lugar de escribirlo

manualmente, asegúrese de reemplazar el código label1_Click() existente. De lo
contrario, se encontrará con un bloque de código duplicado.
 6. Guarde y ejecute el programa. Seleccione un cuadrado y el icono se volverá visible.
Elija otro cuadrado. El icono aparece brevemente y, a continuación, ambos iconos
desaparecen.

El programa ahora realiza un seguimiento del primer y segundo icono que elija. Usa el
temporizador para hacer una pausa antes de hacer que los iconos desaparezcan.

Pasos siguientes
Pase al tutorial siguiente para aprender a finalizar el juego de formar parejas.

Visualización de un mensaje de felicitaciones para el juego de formar parejas

Tutorial: Visualización de un mensaje en
la aplicación de WinForms del juego de
formar parejas
Artículo • 24/03/2023 • Tiempo de lectura: 7 minutos

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta serie de cuatro tutoriales, creará un juego de formar parejas en el que el usuario
que juegue formará parejas de iconos ocultos.

En este tutorial, revisará el juego de formar parejas para mantener visibles las parejas
formadas y para mostrar un mensaje de felicitaciones cuando un jugador gana.

En este tutorial, aprenderá a:

＂ Mantener visibles los pares

＂ Comprobar si un jugador ganó
＂ Probar otras características

Requisitos previos
Este tutorial se basa en estos tutoriales anteriores:

1. Creación de una aplicación de juego para formar parejas (C#)

2. Incorporación de iconos al juego de formar parejas
3. Incorporación de un temporizador en el juego para formar parejas

Mantener visibles los pares

Cuando un jugador forma una pareja, el juego debe restablecerse para que ya no realice
un seguimiento de las etiquetas que utilizan las variables de referencia firstClicked y
secondClicked . No debe restablecer los colores de las dos etiquetas que coincidieron.
Esas etiquetas se siguen mostrando.

1. Agregue la instrucción if siguiente al método del controlador de eventos

label_Click() . Colóquela cerca del final del código justo por encima de la
instrucción en la que se inicia el temporizador.

C#
 // If the player gets this far, the timer isn't
// running and firstClicked isn't null,
// so this must be the second icon the player clicked
// Set its color to black
secondClicked = clickedLabel;
secondClicked.ForeColor = Color.Black;

// If the player clicked two matching icons, keep them

// black and reset firstClicked and secondClicked
// so the player can click another icon
if (firstClicked.Text == secondClicked.Text)
{
firstClicked = null;
secondClicked = null;
return;
}

// If the player gets this far, the player

// clicked two different icons, so start the
// timer (which will wait three quarters of
// a second, and then hide the icons)
timer1.Start();
}
}

） Importante

Use el control del lenguaje de programación situado en la parte superior derecha

de esta página para ver el fragmento de código de C# o el de Visual Basic.

La instrucción if comprueba si el icono de la primera etiqueta que eligió el jugador es

igual que el icono de la segunda etiqueta. Si los iconos son iguales, el programa ejecuta
las tres instrucciones. Las dos primeras instrucciones restablecen las variables de
referencia firstClicked y secondClicked . Ya no realizan un seguimiento de ninguna de
las etiquetas. La tercera es una instrucción return que omite el resto de las
instrucciones del método sin ejecutarlas.
 2. Ejecute el programa y, luego, empiece a elegir cuadrados del formulario.

Si elige una pareja que no coincide, se desencadena el evento Tic del temporizador y
ambos iconos desaparecen.

Si elige una pareja que coincide, se ejecuta la instrucción if nueva. La instrucción

"return" hace que el método omita el código que inicia el temporizador. Los iconos
permanecen visibles.

Comprobación de si un jugador ganó

Creó un juego divertido, el que debe terminar una vez que un jugador gana. En esta
sección, se agrega un método para comprobar si el jugador ganó.

1. Agregue un método CheckForWinner() al final del código, debajo del controlador

de eventos timer1_Tick() .

C#
 /// <summary>
/// Check every icon to see if it is matched, by
/// comparing its foreground color to its background color.
/// If all of the icons are matched, the player wins
/// </summary>
private void CheckForWinner()
{
// Go through all of the labels in the TableLayoutPanel,
// checking each one to see if its icon is matched
foreach (Control control in tableLayoutPanel1.Controls)
{
Label iconLabel = control as Label;

if (iconLabel != null)
{
if (iconLabel.ForeColor == iconLabel.BackColor)
return;
}
}

// If the loop didn’t return, it didn't find

// any unmatched icons
// That means the user won. Show a message and close the form
MessageBox.Show("You matched all the icons!", "Congratulations");
Close();
}

El método utiliza otro bucle foreach en C# o For Each en Visual Basic para recorrer
cada etiqueta de TableLayoutPanel. Comprueba el color del icono de cada etiqueta para
ver si coincide con el fondo. Si los colores coinciden, el icono sigue siendo invisible y el
jugador no ha hallado las parejas de los iconos restantes.

En ese caso, el programa utiliza una instrucción return para omitir el resto del método.
Si el bucle pasa por todas las etiquetas sin ejecutar la instrucción return , indica que se
han logrado hallar todas las parejas de iconos del formulario. El programa muestra un
elemento MessageBox para felicitar al jugador que ganó y, luego, llama al método
Close() para finalizar el juego.

2. Haga que el controlador de eventos CheckForWinner() de la etiqueta llame al

método Click nuevo.

C#

// If the player gets this far, the timer isn't

// running and firstClicked isn't null,
// so this must be the second icon the player clicked
// Set its color to black
 secondClicked = clickedLabel;
secondClicked.ForeColor = Color.Black;

// Check to see if the player won

CheckForWinner();

// If the player clicked two matching icons, keep them

// black and reset firstClicked and secondClicked
// so the player can click another icon
if (firstClicked.Text == secondClicked.Text)
{
firstClicked = null;
secondClicked = null;
return;
}

Asegúrese de que el programa comprueba si existe un ganador inmediatamente

después de mostrar el segundo icono que el jugador elige. Busque la línea en la que
estableció el color del segundo icono elegido y llame al método CheckForWinner() que
aparece inmediatamente después de dicha línea.

3. Guarde y ejecute el programa. Reproduzca el juego y halle las coincidencias de

todos los iconos. Cuando gane, el programa mostrará un mensaje de felicitaciones.
 Una vez que selecciona Aceptar, se cierra el juego de formar parejas.

Probar otras características

El juego de formar parejas se completó. Puede agregar más características al juego para
que sea más complicado e interesante. Estas son algunas opciones.

Reemplace los iconos y colores con los que prefiera.

Observe la propiedad ForeColor de la etiqueta.

Agregue un temporizador de juego que mida el tiempo que necesita el jugador

para ganar.

Puede agregar una etiqueta para mostrar el tiempo transcurrido en el formulario.

Colóquela sobre TableLayoutPanel. Agregue otro temporizador al formulario para
realizar un seguimiento del tiempo. Utilice el código para iniciar el temporizador
cuando el jugador inicie el juego, y detenga el temporizador después de que
coincidan los dos iconos.
 Agregue un sonido para cuando el jugador encuentre una coincidencia, otro
sonido para cuando destape dos iconos que no coincidan y un tercer sonido para
cuando el programa vuelva a ocultar los iconos.

Para reproducir sonido, use el espacio de nombres System.Media. Para más

información, vea los vídeos Play sounds in Windows Forms app (C#) (Reproducir
sonidos en la aplicación de Windows Forms [C#]) o How to play audio in Visual
Basic (Cómo reproducir audio en Visual Basic).

Aumente el tamaño del tablero para complicar más el juego.

No basta con solo agregar filas y columnas a TableLayoutPanel. También debe

tener en cuenta el número de iconos que crea.

Para que el juego sea más complicado, oculte el primer icono si el jugador es
demasiado lento para responder.

Pasos siguientes
Felicidades. Ya completó esta serie de tutoriales. Realizó estas tareas de programación y
diseño en el IDE de Visual Studio:

Almacenó objetos, como iconos, en una lista.

Usó un bucle en C# o Visual Basic para recorrer una lista en iteración.
Realizó el seguimiento del estado mediante variables de referencia.
Creó un controlador de eventos para responder a eventos de varios objetos.
Agregó un temporizador que lleva una cuenta regresiva y desencadena un evento.

Pase a este artículo para profundizar en el Diseñador de Windows Forms.

Tutorial: Introducción a Diseñador de Windows Forms

Tutorial: Abrir un proyecto desde un
repositorio
Artículo • 08/05/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En este tutorial, usará Visual Studio para conectarse a un repositorio por primera vez,
clonarlo y, después, abrir un proyecto desde él.

Si todavía no ha instalado Visual Studio, vaya a la página de descargas de Visual

Studio para instalarlo de forma gratuita.

Apertura de un proyecto desde un repositorio

de GitHub
Visual Studio facilita la apertura de un proyecto desde un repositorio. Puede hacerlo al
iniciar Visual Studio, o bien directamente desde el IDE de Visual Studio.

Esta es la manera de hacerlo.

Uso de la ventana de inicio

1. Abra Visual Studio.

2. En la ventana de inicio, seleccione Clonar un repositorio.

3. Especifique o escriba la ubicación del repositorio y seleccione el botón Clonar.

4. Es posible que se le solicite su información de inicio de sesión en el cuadro de

diálogo Información de usuario de GIT. Puede agregar su información o editar la
información predeterminada que se proporciona.
 Seleccione Guardar para agregar la información al archivo global .gitconfig, (O
bien, puede seleccionar Cancelar si quiere agregar la información más adelante).

 Sugerencia

Para más información sobre cómo iniciar sesión en Visual Studio, consulte la
página Iniciar sesión en Visual Studio. Para información específica sobre
cómo usar una cuenta de GitHub para iniciar sesión, consulte la página
Trabajar con cuentas de GitHub en Visual Studio. Si recibe una notificación
de confianza y desea más información al respecto, consulte la página
Configurar la confianza de archivos y carpetas.

Vista de archivos en el Explorador de soluciones

1. Luego, Visual Studio carga las soluciones desde el repositorio mediante la Vista de
carpetas en el Explorador de soluciones.
Para ver una solución en Vista de solución, haga doble clic en el archivo .sln
correspondiente.

También puede seleccionar el botón Cambiar vistas y, luego, seleccionar

Program.cs para ver el código de una solución.
  Sugerencia

La vista predeterminada está establecida en Vista de carpetas. Puede cambiarla a la

Vista de solución en el menú Git. Para ello, seleccione Configuración>Control de
código fuente>Configuración global de Git>Cargar automáticamente la solución
al abrir un repositorio GIT.

Apertura de un proyecto de forma local desde un repositorio de

GitHub clonado anteriormente
1. Abra Visual Studio.

2. En la ventana de inicio, seleccione Abrir un proyecto o una solución.

Visual Studio abre una instancia del Explorador de archivos, donde puede buscar la
solución o el proyecto y seleccionarlos para abrirlos.
  Sugerencia

Si ha abierto el proyecto o la solución recientemente, selecciónelos en la

sección Abrir recientes para abrirlos de nuevo rápidamente.

Ya puede empezar a codificar.

Uso del IDE

También puede utilizar el menú Git o el control Seleccionar repositorio en el IDE de
Visual Studio para interactuar con las carpetas y los archivos de un repositorio.

Esta es la manera de hacerlo.

Para clonar un repositorio y abrir un proyecto

1. En el IDE de Visual Studio, seleccione el menú Git y, luego, Clonar repositorio.
 2. Siga las indicaciones para conectarse al repositorio de Git que incluye los archivos
que está buscando.

Para abrir carpetas y archivos locales

1. En el IDE de Visual Studio, seleccione el menú Git, Repositorios locales y, luego,

Abrir repositorio local.

Puede realizar la misma tarea en el Explorador de soluciones. Para hacerlo, elija el

control Seleccionar repositorio, seleccione el icono de puntos suspensivos que se
encuentra junto al cuadro Filtrar repositorios y, luego, seleccione Abrir repositorio
local.

2. Siga las indicaciones para conectarse al repositorio de Git que tiene los archivos
que está buscando.

Vaya a un repositorio de Azure DevOps

Aquí se muestra cómo navegar a un repositorio de Azure DevOps y clonarlo mediante
Visual Studio.

1. Abra Visual Studio.

2. En la ventana de inicio, seleccione Clonar un repositorio.

3. En la sección Examinar un repositorio, seleccione Azure DevOps.

 4. Siga las indicaciones para clonar un repositorio de Azure DevOps que incluya los
archivos que busca y, a continuación, abra el proyecto.

Pasos siguientes
No dude en profundizar en cualquiera de estos tutoriales específicos del lenguaje:

Tutoriales de Visual Studio | C#

Tutoriales de Visual Studio | Visual Basic
Tutoriales de Visual Studio | C++
Tutoriales de Visual Studio | Python
Tutoriales de Visual Studio | JavaScript, TypeScript y Node.js

Consulte también
Documentación sobre el control de versiones en Visual Studio
Información sobre cómo usar el editor
de código con Visual Basic
Artículo • 19/06/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En esta introducción de 10 minutos al editor de código de Visual Studio, se agrega

código a un archivo para ver algunas de las formas en que Visual Studio hace que
escribir y comprender el código de Visual Basic (así como desplazarse por él) sea más
fácil.

 Sugerencia

Si todavía no ha instalado Visual Studio, vaya a la página de descargas de Visual

Studio para instalarlo de forma gratuita.

En este artículo se da por hecho que ya está familiarizado con Visual Basic. Si no lo está,
le aconsejamos que antes eche un vistazo a un tutorial como Creación de una aplicación
de consola de Visual Basic (VB) sencilla.

 Sugerencia

Para realizar los procedimientos de este artículo, asegúrese de que tiene la

configuración de Visual Basic seleccionada en Visual Studio. Para más información
sobre cómo seleccionar configuraciones del entorno de desarrollo integrado (IDE),
vea Select environment settings (Seleccionar la configuración del entorno).

Crear un archivo de código

Empezaremos creando un archivo y agregándole código.

1. Abra Visual Studio. Presione Esc o seleccione Continuar sin código en la ventana
de inicio para abrir el entorno de desarrollo.

2. En el menú Archivo de la barra de menús, elija Nuevo>Archivo.

3. En el cuadro de diálogo Nuevo archivo, en la categoría General, elija Clase de

Visual Basic y, después, elija Abrir.
 Se abre un archivo nuevo en el editor con el esqueleto de una clase de Visual
Basic. (Ya habrá podido observar que no es necesario crear un proyecto de
Visual Studio completo para aprovechar algunas de las ventajas que ofrece el
editor de código, como el resaltado de sintaxis. Lo único que necesita es un
archivo de código.)

Uso de fragmentos de código

Visual Studio proporciona fragmentos de código muy prácticos que pueden servir para
generar bloques de código de uso común de forma rápida y sencilla. Existen fragmentos
de código disponibles para diferentes lenguajes de programación, como Visual Basic, C#
y C++. Vamos a agregar el fragmento de código Sub de Visual Basic a nuestro archivo.

1. Coloque el cursor encima de la línea End Class y escriba sub.

Aparece un cuadro de diálogo emergente con información sobre la palabra clave

Sub y en el que se indica cómo insertar el fragmento de código Sub.

2. Presione la tecla TAB dos veces para insertar el fragmento de código.

El esquema del procedimiento Sub MySub() se agrega al archivo.

Los fragmentos de código disponibles varían según el lenguaje de programación. Para

ver los fragmentos de código disponibles para Visual Basic, abra el menú contextual que
aparece al hacer clic con el botón derecho en el editor de código y elija Fragmento de
código>Insertar fragmento de código (o presione CTRL+K, CTRL+X). Hay fragmentos
de código de Visual Basic disponibles en las siguientes categorías:

Marcar código como comentario

La barra de herramientas, que es la fila de botones debajo de la barra de menús de
Visual Studio, puede ayudar a mejorar la productividad mientras se codifica. Por
ejemplo, puede activar o desactivar el modo de finalización de IntelliSense, aumentar o
reducir una sangría o marcar como comentario código que no se quiere compilar.
(IntelliSense es una ayuda de codificación que muestra una lista de métodos
coincidentes, entre otras cosas). En esta sección se comenta algún código.

1. Pegue el siguiente código en el cuerpo del procedimiento MySub() .

VB

' _words is a string array that we'll sort alphabetically

Dim _words = New String() {
"the",
"quick",
"brown",
"fox",
"jumps"
}

Dim morewords = New String() {

"over",
"the",
"lazy",
"dog"
}

Dim query = From word In _words

Order By word.Length
Select word
 2. No usaremos la matriz morewords , pero puede que sí lo hagamos más adelante, así
que no la eliminaremos por completo. En su lugar, lo que haremos será convertir
esas líneas en comentarios. Seleccione toda la definición de morewords hasta la
llave de cierre y, luego, seleccione el botón Marcar como comentario las líneas
seleccionadas en la barra de herramientas. Si prefiere usar el teclado, presione
Ctrl+K, Ctrl+C.

El carácter de comentario de Visual Basic ' se agrega al principio de cada línea

seleccionada para marcar el código como comentario.

Contraer bloques de código

Puede contraer secciones de código para centrarse solo en las partes que sean de su
interés. Para practicar, vamos a contraer la matriz _words a una línea de código.
Seleccione el cuadradito gris con el signo menos que se ve en el margen de la línea Dim
_words = New String() { . Si prefiere usar el teclado, coloque el cursor en cualquier lugar

en la definición de matriz y presione Ctrl+M, Ctrl+M.

El bloque de código se contrae para mostrar únicamente la primera línea seguida de un

botón de puntos suspensivos ( ... ). Para expandir el bloque de código de nuevo,
seleccione el mismo cuadro gris (que ahora tiene un signo más), o bien presione
CTRL+M, CTRL+M otra vez. Esta característica se denomina Esquematización y es
especialmente útil cuando se contraen métodos muy largos o clases enteras.

Ver definiciones de símbolos

Gracias al editor de Visual Studio, es muy sencillo inspeccionar la definición de un tipo o
un miembro de clase. Una forma consiste en ir al archivo que contiene la definición, por
ejemplo, seleccionando Ir a definición en cualquier lugar donde se haga referencia al
símbolo. Otra más rápida aún (y que no desplaza el enfoque del archivo en el que está
trabajando) es usar Ver la definición. Vamos a ver la definición del tipo String .

1. Haga clic con el botón derecho en la palabra String y elija Ver la definición en el
menú de contenido. O bien, presione Alt+F12.

Se abrirá una ventana emergente con la definición de la clase String . Puede

desplazarse dentro de la ventana emergente o incluso ver la definición de otro tipo
desde el código inspeccionado.

2. Para cerrar la ventana Ver la definición, seleccione el pequeño cuadro con una "x"
en la esquina superior derecha de la ventana emergente.

Usar IntelliSense para completar palabras

IntelliSense es un recurso impagable cuando se escribe código. Así, puede mostrar
información sobre los miembros disponibles de un tipo o detalles de los parámetros
para las distintas sobrecargas de un método. IntelliSense puede servir también para
completar una palabra después de escribir una serie de caracteres y, así, eliminar
cualquier tipo de ambigüedad. Se va a agregar una línea de código para imprimir las
cadenas ordenadas en la ventana de la consola, que es el lugar estándar para la salida
del programa.

1. Empiece a escribir el siguiente código debajo de la variable query :

VB

For Each str In qu

Verá cómo IntelliSense muestra Información rápida sobre el símbolo query .

 2. Presione Tab para insertar el resto de la palabra query por medio de la
funcionalidad de finalización de palabras de IntelliSense.

3. Termine el bloque de código de modo que se parezca al siguiente código.

VB

For Each str In query

Console.WriteLine(str)
Next

Refactorizar un nombre
Nadie crea código correctamente la primera vez y una de las cosas que probablemente
se tengan que cambiar es el nombre de una variable o un método. Vamos a probar la
funcionalidad de refactorización de Visual Studio para cambiar el nombre de la variable
_words a words .

1. Coloque el cursor sobre la definición de la variable _words , haga clic con el botón
derecho y elija Cambiar nombre en el menú contextual.

Se abre un cuadro de diálogo emergente Cambiar nombre en la parte superior

derecha del editor.

2. Con la variable _words aún seleccionada, escriba el nombre words. Observe que la
referencia a words en la consulta también cambia automáticamente de nombre.
Antes de presionar ENTRAR o Aplicar, active la casilla Incluir comentarios del
cuadro emergente Cambiar nombre.

3. Presione ENTRAR o seleccione Aplicar.

Ambas instancias de words cambian de nombre, así como la referencia a words en

el comentario de código.
Pasos siguientes
Información sobre proyectos y soluciones

Vea también
Fragmentos de código
Navegación en el código
Esquematización
Ir a definición y Ver la definición
Refactorización
Uso de IntelliSense
Compilar y generar en Visual Studio
Artículo • 10/03/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

Para obtener una primera introducción a la compilación dentro del IDE, vea Tutorial:
Compilación de una aplicación.

Puede usar cualquiera de los siguientes métodos para compilar una aplicación: el IDE de
Visual Studio, las herramienta de línea de comandos de MSBuild y Azure Pipelines:

Método de Ventajas
compilación

IDE - Crear compilaciones inmediatamente y probarlas en un depurador.

- Ejecutar compilaciones multiprocesador para proyectos de C++ y C#.
- Personalizar aspectos diferentes del sistema de compilación.

CMake - Compilar proyectos de C++ con la herramienta CMake

- Usar el mismo sistema de compilación en plataformas Windows y Linux.

Línea de - Compilar proyectos sin instalar Visual Studio.

comandos de - Ejecutar compilaciones multiprocesador para todos los tipos de proyecto.
MSBuild - Personalizar la mayoría de las áreas del sistema de compilación.

Azure Pipelines - Automatizar el proceso de compilación como parte de una canalización de

integración continua o entrega continua.
- Aplicar pruebas automatizadas con cada compilación.
- Emplear recursos basados en la nube prácticamente ilimitados para los
procesos de compilación.
- Modificar el flujo de trabajo de compilación y crear actividades de
compilación para realizar tareas muy personalizadas.

La documentación de esta sección analiza en detalle el proceso de compilación basado

en el IDE. Para obtener más información sobre los otros métodos, vea CMake, MSBuild y
Azure Pipelines, respectivamente.

７ Nota

Este tema se aplica a Visual Studio para Windows. En el caso de Visual Studio para
Mac, vea Compilar y generar en Visual Studio para Mac.

Introducción a la compilación desde el IDE

Cuando crea un proyecto, Visual Studio crea las configuraciones de compilación
predeterminadas para el proyecto y la solución que contiene el proyecto. Estas
configuraciones definen cómo se compilan y se implementan las soluciones y los
proyectos. Las configuraciones de proyecto, en concreto, son únicas para una
plataforma de destino (por ejemplo, Windows o Linux) y para un tipo de compilación
(por ejemplo, depuración o publicación). Puede editar estas configuraciones como
quiera y también puede crear sus propias configuraciones según sea necesario.

Para obtener una primera introducción a la compilación dentro del IDE, vea Tutorial:
Compilación de una aplicación.

Después, vea Compilar y limpiar proyectos y soluciones en Visual Studio para obtener
información sobre las diversas personalizaciones que puede llevar a cabo en el proceso.
Entre las personalizaciones se incluyen cambiar los directorios de salida, especificar
eventos de compilación personalizados, administrar dependencias del proyecto,
administrar archivos del registro de compilación y suprimir las advertencias del
compilador.

De ahí en adelante, puede explorar otras tareas:

Descripción de las configuraciones de compilación

Configuración de proyectos para plataformas de destino
Administración de propiedades de soluciones y proyectos
Especificar eventos de compilación en C# y Visual Basic
Establecer las opciones de compilación
Compilar varios proyectos en paralelo

Consulta también
Compilar proyectos de sitios web
Compilar y generar (Visual Studio para Mac)
Proyectos de CMake en Visual Studio
Tutorial: Información sobre cómo
depurar código de Visual Basic con
Visual Studio
Artículo • 19/06/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

En este artículo se describen las características del depurador de Visual Studio en un

tutorial paso a paso. Si quiere ahondar en las características del depurador, vea Primer
vistazo al depurador. Normalmente, depurar una aplicación significa ejecutar la
aplicación con el depurador activado. Al hacerlo, el depurador ofrece muchas formas de
ver lo que hace el código durante la ejecución. Esto permite revisar el código y fijarse en
los valores almacenados en variables, establecer inspecciones en ellas para ver cuándo
cambian los valores, examinar la ruta de ejecución del código, ver si una rama de código
está en funcionamiento, etc. Si esta es la primera vez que intenta depurar código, le
recomendamos que lea Depuración para principiantes sin experiencia antes de
continuar con este artículo.

Aunque la aplicación de demostración está en Visual Basic, la mayoría de las

características son aplicables a C#, C++, F#, Python, JavaScript y otros lenguajes
compatibles con Visual Studio (F# no admite Editar y continuar. F# y JavaScript no son
compatibles con la ventana Automático). Las capturas de pantalla son de Visual Basic.

En este tutorial va a:

＂ Iniciar el depurador y llegar a puntos de interrupción

＂ Conocer los comandos para analizar el código en el depurador
＂ Inspeccionar variables en la información sobre datos y las ventanas del depurador
＂ Examinar la pila de llamadas

Requisitos previos
Debe tener instalados Visual Studio 2019 y la carga de trabajo Desarrollo
multiplataforma de .NET Core.

Si todavía no ha instalado Visual Studio, vaya a la página de descargas de Visual

Studio para instalarlo de forma gratuita.

Si tiene que instalar la carga de trabajo pero ya tiene Visual Studio, vaya a
Herramientas>Obtener herramientas y características… y se abrirá el Instalador de
Visual Studio. Se iniciará el Instalador de Visual Studio. Elija la carga de trabajo
Desarrollo de escritorio de .NET y, luego, seleccione Modificar.

Crear un proyecto
En primer lugar, creará un proyecto de aplicación de consola de .NET Core. En el tipo de
proyecto se incluyen todos los archivos de plantilla que vamos a necesitar, sin necesidad
de agregar nada más.

1. Abra Visual Studio.

Si la ventana de inicio no está abierta, elija Archivo>Ventana de inicio.

2. En la ventana de inicio, elija Crear un proyecto nuevo.

3. En el cuadro de búsqueda de la ventana Crear un proyecto, escriba consola.

Seguidamente, elija Visual Basic en la lista de lenguajes y luego, Windows en la
lista de plataformas.

Después de aplicar los filtros de lenguaje y plataforma, elija la plantilla Aplicación

de consola para .NET Core y luego elija Siguiente.

７ Nota

Si no ve la plantilla Aplicación de consola, puede instalarla desde la ventana

Crear un nuevo proyecto. En el mensaje ¿No encuentra lo que busca? , elija
 el vínculo Instalar más herramientas y características. A continuación, en el
Instalador de Visual Studio, elija la carga de trabajo Desarrollo de escritorio
de .NET.

4. En la ventana Configurar el nuevo proyecto, escriba get-started-debugging en el

cuadro Nombre del proyecto. Después, elija Siguiente.

5. En la ventana Información adicional, asegúrese de que el marco de destino

recomendado es (.NET 6.0) y, después, elija Crear.

Visual Studio se abre en el nuevo proyecto.

Crear la aplicación
1. En Program.vb, reemplace todo el código predeterminado con el siguiente:

VB

Imports System

Class ArrayExample
Public Shared Sub Main()
Dim letters As Char() = {"f"c, "r"c, "e"c, "d"c, " "c, "s"c,
"m"c, "i"c, "t"c, "h"c}
Dim name As String = ""
Dim a As Integer() = New Integer(9) {}

For i As Integer = 0 To letters.Length - 1

name += letters(i)
a(i) = i + 1
SendMessage(name, a(i))
Next

Console.ReadKey()
End Sub

Private Shared Sub SendMessage(ByVal name As String, ByVal msg As

Integer)
Console.WriteLine("Hello, " & name & "! Count to " & msg)
End Sub
End Class

Inicio del depurador

1. Presione F5 (Depurar > Iniciar depuración ) o seleccione el botón verde Iniciar
depuración en la barra de herramientas de depuración.
 Al pulsar F5, la aplicación se inicia con el depurador activado para analizar los
procesos. Como de momento no hemos hecho nada especial para examinar el
código, la aplicación solo se carga y se muestra la salida de la consola.

Símbolo del sistema de Windows

Hello, f! Count to 1
Hello, fr! Count to 2
Hello, fre! Count to 3
Hello, fred! Count to 4
Hello, fred ! Count to 5
Hello, fred s! Count to 6
Hello, fred sm! Count to 7
Hello, fred smi! Count to 8
Hello, fred smit! Count to 9
Hello, fred smith! Count to 10

En este tutorial, analizaremos con más profundidad el uso de esta aplicación junto
con el depurador y veremos las características del depurador.

2. Detenga el depurador; para ello, presione (Mayús + F5) o seleccione el botón rojo
Detener depuración en la barra de herramientas de depuración.

3. En la ventana de consola, presione una tecla para cerrarla.

Establecer un punto de interrupción e iniciar el

depurador
1. En el bucle For de la función Main , establezca un punto de interrupción haciendo
clic en el margen izquierdo de la línea de código siguiente:

name += letters(i)

En el lugar en el que establezca el punto de interrupción aparecerá un círculo rojo.

Los puntos de interrupción son una de las características más básicas y esenciales
de una depuración confiable. Un punto de interrupción indica dónde Visual Studio
debe suspender la ejecución de código para poder echar un vistazo a los valores
de las variables o al comportamiento de la memoria, o determinar si se está
ejecutando o no una bifurcación de código.
 2. Presione F5 (Depurar > Iniciar depuración) o el botón Iniciar depuración en la
barra de herramientas de depuración. La aplicación se inicia y el depurador se
ejecuta en la línea de código en la que ha establecido el punto de interrupción.

La flecha amarilla representa la instrucción en la que el depurador se ha puesto en

pausa, lo cual también suspende la ejecución de la aplicación en el mismo punto
(esta instrucción todavía no se ha ejecutado).

Si la aplicación todavía no se está ejecutando, F5 permite iniciar el depurador, que

se detendrá en el primer punto de interrupción. En caso contrario, F5 permite
continuar ejecutando la aplicación hasta el siguiente punto de interrupción.

Los puntos de interrupción son una característica de utilidad cuando se conoce la

línea o la sección de código que se quiere examinar en detalle. Para obtener
información sobre los diferentes tipos de puntos de interrupción que se pueden
establecer, como los puntos de interrupción condicionales, vea Uso de puntos de
interrupción.

Navegación por el código en el depurador

mediante comandos de varios pasos
En este artículo, usamos métodos abreviados de teclado porque son una buena forma
de ejecutar rápidamente la aplicación en el depurador, pero los comandos equivalentes,
como los comandos de menú, se muestran entre paréntesis.

1. Mientras está en pausa en el bucle For del método Main , presione F11 dos veces
(o bien elija Depurar > Depurar paso a paso por instrucciones) para avanzar a la
llamada al método SendMessage .

Después de presionar F11 dos veces, debería estar en esta línea de código:
 SendMessage(name, a(i))

2. Presione F11 una vez más para entrar en el método SendMessage .

El puntero de color amarillo avanza hasta el método SendMessage .

F11 es el comando Depurar paso a paso por instrucciones y permite avanzar la

ejecución de la aplicación de instrucción en instrucción. F11 es una buena forma de
examinar el flujo de ejecución con más detalle. Más adelante le mostraremos otras
opciones para moverse más rápido por el código. De forma predeterminada, el
depurador omite el código que no es de usuario (si quiere más detalles, vea Solo
mi código).

Imagine que ha terminado de examinar el método SendMessage y quiere salir de él,

pero permanecer en el depurador. Puede hacerlo con el comando Salir de la
depuración.

3. Presione Mayús + F11 (o Depurar > Salir de la depuración).

Este comando reanuda la ejecución de la aplicación (y hace avanzar el depurador)

hasta que se devuelve el método o la función actual.

Debería volver a estar en el bucle For del método Main , detenido en la llamada al
método SendMessage .

4. Presione F11 varias veces hasta que vuelva a la llamada al método SendMessage .

5. Mientras está en pausa en la llamada de método, presione F10 una vez (o bien,
elija Depurar > Paso a paso por procedimientos).

En este caso, tenga en cuenta que el depurador no depura paso a paso por
instrucciones el método SendMessage . F10 hace avanzar el depurador sin depurar
las funciones o los métodos en el código de la aplicación paso a paso por
instrucciones (el código todavía se ejecuta). Al presionar F10 en la llamada de
 método SendMessage (en vez de F11), se omite el código de implementación de
SendMessage (algo que quizás no nos interese en este momento). Para más
información sobre las distintas formas de desplazarse por el código, vea
Navegación por el código en el depurador.

Navegación por el código con Ejecutar hasta

clic
1. Presione F5 para volver a avanzar hasta el punto de interrupción.

2. En el editor de código, desplácese hacia abajo y mantenga el puntero sobre el

método Console.WriteLine del método SendMessage hasta que aparezca el botón
Ejecutar hasta clic de color verde a la izquierda. La información sobre herramientas
del botón muestra "Ejecutar hasta aquí".

3. Seleccione el botón Ejecutar hasta clic.

El depurador avanza hasta el método Console.WriteLine .

Usar este botón es similar a establecer un punto de interrupción temporal. La

característica Ejecutar hasta clic es útil para desplazarse rápidamente por un área
visible del código de la aplicación (puede hacer clic en cualquier archivo abierto).

Reiniciar la aplicación rápidamente

Para reiniciar la aplicación, presione la combinación de teclas Ctrl + Mayús + F5, que le
permite ahorrar tiempo, ya que no es necesario detener la aplicación y reiniciar el
depurador. El depurador se detiene en el primer punto de interrupción que se alcanza al
ejecutar el código.

El depurador se detiene de nuevo en el punto de interrupción que ha establecido antes

dentro del bucle For .

Inspeccionar variables con información sobre

datos
Las características que le permiten inspeccionar las variables son una de las más útiles
del depurador y ofrecen diferentes formas de hacerlo. A menudo, para depurar un
problema, debe intentar averiguar si las variables están almacenando los valores que
espera que tengan en un momento determinado.

1. Mientras está en pausa en la instrucción name += letters[i] , mantenga el mouse

sobre la variable letters y verá su valor predeterminado, el valor del primer
elemento de la matriz "f"c .

2. Después, mantenga el mouse sobre la variable name y verá su valor actual, una
cadena vacía.

3. Presione F5 varias veces (o bien, seleccione Depurar>Continuar) para iterar varias

veces por el bucle For , deténgase de nuevo en el punto de interrupción y
mantenga el mouse sobre la variable name cada vez para comprobar su valor.

El valor de la variable cambia con cada iteración del bucle For y muestra los
valores de f , después, fr , luego, fre , etc.

A menudo, al realizar una depuración, queremos una forma rápida de comprobar

los valores de las propiedades de las variables para ver si se almacenan los valores
correspondientes, y las sugerencias de datos son una buena forma de verlo.

Inspeccionar variables con las ventanas

Automático y Variables locales
1. Vea la ventana Automático, en la parte inferior del editor de código.

Si está cerrada, ábrala mientras está en pausa en el depurador seleccionando

Depurar>Ventanas>Automático.

En la ventana Automático puede ver las variables y su valor actual. En la ventana

Automático se muestran todas las variables que se usan en la línea actual o en la
anterior. Para consultar el comportamiento específico de los lenguajes, vea la
documentación.

2. A continuación, examine la ventana Variables locales en una pestaña situada junto

a la ventana Automático.
 3. Expanda la variable letters para mostrar los elementos que contiene.

En la ventana Variables locales se muestran las variables que se encuentran en el

ámbito actual, es decir, en el contexto de ejecución actual.

Establecer una inspección

1. En la ventana del editor de código principal, haga clic con el botón derecho en la
variable name y elija Agregar inspección.

En la parte inferior del editor de código se abre la ventana Inspección. Puede usar
una ventana Inspección para especificar una variable (o una expresión) que quiera
supervisar.

Ahora, ha establecido una inspección en la variable name y puede ver cómo cambia
su valor según avanza en el depurador. A diferencia de las otras ventanas de
variables, en la ventana Inspección siempre se muestran las variables que está
viendo (y se atenúan cuando están fuera del ámbito).

Examinar la pila de llamadas

1. Mientras esté en pausa en el bucle For , haga clic en la ventana Pila de llamadas,
que se abrirá de forma predeterminada en el panel inferior derecho.

Si está cerrada, ábrala mientras está en pausa en el depurador seleccionando

Depurar>Ventanas>Pila de llamadas.

2. Presione F11 varias veces hasta que vea que el depurador se detiene en el método
SendMessage . Eche un vistazo a la ventana Pila de llamadas.
 En la ventana Pila de llamadas se muestra el orden en el que se llama a los
métodos y las funciones. En la línea superior se muestra la función actual (el
método SendMessage en esta aplicación). En la segunda línea se mostrará que se ha
llamado a SendMessage desde el método Main , y así sucesivamente.

７ Nota

La ventana Pila de llamadas es similar a la perspectiva de depuración de

algunos IDE, como Eclipse.

La pila de llamadas es una buena forma de examinar y entender el flujo de

ejecución de una aplicación.

Puede hacer doble clic en una línea de código para ver ese código fuente. De este
modo, también puede cambiar el ámbito que el depurador va a inspeccionar. Esta
acción no hace avanzar el depurador.

También puede usar los menús contextuales de la ventana Pila de llamadas para
hacer otras cosas. Por ejemplo, puede insertar puntos de interrupción en funciones
especificadas, avanzar el depurador mediante Ejecutar hasta el cursor y examinar
el código fuente. Para obtener más información, vea Cómo: Examinar la pila de
llamadas.

Cambio del flujo de ejecución

1. Presione F11 dos veces para ejecutar el método Console.WriteLine .

2. Con el depurador en pausa en la llamada al método SendMessage , use el mouse

para seleccionar la flecha de color amarillo (el puntero de ejecución) de la
izquierda y moverla una línea hacia arriba, para volver a Console.WriteLine .

3. Presione F11.

El depurador volverá a ejecutar el método Console.WriteLine , lo cual se puede

consultar en la salida de la ventana de la consola.
 Al cambiar el flujo de ejecución, puede, por ejemplo, comprobar las diferentes
rutas de ejecución de código o volver a ejecutar código sin tener que reiniciar el
depurador.

２ Advertencia

A menudo es necesario tener cuidado con esta característica, ya que puede

ser que vea una advertencia en la información en pantalla. También puede ser
que reciba otras advertencias. El hecho de mover el puntero no permite
revertir la aplicación a un estado anterior.

4. Presione F5 para seguir ejecutando la aplicación.

Enhorabuena por completar este tutorial.

Pasos siguientes
En este tutorial, ha aprendido a iniciar el depurador, a ejecutar el código paso a paso y a
inspeccionar variables. Puede ser que le interese analizar las características del
depurador con más detenimiento, así como consultar los vínculos disponibles con más
información.

Primer vistazo al depurador

Introducción a las pruebas unitarias
Artículo • 19/06/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

Use Visual Studio para definir y ejecutar pruebas unitarias para conservar el estado del
código, garantizar la cobertura del código y detectar errores y fallos antes de que lo
hagan los clientes. Ejecute las pruebas unitarias con frecuencia para asegurarse de que
el código funciona correctamente.

En este artículo, el código usa C# y C++, las ilustraciones están en C#, pero los
conceptos y las características se aplican a los lenguajes .NET, C++, Python, JavaScript y
TypeScript.

Crear pruebas unitarias

En esta sección se describe cómo crear un proyecto de prueba unitaria.

1. Abra el proyecto que quiere probar en Visual Studio.

Para los fines de demostración de una prueba unitaria de ejemplo, en este artículo
se prueba un proyecto de C# o C++ sencillo denominado HelloWorld. El código
de ejemplo para dicho proyecto es el siguiente:

.NET

namespace HelloWorld
{
public class Program
{
public static void Main()
{
Console.WriteLine("Hello World!");
}
}
}

2. En el Explorador de soluciones, seleccione el nodo de la solución. Después, en la

barra de menús superior, seleccione Archivo>Agregar>Nuevo proyecto.

3. Cuadro de diálogo del nuevo proyecto, busque el proyecto de la prueba unitaria

que se va a usar.
Escriba prueba en el cuadro de búsqueda para buscar una plantilla de proyecto de
prueba unitaria para el marco de pruebas que quiera usar, como MSTest (C#) o el
proyecto de prueba unitaria (C++), y selecciónela.

A partir de la versión 14.8 de Visual Studio 2017, los lenguajes de .NET incluyen
plantillas integradas para NUnit y xUnit. Para C++, en este ejemplo, seleccione el
proyecto Native Unit Test que usa Microsoft Native Unit Test Framework. (Para
usar otro marco de pruebas de C++, vea Escribir pruebas unitarias para C/C++).
Para Python, consulte el artículo Configuración de pruebas unitarias para código
de Python para configurar el proyecto de prueba.

 Sugerencia

Solo para C#, puede crear proyectos de prueba unitaria a partir del código
con un método más rápido. Para obtener más información, vea Crear
proyectos de prueba unitaria y métodos de prueba. Para usar este método
con .NET Core o .NET Standard, se requiere Visual Studio 2019 o versiones
posteriores.

En la ilustración siguiente se muestra una prueba unitaria de MSTest que es

compatible con .NET.

Haga clic en Siguiente, elija un nombre para el proyecto de prueba y luego haga
clic en Crear.
 El proyecto se agrega a la solución.

4. En el proyecto de prueba unitaria, agregue una referencia al proyecto que quiere

probar haciendo clic con el botón derecho en Referencias o Dependencias y luego
elija Agregar referencia o Agregar referencia de proyecto.

5. Seleccione el proyecto que contiene el código que va a probar y haga clic en

Aceptar.

6. Agregue código al método de prueba unitaria.

Por ejemplo, puede usar el siguiente código mediante la selección de la pestaña

de documentación correcta para su marco de pruebas: MSTest, NUnit o xUnit (solo
 se admiten en .NET) o C++ Microsoft Native Unit Test Framework.

MSTest

using Microsoft.VisualStudio.TestTools.UnitTesting;
using System.IO;
using System;

namespace HelloWorldTests
{
[TestClass]
public class UnitTest1
{
private const string Expected = "Hello World!";
[TestMethod]
public void TestMethod1()
{
using (var sw = new StringWriter())
{
Console.SetOut(sw);
HelloWorld.Program.Main();

var result = sw.ToString().Trim();

Assert.AreEqual(Expected, result);
}
}
}
}

Ejecutar pruebas unitarias

1. Abra el Explorador de pruebas.

Para abrir el Explorador de pruebas, elija Probar>Explorador de pruebas en la

barra de menús superior (o presione CTRL + E, T).

2. Haga clic en Ejecutar todas (o presione CTRL + R, V) para ejecutar las pruebas
unitarias.
 Cuando se hayan completado las pruebas, una marca de verificación verde indica
que una prueba se superó. Un icono "x" rojo indica que una prueba no se superó.

 Sugerencia

Puede usar el Explorador de pruebas para ejecutar pruebas unitarias en el marco

de pruebas integrado (MSTest) o en marcos de pruebas de terceros. Puede agrupar
las pruebas en categorías, filtrar la lista de pruebas y crear, guardar y ejecutar listas
de reproducción de pruebas. También puede depurar las pruebas, y analizar la
cobertura de código y el rendimiento de la prueba.

Visualización de los resultados de pruebas

unitarias en vivo (Visual Studio Enterprise)
Si está usando el marco de pruebas de MSTest, xUnit o NUnit en Visual Studio 2017 o
versiones posteriores, puede ver los resultados en vivo de sus pruebas unitarias.

７ Nota

Para seguir estos pasos, se requiere Visual Studio Enterprise, junto con el código
.NET y uno de los siguientes marcos de prueba: MSTest, xUnit o NUnit.
1. Active Live Unit Testing desde el menú Probar seleccionando
Probar>Live Unit Testing>Iniciar.

2. Vea los resultados de las pruebas dentro de la ventana del editor de código a
medida que escribe y edita el código.

3. Haga clic en un indicador de resultado de la prueba para obtener más información,

como, por ejemplo, los nombres de las pruebas que contemplan ese método.
Para obtener más información sobre esta característica, vea Live Unit Testing.

Uso de un marco de pruebas de terceros

Es posible ejecutar pruebas unitarias en Visual Studio con un marco de pruebas de un
tercero, como NUnit, Boost, Google C++ Testing Framework, en función del lenguaje de
programación. Para usar un marco de pruebas de terceros:

Use el Administrador de paquetes NuGet para instalar el paquete NuGet

correspondiente al marco de trabajo que prefiera.

(.NET) A partir de la versión 14.6 de Visual Studio 2017, Visual Studio incluye
plantillas de proyecto de prueba preconfiguradas para los marcos de pruebas de
NUnit y xUnit. Estas plantillas también incluyen los paquetes de NuGet necesarios
para habilitar la compatibilidad.

(C++) En Visual Studio 2017 y versiones posteriores, algunos marcos, como Google
C++ Testing Framework, ya están incluidos. Para obtener más información, vea
Escribir pruebas unitarias para C/C++ en Visual Studio.

Para agregar un proyecto de prueba unitaria:

1. Abra la solución que contiene el código que quiere probar.

2. Haga clic con el botón derecho en la solución en el Explorador de soluciones y

seleccione Agregar>Nuevo proyecto.

3. Seleccione una plantilla de proyecto de prueba unitaria.

 En este ejemplo, seleccione NUnit .

La plantilla de proyecto incluye referencias de NuGet para NUnit y

NUnit3TestAdapter.

4. Agregue una referencia del proyecto de prueba al proyecto que contiene el código
que quiera probar.
 Haga clic con el botón derecho en el proyecto en el Explorador de soluciones y,
luego, seleccione Agregar>Referencia. (También puede agregar una referencia del
menú contextual del nodo Referencias o Dependencias).

5. Agregue código a al método de prueba.

6. Ejecute la prueba desde el Explorador de pruebas o haga clic con el botón

derecho en el código de prueba y elija Ejecutar pruebas (o presione CTRL + R, T).

Pasos siguientes
Conceptos básicos de prueba unitaria

Crear y ejecutar pruebas unitarias en código administrado

Escritura de pruebas unitarias para C/C++

Documentación sobre la
implementación de Visual Studio
Obtenga información sobre cómo implementar aplicaciones, servicios y componentes
con Visual Studio.

Acerca de la implementación

ｅ INFORMACIÓN GENERAL

Primer vistazo a la implementación

Información general sobre la publicación

Implementación de aplicaciones web de ASP.NET

ｇ TUTORIAL

Herramienta de publicación

Azure

Obtención de la configuración de publicación de IIS

Publicación con Git

Implementación de aplicaciones de C++

ｃ GUÍA PASO A PASO

Paquete del instalador

Proyecto de instalación

Implementación de aplicaciones de .NET./.NET Core

ｇ TUTORIAL

Herramienta de publicación
ClickOnce

Paquete del instalador

ｃ GUÍA PASO A PASO

Empaquetado de una aplicación de escritorio para la Tienda Windows

Implementación de aplicaciones de escritorio de .NET Framework

ｇ TUTORIAL

ClickOnce

Paquete del instalador

Tipos de implementación adicionales

ｃ GUÍA PASO A PASO

Aplicaciones de Node.js en App Service de Linux

Aplicaciones en contenedores

Publicación de paquetes NuGet

Crear una base de datos y agregar las
tablas en Visual Studio
Artículo • 04/05/2023

Se aplica a: Visual Studio Visual Studio para Mac Visual Studio Code

７ Nota

Los conjuntos de datos y las clases relacionadas son tecnologías de .NET heredadas
de principios de la década de 2000 que permiten a las aplicaciones trabajar con
datos en memoria mientras las aplicaciones están desconectadas de la base de
datos. Son especialmente útiles para las aplicaciones que permiten a los usuarios
modificar los datos y conservar los cambios en la base de datos. Aunque los
conjuntos de datos han demostrado ser una tecnología de gran éxito, se
recomienda que las nuevas aplicaciones de .NET usen Entity Framework Core.
Entity Framework proporciona una manera más natural de trabajar con datos
tabulares como modelos de objetos y tiene una interfaz de programación más
sencilla.

Puede usar Visual Studio para crear y actualizar un archivo de base de datos local en
SQL Server Express LocalDB. También puede crear una base de datos ejecutando
instrucciones Transact-SQL en la ventana de herramientas del Explorador de objetos de
SQL Server de Visual Studio. En este tema, creará un archivo .mdf y agregará tablas y
claves mediante el Diseñador de tablas.

Requisitos previos
Para completar este tutorial, necesita las cargas de trabajo de desarrollo de escritorio
de .NET y de almacenamiento y procesamiento de datos instaladas en Visual Studio.
Para instalarlas, abra el Instalador de Visual Studio y elija Modificar (o Más>modificar)
junto a la versión de Visual Studio que desea modificar.

７ Nota

Los procedimientos de este artículo solo se aplican a proyectos de Windows Forms

de .NET Framework, no a proyectos de Windows Forms de .NET Core.
Crear un proyecto y un archivo de base de
datos local
1. Cree un nuevo proyecto de aplicación de Windows Forms (.NET Framework) y
asígnele el nombre SampleDatabaseWalkthrough.

2. En la barra de menús, seleccione Proyecto>Agregar nuevo elemento. Si ve un

cuadro de diálogo pequeño con un cuadro para un nombre de archivo, elija
Mostrar todas las plantillas.

3. En la lista de plantillas de elementos, desplácese hacia abajo y seleccione Base de

datos basada en servicio.

4. Asigne un nombre a la base de datos SampleDatabase.ms y haga clic en el botón

Agregar.

Agregar un origen de datos

1. Si la ventana Orígenes de datos no está abierta, ábrala presionando Mayús+Alt+D
o seleccionando Ver>Otras ventanas>Orígenes de datos en la barra de menús.

2. En la ventana Orígenes de datos, seleccione Agregar nuevo origen de datos.

 Se abrirá el Asistente para configuración de orígenes de datos.

3. En la página Elegir un tipo de origen de datos, seleccione Base de datos y, a

continuación, elija Siguiente.

4. En la página Elegir un modelo de base de datos, elija Siguiente para aceptar el

valor predeterminado (Conjunto de datos).

5. En la página Elegir la conexión de datos, seleccione el archivo

SampleDatabase.mdf en la lista desplegable y, a continuación, elija Siguiente.

6. En la página Guardar cadena de conexión en el archivo de configuración de la

aplicación, elija Siguiente.

7. En la página Elegir los objetos de base de datos, verá un mensaje que indica que
la base de datos no contiene ningún objeto. Elija Finalizar.

Visualización de las propiedades de la conexión de datos

Puede ver la cadena de conexión del archivo SampleDatabase.mdf abriendo la ventana
Propiedades de la conexión de datos:

Seleccione Ver>Explorador de objetos de SQL Server para abrir la ventana

Explorador de objetos de SQL Server. Expanda (localdb)\MSSQLLocalDB>Bases
de datos y, a continuación, haga clic con el botón derecho en SampleDatabase.mdf
(podría aparecer como una ruta de acceso completa) y seleccione Propiedades.
 Como alternativa, puede seleccionar Ver>Explorador de servidores, si esa ventana
aún no está abierta. Abra la ventana Propiedades expandiendo el nodo
Conexiones de datos, haciendo clic con el botón derecho en SampleDatabase.mdf
y, después, seleccionando Propiedades.

 Sugerencia

Si no puede expandir el nodo Conexiones de datos o no aparece la conexión

SampleDatabase.mdf, seleccione el botón Conectar a la base de datos en la
barra de herramientas del Explorador de servidores. En el cuadro de diálogo
Agregar conexión, asegúrese de que el Archivo de base de datos de
Microsoft SQL Server esté seleccionado en Origen de datos y, a
continuación, busque y seleccione el archivo SampleDatabase.mdf. Para
terminar de agregar la conexión, seleccione Aceptar.

Creación de tablas y claves mediante el

Diseñador de tablas
En esta sección, creará un par de tablas, una clave principal en cada tabla y algunas filas
de datos de ejemplo. También creará una clave externa para especificar cuántos
registros de una tabla pueden corresponder a registros de la otra tabla.

Creación de la tabla Customers

1. En el Explorador de servidores o Explorador de objetos de SQL Server, expanda
el nodo Conexiones de datos y, a continuación, expanda el nodo
SampleDatabase.mdf.

2. Haga clic con el botón derecho en Tablas y seleccione Agregar nueva tabla.

El Diseñador de tablas se abre y muestra una cuadrícula con una fila

predeterminada que representa una columna única de la tabla que está creando.
Al agregar filas a la cuadrícula, agregará columnas en la tabla.

3. En la cuadrícula, agregue una fila para cada una de las entradas siguientes:

Nombre de la columna Tipo de datos Permitir valores NULL

CustomerID nchar(5) False (desactivada)

CompanyName nvarchar(50) False (desactivada)

 Nombre de la columna Tipo de datos Permitir valores NULL

ContactName nvarchar (50) True (seleccionada)

Phone nvarchar (24) True (seleccionada)

4. Haga clic con el botón derecho en CustomerID y seleccione Establecer clave

principal.

5. Haga clic con el botón derecho en la fila predeterminada ( Id ) y seleccione

Eliminar.

6. Asigne un nombre a la tabla Customers actualizando la primera línea del panel de

script para que coincida con el ejemplo siguiente:

SQL

CREATE TABLE [dbo].[Customers]

7. Agregue una restricción de índice a la tabla Customers. Agregue una coma al final
de la línea Phone y agregue el ejemplo siguiente antes del paréntesis de cierre:

SQL

CONSTRAINT [PK_Customers] PRIMARY KEY ([CustomerID])

Deberíamos ver algo parecido a lo siguiente:

 8. En la esquina superior izquierda del Diseñador de tablas, seleccione Actualizar o
presione Mayús+Alt+U.

9. En el cuadro de diálogo Vista previa de actualizaciones de base de datos,

seleccione Actualizar base de datos.

La tabla Customers se crea en el archivo de base de datos local.

Creación de la tabla Orders

1. Agregue otra tabla y, después, agregue una fila para cada entrada de la tabla
siguiente:

Nombre de la columna Tipo de datos Permitir valores NULL

OrderID int False (desactivada)

CustomerID nchar(5) False (desactivada)

OrderDate datetime True (seleccionada)

OrderQuantity int True (seleccionada)

2. Establezca OrderID como la clave principal y después elimine la fila

predeterminada.

3. Asigne un nombre a la tabla Orders actualizando la primera línea del panel de

script para que coincida con el ejemplo siguiente:

SQL

CREATE TABLE [dbo].[Orders]

4. Agregue una restricción de índice a la tabla Customers. Agregue una coma al final
de la línea OrderQuantity y agregue el ejemplo siguiente antes del paréntesis de
cierre:

SQL

CONSTRAINT [PK_Orders] PRIMARY KEY ([OrderId])

5. En la esquina superior izquierda del Diseñador de tablas, seleccione Actualizar o

presione Mayús+Alt+U.
 6. En el cuadro de diálogo Vista previa de actualizaciones de base de datos,
seleccione Actualizar base de datos.

La tabla Orders se crea en el archivo de base de datos local. Si expande el nodo

Tablas en el Explorador de servidores, verá las dos tablas:

Si no lo ve, pulse el botón Actualizar de la barra de herramientas.

Creación de una clave externa

1. En el panel contextual del lado derecho de la cuadrícula Diseñador de tablas de la
tabla Pedidos, haga clic con el botón derecho en Claves externas y seleccione
Agregar nueva clave externa.
 2. En el cuadro de texto que aparece, reemplace ToTable por Customers.

3. En el panel de T-SQL, actualice la última línea para que coincida con el ejemplo
siguiente:

SQL

CONSTRAINT [FK_Orders_Customers] FOREIGN KEY ([CustomerID]) REFERENCES

[Customers]([CustomerID])

4. En la esquina superior izquierda del Diseñador de tablas, seleccione Actualizar

(Mayús+Alt+U).

5. En el cuadro de diálogo Vista previa de actualizaciones de base de datos,

seleccione Actualizar base de datos.

Se crea la clave externa.

Rellenado de las tablas con datos

1. En el Explorador de servidores o el Explorador de objetos de SQL Server,
expanda el nodo de la base de datos de ejemplo.

2. Abra el menú contextual del nodo Tablas, seleccione Actualizar y, después,

expanda el nodo Tablas.

3. Abra el menú contextual para la tabla Customers y, a continuación, elija Mostrar

datos de tabla o Ver datos.

4. Agregue los datos que desee de al menos tres clientes.

Puede especificar los cinco caracteres que desee como identificadores de cliente,
pero elija al menos uno que pueda recordar para usarlo posteriormente en este
procedimiento.
 5. Abra el menú contextual para la tabla Orders y, a continuación, elija Mostrar datos
de tabla o Ver datos.

6. Agregue datos para algunos pedidos. Al escribir cada fila, se guarda en la base de
datos.

） Importante

Asegúrese de que todos los identificadores y cantidades de pedidos sean

números enteros y que cada identificador de cliente coincida con el valor que
especificó en la columna CustomerID de la tabla Clientes.

¡Enhorabuena! Ahora sabe cómo crear tablas, vincularlas con una clave externa y
agregar datos.

Vea también
Obtener acceso a los datos en Visual Studio