TrickyWeb.cl – Informática & Tecnología

Hola!, creo que muchos han buscado tutoriales por la red y se han aburrido de leer mucho, espero esta no sea la ocasión porque intentaré presentar de manera práctica y precisa el tema a tratar.

Esta vez presentaré un tutorial básico de C#, dirigido netamente a la creación de programas con entorno gráfico (GUI) para windows.

Para entender a cabalidad este post recomiendo leer los posts sobre Orientación a objetos teórica, este tutorial de Orientación a objetos está en 3 partes, puedes leerlos haciendo click en los siguientes links respectivamente:

1. Orientación a Objetos p1.
2. Orientación a Objetos p2.
3. Orientación a Objetos p3.

Para trabajar, hay que trabajar con un IDE apropiado para el caso, en este momento se utilizará Microsoft Visual C# Express 2008.

Partamos…

Breve Historia – [Extracto de Wikipedia]

Durante el desarrollo de la plataforma .NET, las bibliotecas de clases fueron escritas originalmente en el lenguaje compilador Simple Managed C. En enero de 1999, Anders Hejlsberg formó un equipo con la misión de desarrollar un nuevo lenguaje de programación llamado Cool (C Orientado a Objetos). Este nombre tuvo que ser cambiado debido a problemas de marca pasando a llamarse C#. La biblioteca de clases de la plataforma .NET fue migrada entonces al nuevo lenguaje.

Hejlsberg lideró el proyecto de desarrollo de C#. Anteriormente, ya participó en el desarrollo de otros lenguajes como Turbo Pascal, J++ y Borland Delphi.

---

Como se hizo notar en el post C – C++ – C#: Cuál es la diferencia?, C# es una extensión de C, por lo que los tipos de datos básicos con los que se trabajaba en C son iguales a los de C#, la diferencia está en que en C# tenemos tipos de datos que ahorran un trabajo inmenso en comparación con C. Como ejemplo de dichos tipos de datos, tenemos el tipo bool, string, que no aparecen en C, pero si en C#.

Pues bien, ya teniendo esta información a mano, vamos a comenzar a trabajar en nuestra aplicación.

1. Para crear un nuevo proyecto, debes dirigirte a Archivo >> Nuevo Proyecto como se muestra en la imagen que viene a continuación.
   

   

2. Selecciona Aplicación de Windows Forms, ponle un nombre a tu proyecto y haz clic en aceptar.

   

3. Aparecerá lo siguiente:

   

Vamos a hacer algo básico, que al hacer clic en un botón, aparezca un mensaje que diga “Hola Mundo!”, para ello, debemos insertar el botón, para ello insertaremos el botón en el formulario:

1. Busca el botón(Button) en la barra de herramientas, generalmente está en un extremo izquierdo, como se puede ver en la imagen:

   

2. Selecciona el botón y arrástralo hacia el formulario

   

3. Es posible fijarse que el texto del botón dice button1, ¿nada bonito no? pues bien, es posible fijarse que en la esquina inferior derecha hay una ventana llamada propiedades, ahí al seleccionar el botón, podemos modificar los atributos del objeto botón (Recordar, por lo leído que C# trabaja orientado a objetos, por lo que todo lo “visual” son objetos, con métodos y atributos).
   
   En dicha ventana, busca un campo llamado Text, ahi al lado aparece el texto del botón (button1), y modificalo a tu antojo.

   

Listo, se tiene lo que se necesita, ahora vas a probar lo que tenemos creado, haz clic en el símbolo para iniciar la depuración, aquí comenzará la ejecución de lo que llevamos de aplicación y en caso de haber errores, el sistema lo hará saber y marcará el lugar del error, para arreglarlo.

Es posible apreciar, que aparecerá la ventana con el botón en medio, y si apretamos el botón…no pasará NADA.

¿Lamentable no?, probablemente en este punto estés algo decepcionado porque creías que esto era mágico y todo vendría para llegar y hacer, lamentablemente no es así, por lo que habrá que configurar la aparición del mensaje por nuestra cuenta, y para ello habrá que acceder directamente al código de la aplicación, para ello, detén la depuración cerrando la ventana generada.

Posterior a ello, haz doble clic en el botón, haciendo esto accederás al código que define a la clase Form1 (en nuestro caso), y específicamente al evento Click del objeto botón.

Aquí me daré el lujo de detenerme un momento, en este momento el lector se pregunta ¿qué es un evento?, un evento es una acción realizada por el usuario (o bien por el mismo objeto) que el objeto captará, y en base a la acción o efecto captado por el botón, ocurrirá algo es decir, el cambio de estado de un atributo o la llamada a un método.

Bien, al acceder al código, al comienzo del código se verá lo siguiente:

Esos elementos son librerías que el sistema utiliza para acceder a los diferentes objetos y trabajar con los diferentes recursos gráficos y de sistema, es algo asi como el #include en C.

Luego es posible apreciar lo siguiente:

Un namespace son agrupaciones de nombres que permiten identificar elementos con los mismos nombres, pero que pertenecen a entornos diferentes. Esto lo usarás y entenderás mas a la perfección al momento de trabajar con ejemplos más complejos.

Luego aparecen elementos que, si manejas POO, te parecerán conocidos:

“Casi” todo lo de acá es conocido, la palabra partial hace referencia a que la clase Form1 ha sido definido parcialmente mediante mas de un archivo de código fuente, por lo que algunos archivos contienen sus atributos, otros sus métodos, etc, permitiendo así entregar un código mínimo para trabajar y evitar que el usuario cometa algún error que pueda dañar la configuración central de la aplicación que se está trabajando, además de facilitar el trabajo modulado ya que más de un programador pueden trabajar en una misma clase pero en diferentes sectores de ella y facilitar la reutilización de código.

El primer método (sin tipo de dato de salida) es un constructor, generalmente es opcional, pero en éste caso es necesario (al menos en la main window) ya que mediante éste método se inicializan los componentes del form( InitializeComponent() ) y es posible cargarlo al inicio.

El segundo método es el que hace referencia a la acción a realizar cuando se haga click sobre el botón 1 (”Presioname!”, evento Click).

Trabajaremos en éste método, agrega lo siguiente dentro de ésta función:

Ahora, vuelve a hacer click en el botón para depurar, podrás ver lo siguiente si haces click en el botón (ver Imagen).

Perfecto!! Ahora tienes tu primera aplicación hecha en C#.

¿Cómo trabajo con otros eventos?

Es fácil (Si!, es fácil, con práctica todo es facil ), para crear un nuevo evento,sitúate en el constructor y escribe lo siguiente:

Automáticamente, después del “.” se abrirá una ventana (ver Imagen) de la que podrás escoger tanto métodos, como manipuladores de eventos o bien atributos.

Se quiere configurar un manipulador de evento, por lo que debes seleccionar alguno de los elementos que aparezcan con el ícono , en este caso se escogerá el evento MouseHover, que hace referencia al posicionamiento del mouse sobre el botón, sin hacer clic. Luego debes escribir lo siguiente:

Con ello se está creando un nuevo manipulador de eventos, llamado button1_MO , que será un método que coordinará la acción a realizar cuando el mouse esté sobre el botón.

Luego, basta con crear el método button1_MO (o como tu quieras llamarle):

Ahora, se va a definir una nueva acción a realizar para este MouseHover, que un texto que aparezca en el form, el que tu quieras, cambie a otro luego de poner el mouse sobre el botón.

Para ello, arrastra un objeto label presente en la barra de herramientas de manera análoga a lo que se hizo con el botón y define su propiedad Text (ver Imagen).

Luego, vuelve al código de la aplicación y escribe esto dentro del método button1_MO:

En nuestro caso “el texto que quieras” será “Informática & Tecnología”, con esto se le ordenará a la aplicación, que al posicionar el mouse sobre el botón, el texto del label cambie a “Informática & Tecnología”.

Ahora, puedes volver a debuggear la aplicación y probar los resultados .

¿Cómo recibir y mostrar datos?

Esto, a pesar de parecer complejo, es igual de fácil que el resto de elementos, para ingresar datos necesitarás una estructura que permita recibir datos, para ello existe una herramienta llamada TextBox, que permite ingresar texto (nada más), el resto dependerá de las órdenes que nosotros entreguemos al código.

Para ello deberás reestructurar el contenido del formulario con el que estás trabajando y será necesario que insertes los siguientes elementos:

1. TextBox
2. Label
3. 2 Botones

El formulario debería quedar algo así:

Lo que se hará, es una aplicación que reciba la edad de la persona y luego le calcule los días (utópicamente) que debería llevar viva la persona, esto es, si la persona tiene 2 años, entonces lleva vividos 2*365 días.

Por lo que



Ahora, haz doble click en el botón y sitúate en el método button1_click y escribe lo siguiente:

Como puedes apreciar, lo anterior no dista mucho al trabajo con funciones y variables locales en C, la gran diferencia, está en la concatenación de cadenas, mientras en C era necesario el uso de la función strcat, aquí basta con unir cadenas usando el operador +, permitiendo incluso concatenar cadenas con números.

La otra diferencia, es el uso de la función Int32.Parse, que permite de manera sencilla, transformar una cadena en número (considerando que si hay caracteres, el sistema arrojará un error por lo que se hace necesario validar el contenido de la cadena).

Aquí es posible notar que Parse() es un método de la clase Int32.

No te sorprendas si en algún código fuente te encuentras con System.Windows.Forms.algo o System.algo ya que a veces para evitar confusiones es necesario poner antes del nombre del método o propiedad, o bien de la clase, el namespace al que pertenecen.

Ahora, no olvidemos que se tiene un botón que dice “Limpiar”, la función de este botón será sencilla: limpiar el contenido del textBox.

Para ello, hace doble click en el botón 2, y en el método que controla su evento click escribe lo siguiente:

Debuggea la aplicación (ver Imagen) y verás que como se dijo al principio, no era tan dificil! .

Perfecto!! Ahora tenemos nuestra primera aplicación hecha en C#.

Ojalá haya servido este post y alivie las dudas de mucha gente que sé, necesitaba este empujoncito.

Deseas descargar el ejemplo? – Bájalo acá