Ayudanos contestando la siguiente encuesta acerca de Videojuegos!
Ir a la encuesta
>

Java the Hutt

Objetivo

Aprender a utilizar Java y NetBeans para crear nuestra primera aplicación.

Producto a Entregar

Un archivo comprimido con el programa generado en la actividad.

Forma de Trabajo

Individual

Tiempo estimado

1 hora

Forma de Entrega

Por Blackboard

Recomendaciones

  • Sigue las instrucciones de la actividad y ejercita la lectura crítica.
  • Intenta familiarizarte con la herramienta ya que te ayudará a trabajar menos
  • NetBeans te permtie trabajar escribiendo menos código. Recuerda utilizar la ayuda y el autocompletado
  • Realiza otros ejercicios para obtener más práctica

 

Instrucciones

Paso 1:

Antes de empezar veamos un poco de contexto sobre el lengauje de programación y el IDE que vamos a utilizar.

Java es un lenguaje de programación orientado a objetos que comaprte gran parte de su sintaxis con C y C++. Java es uno de los lenguajes más poderosos que existen actualmente y desde la versión 6 es un proyecto open source, por lo que tiene el soporte de toda una comunidad de programadores, además de Sun Microsystems que fueron los creadores originales. En 2005 Java se utilizaba en uno de cada cuatro proyectos, casi diez por ciento por encima de su siguiente competidor (C++) y ha seguido creciendo. Se estima que un noventa porciento de las computadoras cuentan con una máquina virtual de Java, además de que todos los celulares y una gran cantidad de dispositivos móviles también cuentan con Java.

NetBeans es un entorno de desarrollo integrado (IDE por sus siglas en inglés). Esto quiere decir que integra todas las herramientas que necesitamos para poder desarrollar. Originalmente la programación en Java era algo complicada porque Java cuenta con una enorme cantidad de librearías y funciones que era preciso aprenderse de memoria, viendo esto muchas compañías construyeron diferentes entornos de programación para facilitar la tarea del programador. Entre los más populares surgió Eclipse que reinó como el único y más importante IDE de Java durante varios años. Sun Microsystems desarrollo su propio IDE, que tenía la ventaja de que fue creado por las mismas personas que crearon Java años antes, este IDE fue NetBeans y después de varios años de desarrollo ha llegado a ser tan útil y poderoso como Eclipse o quizás un poco más.

Paso 2:

Lo primero que debemos hacer es descargar el kit de desarrollo de Java y el entorno de programación NetBeans. Podemos conseguir estas dos herramientas en el site oficial de Sun Microsystems. Dentro de la página de descargas debemos descargar el JDK con NetBeans.

Paso 2:

Una vez que hayamos descargado el paquete debemos correr el instalador. Después de aceptar la licencia nos pregunta dónde queremos instalar y al final instala todos los componentes necesarios. Una vez terminado de instalar debemos buscar el ícono de NetBeans en el escritorio o en el menú inicio.

Corremos el programa haciendo doble click y nos lleva a la pantalla principal que es similar a esta:

El editor gráfico de ventanas en NetBeans es parte de un proyecto llamado Matisse. Desde que salió NetBeans 5.5 han habido varias mejoras importantes que hacen que sea mucho más fácil de utilizar y estas mejoras van a ser implementadas en la versión 6.0 de NetBeans. Si estás utilizando una versión anterior a la 6.0 puedes seguir los siguientes pasos para instalarlo:

  1. Descarga el archivo con los módulos de matisse y extraelos en alguna carpeta.
  2. Abre NetBeans
  3. Selecciona el menú Tools -> Update Center
  4. Selecciona Install Manually Downloaded Modules
  5. En la ventana de seleccionar módulos presiona el botón Add y selecciona los módulos que se encontraban dentro del archivo que descargaste en el primer paso.
  6. Acepta el contrato de licencia y reinicia el IDE. Un IDE es una herramienta que nos permite escribir código y compilar, en este caso se refiere a NetBeans.

Paso 3:

Ahora vamos a continuar con la creación del proyecto en sí. En esta pantalla podemos encontrar todas las herramientas necesarias para crear y manejar nuestros proyectos hechos en Java. Por el momento presiona el botón de nuevo proyecto. En la ventana que aparece selecciona un nuevo proyecto de Java.

En la segunda ventana ponle como nombre de proyecto HelloWorld. Es importante que en esta ventana revises el directorio en el que se guarda el proyecto para que más adelante puedas acceder a tus archivos o puedas agregar imágenes y sonidos.

Al terminar aparecerá la ventana de código en la que podemos comencar a codificar nuestra aplicación.

Esto es lo que se llama una Clase en Java (esta clase en particular se llama Main, eso es un dato importante porque lo vamos a utilizar más adelante). Las clases son el fundamento de la programación orientada a objetos y podríamos decir que son el molde con el que hacemos nuevos objetos. Las clases tienen atributos y métodos. Los atributos son lo que nos dice cómo es esa clase, por ejemplo, los atributos de una persona son el color de ojos y el alto (entre muchos otros), los métodos son las acciones que puede realizar una clase, por ejemplo correr.

En el código que se genera automaticamente por NetBeans tenemos dos métodos, el método Main() que también se conoce como el constructor de la clase y el método main() que es el punto de inicio del programa (por las mayúsculas y minúsculas Main es diferente de main).

Paso 4:

Dentro del método main() escribe el siguiente código:

Una vez que lo hayas escrito presiona el botón de compilar (o F11). En la ventana de compilación deben aparecerte varios mensajes de compilación y debe terminar en BUILD SUCCESSFUL (total time: 7 seconds). Esto quiere decir que nuestra aplicación compiló de manera adecuada y estamos listos para correrla. Presiona el botón correr (o presiona F6). En la parte inferior de la pantalla debe aparecer el letrero "Hola!".

¡Felicidades! Has creado tu primera aplicación Java con NetBeans, pero esto no es lo que queremos que vea un cliente final. Para que un programa sea útil para cualquier persona es necesario que tenga una interfaz gráfica así que vamos a utilizar Swing para crear una interfaz gráfica que nos muestre el mismo mensaje.

Swing es un conjunto de librerías con las que cuenta Java para crear y mostrar una interfaz gráfica. Dentro de estas librerías hay varias clases (recuerda, una clase es como un molde con el que podemos hacer objetos) que nos permiten mostrar ventanas, mensajes, botones, cajas de texto e incluso imágenes, audio o video. Una de las clases más importantes de Swing es JFrame. Esta clase es una ventana que tiene un contenedor en el que podemos poner controles.

Como podemos ver en la imagen un JFrame es una ventana normal de Windows. Dentro de un JFrame existe algo llamado ContentPane. Un ContentPane es un contenedor de controles en el que podemos agregar los elementos de la interfaz gráfica. Ahora veamos otro control importante en la generación de interfaces gráficas. El JLabel es una etiqueta con la que podemos motrar texto en nuestras aplicaciones. Un JLabel es una herramienta muy poderosa ya que nos permite agregar texto, cambiar el formato, la posición, agregar imágenes y muchas cosas más. Vamos a crear una clase que sea un JFrame y después vamos a agregarle un JLabel para mostrar nuestro mensaje.

Paso 5:

Vuelve al código de la clase Main. Como dijimos tenemos que convertir esta clase en un JFrame. Esto es sencillo, lo único que debemos hacer es agregar la línea extends JFrame en la parte de arriba después de dónde dice public class Main como se ve en la imágen.

Es importante notar que dejar un renglón entre el nombre de la clase y el extends no es necesario, únicamente es para darle una mejor presentación al código, pero ustedes pueden seguir cualquier estilo que ustedes consideren más claro. Después de escribir esta línea NetBeans la va a subrayar con una línea roja, esto significa que el código tiene un error. Poniendo el mouse sobre el error podemos obtener más información sobre él.

Paso 6:

El error que nos marca NetBeans es que no conoce el símbolo. Esto quiere decir que no sabe qué es un JFrame, para resolver este tipo de errores debemos agregar la librería de la que hablaba hace unos momentos, en estos momentos todavía no sabemos dónde está, pero por suerte NetBeans también nos muestra un foquito a la izquierda en el que, al hacer click, nos brinda una solución. No siempre podemos confiar en las soluciones que brinda NetBeans porque después de todo es una herramienta y no una persona que nos está haciendo la recomendación, pero muchas veces su sugerencia es acertada, como en este caso que dice que debe agregar un import (veremos más sobre este tema más adelante). Selecciona la opción y debe aparecer una línea al principio de nuestra clase en la que resuelve el error.

Paso 7:

Como vimos en la parte de arriba el método Main (con mayúscula) es el constructor de la clase. Este es el método con el que vamos a crear nuevos objetos de nuestra clase (que es una ventana). Dentro de este método debemos escribir algunas líneas de código para darle un tamaño a la ventana y para que se muestre. Copia el código que se muestra en la siguiente imágen:

En el código estamos utilizando la palabra clave this, que hace referencia a la misma clase que lo llama, es decir, a nuestra ventana. La primera línea va a cambiar el tamaño de nuestra ventana a 200 x 200. Escribe this.setS y espera unos momentos. Aparecerá una pantalla que te muestra opciones de auto completar. Esta pantalla es muy útil al programar ya que cuando no conocemos un método nos brinda información sobre qué significan los parámetros y cómo utilizar el método.

Por ejemplo, en esta imágen nos indica que el método setSize() debe recibir dos números enteros (int quiere decir número entero), y nos dice que el método va a cambiar el tamaño del componente (en este caso nuestra ventana) para que tenga el ancho y alto especificados. Tambíen nos indica que podemos conseguir más información viendo los métodos getSize(), setBounds() y setMinimumSize(). Utilizando esta herramienta completa el código para mostrar la ventana.

La segunda línea nos permite cambiar el título de nuestra aplicación. Podemos utilizar cualquier título que nos guste, lo único importante es pasarlo entre comillas porque es texto. La tercera línea le dice a nuestra aplicación qué debe hacer cuando el programa termine. En este caso nuestro constructor es únicamente una ventana, por lo que le indicamos que al cerrar la ventana la aplicación termine con EXIT_ON_CLOSE. La cuarta línea le indica a la ventana que es visible, por lo tanto se dibuja en pantalla.

Paso 8:

Por último debemos crear un nuevo objeto de nuestra ventana, esto es muy sencillo y lo logramos agregando la línea que se ve en la imágen dentro del método main() (con minúscula).

Esta línea está creando un nuevo objeto de la clase Main mandando llamar el constructor que acabamos de crear. Compila tu programa haciendo click en el botón compilar y luego córrelo haciendo click en el botón correr .

Con esto se muestra una ventana vacía, ya casi hacemos el programa que queríamos, pero nos falta un mensaje. Para eso vamos a utilizar otra clase de Swing que se llama JLabel. En la parte superior del constructor escribe el código como se ve en la imagen:

Una vez más la primera línea va a ser subrayada en rojo porque nos falta importar una librería. Ahora vamos a utilizar otra técnica para resolver este mismo error. Haz click derecho sobre el código y selecciona la opción "Fix Imports". Con esto NetBeans revisará todo el código y automaticametne va a agregar todas las librearías que necesitamos.

En el código lo que estamos haciendo es crear un nuevo JLabel. Su nombre será lblHola (por convención todos los JLabel deben empezar su nombre con lbl) y este JLabel va a ser un nuevo JLabel que diga "Hola". Después agregamos el JLabel al contenedor de la ventana.

¡Felicidaes, hemos terminado nuestra primera aplicación en NetBeans utilizando interfaz gráfica!

Una vez que hayas terminado tu programa debes comprimir el directorio de la aplicación que seleccionaste en el paso 2 y mandarlo por blackboard.

Ayudanos a mejorar este laboratorio:

¿Cuál es tu opinión del laboratorio?

(1 - buena; 5 - mala).

1       2       3       4       5
¿Cómo se puede mejorar?
¿Encontraste un error? ¿Cuál?

Ayudanos contestando la siguiente encuesta acerca de Videojuegos!
Ir a la encuesta