Visual Basic .net desde cero: creando una aplicacin | El Tony y sus on...

http://tony-valderrama.blogspot.com/2012/08/visual-basic-net-desde-c...

El Tony y sus ondas...

Programacin, comunicacin, diseo, videojuegos y el ms all...

BUSCA EN MI BLOG

Visual Basic .net desde cero: creando una aplicacin

0
TEMAS
ADO Algoritmos

Buscar

He escrito (y grabado videos) sobre muchas cosas respecto a Visual Basic .net (versin 2005, 2008 y 2010, que es casi lo mismo). Alguna vez hice un pequeo video mostrando como crear una aplicacin desde cero (llamado Un programa sencillo para ir calentando que adivina un nmero al azar entre 1 y 10), sin embargo creo que con el puro video no queda claro para muchos, as que en esta ocasin voy a mostrar, paso a paso, como crear un programa sencillo en Visual Basic 2010.

Paso 1. Instalar Visual Studio 2010 en tu computadora

Para este paso, lo nico que necesitas es el DVD y mucha paciencia. Ponlo a instalar, sal por un caf, platica con los cuates, juega Xbox, etc. Como en 5 horas termina.

Bases de datos C C++

grfico Dreamweaver

Avisos de ocasin
Cosas verdes Diseo

Paso 2. Arrancar Visual Studio por primera vez

La primera vez que arrancas Visual Studio 2010, te va a preguntar el lenguaje en el que generalmente vas a trabajar. En nuestro caso, vamos a decirle que generalmente programaremos en Visual Basic. Si eliges otro lenguaje, no te preocupes: de todos modos puedes escribir programas en Visual Basic.

Flash Fotos Hardware Historia Humor

Java Karel

Photoshop Redes Gev

Sitios
SQL Tecnologa

Univa Videojuegos Virus Visual Basic .net Visual Basic 6.0

Educativa

Software

Paso 3. Crear un nuevo proyecto

Al arrancar Visual Studio, debera aparecerte una ventana como sta:

MI PGINA DE TUITER

Trending for @tony_valderrama

cientfica

artculo

0. Ventana principal de Visual Studio Ahora haz clic sobre el botn de nuevo proyecto. Recuerda que un proyecto para Visual Studio es toda la bola de archivos necesarios para crear un programa (o sea que es una carpeta con muchas archivos y subcarpetas). Este es el botn:

jalisco

twitter

1. Botn "Nuevo proyecto"

padre

1 de 8

05/10/2012 11:53

Visual Basic .net desde cero: creando una aplicacin | El Tony y sus on...

http://tony-valderrama.blogspot.com/2012/08/visual-basic-net-desde-c...

Y al presionarlo aparece esta ventana (o una muy parecida):

tuiter View All Trending powered by Twylah

SUSCRIBIRSE A
Entradas Comentarios

SUSCRBETE POR I-MEIL

2. Ventana "Nuevo proyecto" Hay que elegir el lenguaje de la barra izquierda (Visual Basic), vamos a elegir Windows Forms Application (que hace un programa como los que estamos acostumbrados a ver en Windows) y le ponemos un nombre a la aplicacin. En el ejemplo que voy a hacer, solo cambio el nombre (lo dems est seleccionado como lo necesito: si el tuyo aparece un poco diferente, solo selecciona lo que aqu indiqu). Mi aplicacin se va a llamar 00-Ejemplo. Nota: en algunas versiones te pregunta la carpeta donde lo vas a guardar. 2012 (16) septiembre (4) agosto (2) Mis lecturas recientes: innovacin y videojuegos Visual Basic .net desde cero: creando una aplicaci... Email address...

ARCHIVO DEL BLOG

Paso 5. Dibujar la interfaz grfica para el usuario (GUI)

Aqu viene la parte divertida. Despus de escribir el nombre de mi proyecto (y en algunos casos la carpeta donde lo voy a guardar) aparece el ambiente de desarrollo como se ve en esta imagen (obviamente los cuadros y flechas no aparecen):

junio (1) mayo (2) marzo (2) febrero (4) enero (1)

2011 (38) 2010 (36) 3. Ambiente de programacin. Nota: la flecha que no tiene texto apunta hacia la ventana como la ver el usuario. Antes de hablar de los pasos siguientes, quiero que te familiarices con el entorno de trabajo. Aunque las cosas pueden cambiar (Visual Studio te da la oportunidad de configurar tu entorno de trabajo como quieras), generalmente a la izquierda est un panel con los diferentes controles que puedes dibujar en la ventana: botones, cajas de texto, etc. Arriba est la barra de men y algunos botones de funciones (como el de Nuevo Proyecto que presionamos antes). De lado derecho, tenemos el explorador de soluciones (que muestra todos los archivos que componen el proyecto) y abajo una ventana que tiene las propiedades del objeto seleccionado (colores, etc.). En la parte inferior hay una ventana donde me pueden aparecer mensajes (sobre todo a la hora de compilar y correr un programa) y en la parte central es el rea de trabajo. Para este ejemplo, solo voy a dibujar 3 controles: una etiqueta (conocidos como Label), una caja de texto (Textbox) y un botn (Button). Pero antes que nada, voy a modificar la ventana principal al cambiar sus propiedades. Para empezar, arriba de la ventana le va a aparecer el texto 2009 (68) 2008 (61) 2007 (73) 2006 (21)

SEGUIDORES

2 de 8

05/10/2012 11:53

Visual Basic .net desde cero: creando una aplicacin | El Tony y sus on...

http://tony-valderrama.blogspot.com/2012/08/visual-basic-net-desde-c...

que dice Form1 (como se ve en la figura). Yo quiero cambiarlo para que diga Saludos.
Google Friend Connect

Miembros (60) Ms

4. Parte superior de la ventana que dice "Form1". Para hacer esto hago clic sobre la ventana en la vista diseo y cambia la ventana de propiedades para mostrar las que se relacionan a la ventana (o Form). Ahora busco la propiedad que se llama Text y le modifico el valor para que diga Saludos.
Ya eres miembro? Acceder

MI "TUITER"
Esto de guardar todo en la nube... http://t.co/DW3v9abk about an hour ago Si Instagram te parece soso MangaCamera da aspecto de cmic japons a las fotos http://t.co/GcEZP8R8 about an
hour ago

Jajaja... se parecen a los semforos de la Minerva :D http://t.co/YiRZ1sWF about an

hour ago

Cuando se juntan los videojuegos (como Zelda) con la realidad, jajaja http://t.co /BSlYLRjG about an hour ago 5. Panel de propiedades con la propiedad Text seleccionado. Una vez que escribo Saludos en lugar de Form1, mi ventana se ve as (en la vista diseo): Aqui y ahora (@ Instituto Tecnolgico y de Estudios Superiores de Occidente w/ 4 others) http://t.co/K4wdzda0 about 19
hours ago

Lser, ultrasonido y madrazos... justo lo que necesito! (@ DiagnoRT) http://t.co /bDV8u1vG about 21 hours ago En terapia... mi mueca va mejor! (@ DiagnoRT) http://t.co/j2ioOrNP 1 day ago A disfrutar del caf con ciencia :D (@ Casa Iteso Clavigero) http://t.co /CW14pfc6 2 days ago Parece que a todos se les olvid, pero el 2/Oct no se olvida: http://t.co/eCguApHX
2 days ago

6. La ventana Form1 con el nuevo texto. Ahora voy a cambiar propiedades de la ventana (Form1) para que ya no tenga botn de minimizar ni de maximizar. Esto lo hago modificando las propiedades MinimizeBox y MaximizeBox respectivamente. Al cambiar True (verdadero, o sea que s tiene esa caja) por false (falso, que lo oculte) resuelvo la situacin. Aqu est la ventana con estas dos propiedades sealadas y abajo est la ventana ya sin cajas de minimizar ni maximizar.

Buenas referencia para preguntas cientficas: http://t.co/3NQwvnZB 2 days

ago

Esta obra est bajo una licencia de Creative Commons.

7. Panel de propiedades con MinimizeBox y MaximizeBox sealadas.

HUMAN CALENDAR

3 de 8

05/10/2012 11:53

Visual Basic .net desde cero: creando una aplicacin | El Tony y sus on...

http://tony-valderrama.blogspot.com/2012/08/visual-basic-net-desde-c...

8. Ventana (Form1) sin los botones de minimizar ni maximizar. Ahora voy a dejar la ventana por la paz y voy a dibujar la etiqueta. Voy al panel de los controles (lado izquierdo) y selecciono la que dice Label como se muestra en la imagen:

VISTAS A LA PGINA TOTALES

298,865

BLOGS INTERESANTES
MakeUseOf.com 5 Places To Play Console Games In Your Browser For Free [MUO Gaming]
Hace 20 minutos

9. Herramienta Label. Luego hago clic sobre la ventana en el lugar donde quiero que quede

*Lifehacker*, tips and downloads for getting things done Want to Read Faster? Stop Saying The Words in Your Head As You Read [Reading]
Hace 52 minutos

Free Technology for Teachers Professor Word - Identify SAT & ACT Vocabulary Words on Any Webpage
Hace 4 horas

10. Form1 con una etiqueta (Label1). Y en este momento ya tengo un control en mi ventana, llamado Label1, que contiene un texto. Ahora, aprovechando que est seleccionado (y si no, solo haz clic sobre la etiqueta), voy a modificar su propiedad Text para que diga Nombre en lugar de Label1 Blog Informtico Video To Video Converter: Conversor de formatos AVI, MPEG, MKV, MP4, 3GP, FLV, SWF
Hace 1 da

Life Rocks! 2.0 Desktop QR Code Reader for Windows

Hace 2 das

Educacin tecnolgica Apps web 2.0: caja de herramientas bsicas

Hace 3 das

ARQUIMEDES EN LA TINA GALAXIA WHIRLPOOL

Hace 2 semanas

heme aqu ni t ni yo fuimos culpables

Hace 4 semanas

11. Form1 con una etiqueta (Label1) que dice "Nombre:". De la misma manera voy a dibujar una caja de texto. Selecciono la caja de texto del panel de controles (o herramientas) y lo dibujo sobre la ventana. Generalmente a los controles que voy a programar me gusta cambiarles el nombre para no hacerme bolas, as que a este le cambio la propiedad (Name) para que diga txtNombre. La parte txt me dice que es una caja de texto si quieres profundizar en esto, busca la notacin hngara. Aqu hay imgenes con todo el proceso:

Pensamientos e imagenes Encuentro de Investigacin sobre Fotografa

Hace 3 meses

Tutorial9 Google Plus Interface Icons

Hace 7 meses

Elite Freeware See ya!

Hace 2 aos

4 de 8

05/10/2012 11:53

Visual Basic .net desde cero: creando una aplicacin | El Tony y sus on...

http://tony-valderrama.blogspot.com/2012/08/visual-basic-net-desde-c...

12. Form1 con una etiqueta (Label1) que dice "Nombre:".

13. Herramienta TextBox.

14. Form1 con Textbox.

15. Propiedad (Name) de la Textbox. De la misma manera dibujo un botn abajo de la caja de texto. Aqu estn las imgenes que describen paso por paso:

16. Herramienta Button.

5 de 8

05/10/2012 11:53

Visual Basic .net desde cero: creando una aplicacin | El Tony y sus on...

http://tony-valderrama.blogspot.com/2012/08/visual-basic-net-desde-c...

17. Form1 con el botn dibujado.

18. Cambi la propiedad (Name) por btnSalir (antes deca Button1).

19. Propiedad Text del botn.

20. Form1 terminada.

Paso 6. Escribir el cdigo (pa que haga algo)

Una vez que est todo bonito, es hora de que haga algo. Vamos a programar los eventos de la ventana. Un evento es algo que pasa: el mouse que hace clic sobre el botn, algo que se teclea en la caja de texto, etc. Este programa va a dejar que el usuario escriba su nombre (o cualquier otro texto) en la caja de texto y al presionar el botn Salir, se despedir. Por lo tanto, el nico evento que tengo que programar es el que se ejecuta cuando el usuario da clic sobre el botn Salir. As que le doy doble clic sobre el botn y el rea de trabajo cambia para escribir cdigo. En este caso, al dar doble clic sobre el botn aparece una nueva pestaa en el rea de trabajo:

21. Pestaa para escribir cdigo del evento del botn. Por lo pronto no le hagas caso al cdigo que aparece, ya luego lo iremos hablando (o lo puedes ver en varios de mis posts sobre Visual Basic .net). Por lo pronto, aparece el cdigo listo para escribir lo que queremos que haga cuando el usuario haga clic sobre el botn. Este es el cdigo que escrib:

6 de 8

05/10/2012 11:53

Visual Basic .net desde cero: creando una aplicacin | El Tony y sus on...

http://tony-valderrama.blogspot.com/2012/08/visual-basic-net-desde-c...

22. Pestaa para escribir cdigo del evento del botn. No te preocupes si no entendiste todas las instrucciones (esto es un primer acercamiento y poco a poco podrs ir profundizando en lo que hace cada cosa). La instruccin MsgBox se encarga de abrir una ventana y mostrar un texto (bueno, puede hacer un poco ms que eso, pero para empezar hace esto). En medio escribo lo que quiero que diga, en este caso el texto Adis, seguido por el nombre que teclearon en la caja de texto (recuerdas que le cambiamos el nombre por txtNombre?). El ampersand (&) sirve para unir dos textos: en este caso, el texto Adis, y el nombre tecleado. Despus de hacer esto, se encuentra la instruccin End que termina la ejecucin del programa.

Paso 7. Guardar todo

Esto es sumamente importante. Y no deb dejarlo hasta ahora: es algo que hay que hacer cada vez que se hace algn cambio. Presiona el botn de guardar todo (Save All, tambin est disponible en el men File):

23. Botn Guardar todo. Y aparece esta ventana:

24. Ventana para guardar el proyecto. Selecciona una carpeta (botn Browse) y, si es necesario, cambia el nombre. Luego haz clic sobre el botn Save. En las prximas ocasiones que presiones Save All ya no aparece esta ventana.

Paso 8. La ejecucin
No, esta ejecucin no tiene que ver con violencia, sino con ver si el programa hace lo que queremos que haga. Para esto, presiona el botn para comenzar la depuracin (Start debugging):

25. Botn Start debugging.... Y aparece nuestra aplicacin:

26. Ejecucin de la aplicacin. Escribo mi nombre y al presionar el botn Salir, aparece esta ventana:

7 de 8

05/10/2012 11:53

Visual Basic .net desde cero: creando una aplicacin | El Tony y sus on...

http://tony-valderrama.blogspot.com/2012/08/visual-basic-net-desde-c...

27. Ventana de saludo. Al presionar el botn Aceptar (o presionar la tecla Enter), se termina la ejecucin y regreso a Visual Studio. S que esto ha sido muy introductorio, pero espero que haya sido til. Si tienen dudas, dejen un comentario. Saludos!
Publicadas por Tony Valderrama a la/s domingo, agosto 26, 2012 . Under Visual Basic .net . ShareThis

0 comentarios: Publicar un comentario

Comentar como:

Entrada ms reciente

Pgina Principal

Entrada antigua

Suscribirse a: Comentarios de la entrada (Atom)

Powered by Blogger. Designed by Simplwp. Converted To Blogger Template by Anshul .

8 de 8

05/10/2012 11:53