sábado, 15 de febrero de 2014

Ejemplo: Hola Mundo!

En este ejemplo, veremos cómo añadir un texto a una página en blanco, así como ejecutar la página de manera que podamos ver el resultado. Durante el proceso veremos algunas partes del JDeveloper para ir familiarizándonos.

Seleccionamos en primer lugar la página con la que queremos trabajar.
En este caso es muy sencillo, porque sólo tenemos una, pero debemos fijarnos que aquellas páginas que van a mostrar el "aspecto" de la aplicación, se encontrará en ficheros con extensión . jspx. (esto es una simplificación, pero iremos ampliando a medida que se vaya avanzando en los ejemplos).

vista de design de jspx
vista diseño de jspx


En la parte superior derecha, nos encontramos la pestaña de Componentes (Components). Ésta contiene a su vez un desplegable que nos permite seleccionar el tipo de componente que queremos incluir en nuestra página.

components palette
Components palette


En este caso el tipo de componente que seleccionamos es del tipo ADF Core. Si en otro momento necesitamos utilizar otro de los disponibles, como por ejemplo, un enlace HTML a una página web, podemos utilizar el HTML Common.

components palette outputtext
componets palette


De entre los componentes elegimos OutputText, que es el equivalente a etiqueta, y es bastante utilizado a la hora de mostrar textos en la página.

vista design jspx


Al seleccionarlo, se nos coloca en el bloque central. Esta vista que estamos viendo es la de "Diseño" (Design). Existen otras, que son del Fuente (Source), y el histórico (History). Ya se verán éstos más adelante.

También observemos en la parte inferior izquierda donde encontramos la pestaña de Estructura ( Structure).
Esta pestaña nos ofrece un árbol con los elementos que componen la página. Como podemos observar, hay muchos elementos que no están a la vista en el bloque central.



vista estructura (structure)


En la parte inferior derecha, podemos encontrar el Inspector de propiedades ( Propierties Inspector), en el cual, podemos ver todos los atributos del componente seleccionado.


inspector property

En el atributo "Value", cambiamos el valor original por el texto que queremos mostrar.

A continuación guardamos los cambios.


guardar cambios




Ya guardados los cambios podemos ejecutar la página.
Seleccionamos el fichero indice.jspx, con el botón derecho del ratón (menú contextual), y elegimos "Run" (ejecutar).

ejecutar pagina


Tras unos instantes, se abrirá el navegador que tengamos por defecto en nuestro equipo y se mostrará el resultado.

pagina resultante


Otros artículos relacionados:
- Estructura del jspx del ejemplo Hola Mundo

No hay comentarios:

Publicar un comentario