Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
INSTITUTO DE EDUCACIÓN SUPERIOR PRIVADO
BSG INSTITUTE
Carrera Profesional Técnica: Desarrollo de Sistemas de Información
UNIDAD DIDÁCTICA: Herramientas de Desarrollo de Software
GUIA DE LABORATORIO/TALLER N° 01
Docente: Ing. Roberto Tomio Higa
Docente: Ing. R. Tom Higa 1
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
Sesión 01: Taller de Programación.
Tema: Ejercicios de Aplicación JAVA
o Utiliza la programación secuencial en sus hábitos de programación.
o Establece datos de entradas y salidas por medio del ciclo de vida de
un programa
o Uso de Objetos de JLABEL, JTEXTFIELD Y JBUTTON
Creación del programa
Nota: Para poder instalar Netbeans IDE 7.0 es necesario tener instalado +JDK.
A) Aplicación Sin Formulario
A continuación vamos a desarrollar una aplicación sencilla que permita calcular el área del
triángulo dado los valores de la base y la altura. No se utilizará formulario, pero sí las clases del
paquete swing para ingresos y salida de datos.
1) Estando en el entorno de desarrollo NetBeans seleccionamos la opción del menú y
luego la opción New Proyect.
2) Al momento de seleccionar New Proyect se visualiza la siguiente ventana:
3) Seleccionamos para Categories Java y para Proyects Java Application y luego
damos click en el botón de comando Next.
Docente: Ing. R. Tom Higa 2
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
4) El botón Browse para crear una carpeta denominada Ejercicios en la unidad E.
En Proyect Name colocamos AreaTriangulo y en el cuadro de texto referido a
Create Main Class colocamos [Link], lo cual permitirá crear
un paquete denominado ejercicios y como primera clase AreaTriangulo, es
decir, se crea el archivo [Link] que pertenecerá al paquete
ejercicios.
Docente: Ing. R. Tom Higa 3
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
5) Sabemos que en Java una clase tiene comúnmente al método Main que es el
método que se ejecuta cuando se aplica Run a la aplicación construida.
En el entorno de NetBeans, una clase creada, crea un método que tiene el
mismo nombre de la clase a la que se denomina método constructor y toda
programación hecha en éste método se ejecutará primero antes que el método
main.
NetBeans generará un paquete (Package) denominado ejercicios y dentro de
ella se mostrará la clase de acceso público AreaTriangulo.
El entorno de desarrollo de NetBeans después de dar click en el botón Finish
queda así
6) Agregamos al código de la programación generada, por debajo del package
ejercicios, lo siguiente:
import [Link].*;
import [Link].*;
Docente: Ing. R. Tom Higa 4
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
El paquete [Link].*; permitirá poder crear ingresos y salida de datos a
través de cajas de mensaje.
7) Agregamos al código en el método Main de la clase AreaTriangulo como se
aprecia a continuación (lo escrito en azul).
En el método main observamos que para leer el dato para la variable base utilizamos el
método showInputDialog de la clase JOptionPane que a su vez pertenece al paquete
swing, que mostrará una caja de mensaje para la lectura de datos. De igual manera se
trabajará para leer el dato de altura.
También se observa el método showMessageDialog de la clase JOptionPane que permite
mostrar en una caja de mensaje el resultado del cálculo del área
Docente: Ing. R. Tom Higa 5
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
8) Seleccionamos AreaTriangulo en el entorno de desarrollo de NetBeans y luego
damos click botón derecho del mouse. Se visualiza un menú flotante, se elige la
opción Run File y se procederá a ejecutar el programa.
● Cuando la aplicación es ejecutada se visualizará la siguiente ventana:
● Nos pide el ingreso del valor de la base y luego de dar click en el botón de
comando Aceptar se mostrará la siguiente ventana:
● Posteriormente se mostrará la ventana del resultado del cálculo del área.
Docente: Ing. R. Tom Higa 6
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
B) Diseño
Un objeto de control Jlabel permite dibujar en el formulario una etiqueta,
entendiéndose como etiqueta una expresión estática que se quiere colocar.
También es usado para mostrar los resultados de un proceso.
Propiedades más usadas:
● Text: Contiene el valor que se visualizará en el formulario.
● Font: Permite establecer el tipo de letra de la expresión a mostrar en el
formulario.
● Border: Para establecer el tipo de borde de la etiqueta.
● Enabled: Para habilitar o inhabilitar el uso del objeto de control.
Objeto de control JTextField
Un objeto de control JTextField permite dibujar en el formulario un cuadro de texto,
es decir, una caja que permite la introducción de un dato o valor. Este objeto es
utilizado para el ingreso de datos.
Propiedades más usadas:
● Text: Contiene el valor o dato introducido en el cuadro de texto.
● Font: Permite establecer el tipo de letra del texto en la caja.
● Border: Para establecer el tipo de borde del cuadro de texto.
● Enabled: Para habilitar o inhabilitar el uso del objeto de control.
Métodos más usados:
● getText(): Permite obtener el texto introducido en el cuadro de texto.
● setText(): Permite colocar un texto en el objeto JTextField.
● requestFocus(): permite asignar el cursor al objeto de control
Docente: Ing. R. Tom Higa 7
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
Objeto de control JButton
Un objeto de control JButton permite dibujar en el formulario un objeto que contiene
un proceso a ejecutar. Se utiliza comúnmente para llevar a cabo procesos específicos
según la naturaleza de la aplicación.
Propiedades más usadas:
● Text: Contiene el valor o dato introducido en el cuadro de texto.
● Font: Permite establecer el tipo de letra del texto en la caja.
● Enabled: Para habilitar o inhabilitar el uso del objeto de control.
Evento más usado:
● ActionPerformed: Este evento se lleva a cabo cuando el usuario da click
sobre el objeto de control JButton.
Una aplicación usando los objetos de control
Ahora procedamos a desarrollar la misma aplicación usando como interfase un
formulario y los objetos de control antes mencionado.
1) Seleccionamos el paquete ejercicios y damos click botón derecho del mouse y
eligimos la opción New y posteriormente JframeForm
Docente: Ing. R. Tom Higa 8
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
2) Se muestra la ventana New JFrame Form y colocamos en Class Name el nombre
del formulario: frmAreaTriangulo
● En esta ventana se observa que la clase denominada frmAreaTriangulo
generará un archivo de extensión .java denominado frmAreaTriangulo que se
almacenará dentro de la carpeta ejercicios y pertenecerá al paquete ejercicios.
● Al momento de dar click en el botón de comando Finish se visualizará el
entorno de desarrollo NetBeans y al lado derecho se muestra la paleta de los
objetos de control (Swing Controls).
Docente: Ing. R. Tom Higa 9
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
3) Sobre el diseño del formulario damos click botón derecho y seleccionamos Set
Layout y posteriormente AbsoluteLayout
● Es necesario usar AbsoluteLayout para que permita dibujar los objetos de
control en el lugar donde uno quiere en el formulario.
4) Ahora procedamos a colocar un objeto Jlabel seleccionando de la paleta Swing
Controls Label y lo arrastramos hacia el diseño del formulario
Docente: Ing. R. Tom Higa 10
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
5) Continuamos el diseño del formulario, quedando éste de la siguiente manera:
6) Ahora procedamos a usar a cambiar los valores de las propiedades de los objetos
de control en la ventana de propiedades:
Objeto de Control Propiedad Valor de la Propiedad
JLabel1 Text BASE:
JLabel2 Text ALTURA:
JLabel3 Text El área del Triángulo es:
JTextField1 Text (Vacío o limpiar)
JTextField2 Text (Vacío o limpiar)
JTextField3 Text (Vacío o limpiar)
JButton1 Text CALCULAR
JButton2 Text LIMPIAR
JButton3 Text CERRAR
Luego de aplicar los cambios en los
valores de propiedades el diseño del
formulario debe quedar de la siguiente
manera
Docente: Ing. R. Tom Higa 11
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
7) Es necesario darle un nombre propio a los objetos de control y sobretodo a
aquellos que intervienen en la lógica de la programación. Seleccionamos el objeto
de control JTextField1 y damos click con el botón derecho del mouse y se
visualizará un menú flotante y seleccionamos Change Variable Name.
Colocamos como nombre al objeto JtextField1: txtBase
8) Continuamos con los objetos de control siguientes
Objeto de Control Nombre
JTextField2 txtAltura
JTextField3 txtArea
JButton1 btnCalcular
JButton2 btnLimpiar
JButton3 btnCerrar
Docente: Ing. R. Tom Higa 12
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
9) Ahora procedamos a programar en los botones de comando. En el botón CALCULAR
(btnCalcular) al darle doble click y escribir el siguiente código:
10)
Una vez declaradas las variables de memoria, a la variable base se le asigna el
valor introducido en el cuadro de texto txtBase. El método getText() permite
obtener el dato introducido y con el método parseInt de la clase Integer es
convertido a numérico entero.
Se hace lo mismo para la variable altura. Para mostrar el cálculo de área se
utiliza el método setText del cuadro de texto txtArea que permite visualizar el
contenido de la variable area. A la variable se le aplica el método valueOf de
la clase String para convertir el dato área en cadena de caracteres.
11) En el botón LIMPIAR (btnLimpiar) luego de darle doble click escribimos el siguiente
código:
Se limpian los cuadros de textos a través del método setText() y con el método
requestFocus() se pasa el cursor al objeto de control txtArea.
12) En el botón CERRAR (btnCerrar) luego de darle doble click, escribimos el siguiente
código: dispose();
El método dispose() permite descargar el formulario y terminar la ejecución de la
aplicación.
Docente: Ing. R. Tom Higa 13
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
13) Procedemos a ejecutar la aplicación seleccionado frmAreaTriangulo y al dar clic
botón derecho eligimos Run File.
Se muestra el formulario diseñado en etapa de ejecución
● Podemos observar que el formulario sale con los objetos de control cercano a
los bordes del formulario y el mismo formulario se visualiza pegado en la parte
superior izquierda de la pantalla del computador. Vamos a proceder a corregir
estos defectos agregando dos líneas de código en el método constructor de la
clase frmAreaTriangulo.
Docente: Ing. R. Tom Higa 14
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
public class frmAreaTriangulo extends [Link]
/** Creates new form frmAreaTriangulo
*/ public frmAreaTriangulo()
initComponents();
setSize(400,250);
setLocation(250,250);
● El método setSize() permite establecer el tamaño del formulario y el método
setLocation() permite ubicar el formulario dentro de la pantalla. Los métodos
antes mencionados pertenecen al formulario frmAreaTriabgulo. Otros
métodos del formulario se verán más adelante.
14) Procedemos nuevamente a ejecutar el formulario frmAreaTriangulo y se mostrará
de la siguiente manera
Docente: Ing. R. Tom Higa 15
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
C) EJERCICIO
1) Creamos un Proyecto Nuevo (New Project) con el nombre "FormRaiz" (sin comillas).
2) Hacemos clic derecho sobre el nombre del proyecto, nos vamos donde diga "New"
(Nuevo) y damos clic en "JFrame Form".
3) En "Class name" (Nombre de la clase) escribimos "raizcuadrada" (Sin comillas) y
damos clic en "Finish" (Finalizar).
4) Como pueden fijarse, se creo otra nueva clase con el nombre "[Link]".
Pero ha quedado "[Link]" sobrando. Esa clase la eliminamos (Opcional).
5) Ahora le agregamos 1 Label (Jlabel), 2 Cajas de texto (JTextField) y un Botón (JButton)
tal y como se muestra en la imagen te deberá quedar así (No importa la organización).
Docente: Ing. R. Tom Higa 16
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
6) En propiedades de cada "jTextField" puedes eliminarle el texto, también cambiarle el
texto del Botón (jButton1). Modificalo a tu gusto.
JForm Raíz Cuadrada
Ahora pasemos a la Programación del Programa.
Programación y Código fuente:
7) Primero que nada debemos saber en donde vamos a colocar dicho código, pero
como es una sencilla aplicación, el Botón va hacer que funcione el programa, es decir al
dar clic en "Calcular raíz cuadrada" este va calcular la raíz del numero, entonces en ese
botón va ir el código fuente.
8) Para poder escribir el Código fuente, damos clic derecho en tal botón "Cálcular Raíz
cuadrada" (jButton), nos vamos donde dice "Events > Action > actionPerfomed"
actionPerfomed
Docente: Ing. R. Tom Higa 17
Curso: Herramientas de Desarrollo de Software
Docente: Ing. R. Tom Higa
9) Ahora escribimos este código fuente tal y como esta en la imagen:
10) Una ves copiado el sencillo código al editor de NetBeans, ejecutan la aplicación y lo
prueban para ver si funciona.
Docente: Ing. R. Tom Higa 18
