Mostrando entradas con la etiqueta IDE. Mostrar todas las entradas
Mostrando entradas con la etiqueta IDE. Mostrar todas las entradas

miércoles, 28 de enero de 2015

Menús en Android (1ra Parte)

image

En este artículo vamos a hablar sobre los menús en Android, un recurso importante para nuestras aplicaciones cuando queremos mostrar opciones secundarias o queremos simplificar espacio dentro de la vista. En Android existen tres tipos diferentes de menús:

· Menús principales: De estos decir que son los más habituales, aparece cuando se oprime el botón menú del dispositivo en la parte inferior del mismo.

· Submenús: Son usados para mostrar opciones secundarias y se pueden mostrar al pulsar una opción del menú principal.

· Menús Contextuales: Aparece cuando se hace una pulsación larga sobre algún elemento de la vista de la aplicación.

En este artículo hablaremos sobre el primer tipo de menú y dejaremos los otros tipos de menú para próximos artículos.

Los menús los podemos implementar de dos formas en nuestra aplicación, una mediante la definición en un fichero XML y la segunda mediante código. En este artículo abordaremos la primera por ser la que más utilizo por su rápida implementación.

Para entender el tema de los menús pues nada mejor que llevarlo a la práctica y para esto le pondremos unos menús a la app que comenzamos en los artículos anteriores.

Para diseñar un menú es necesario crear el fichero menú.xml en la carpeta res / menú. En nuestra app pondremos un menú con tres opciones, por lo que el diseño quedaría así:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+id/Menu1" android:title="Opción 1"
android:icon="@drawable/tag"></item>
<item android:id="@+id/Menu2" android:title="Opción 2"
android:icon="@drawable/filter"></item>
<item android:id="@+id/Menu3" android:title="Opción 3"
android:icon="@drawable/chart"></item>
</menu>

Este XML se compone de un elemento principal <menu> que contiene tantos elementos <item> como opciones queramos ponerle a nuestro menú. Destacar que los elementos <item> tiene propiedades como el id, el título y el icono. Podemos observar que nuestro XML tiene un detalle y es que los títulos están puestos directamente, algo que vimos que no era aconsejable, para esto creamos los Strings de las opciones y lo referenciamos en el XML por lo que quedaría así:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+id/MenuPrincipal"
android:title="@string/texto_opcion1_menu"
android:icon="@drawable/tag"></item>
<item android:id="@+id/Menu2"
android:title="@string/texto_opcion2_menu"
android:icon="@drawable/filter"></item>
<item android:id="@+id/Menu3"
android:title="@string/texto_opcion3_menu"
android:icon="@drawable/chart"></item>
</menu>

Ahora tenemos que implementar el evento onCreateOptionsMenu() del activity que queremos que muestre el menú. En este evento vamos a “inflar” el menú. Primero obtendremos una referencia al inflater mediante el método getMenuInflater() y posteriormente generamos la estructura del menú llamando a su método inflate() pasándole como parámetro el ID del menú definido en el XML que en nuestro caso será R.menu.menu. Por último devolveremos el valor true para confirmar que debe mostrarse el menú.

Ahora solos nos queda implementar cada una de las opciones del menú. Esto se hará incluyendo el evento onOptionsItemSelected() del activity que mostrará el menú. Este evento recibe como parámetro el ítem que fue pulsado, cuyo ID podemos recuperar con el método getItemId(). Con el ID podemos saber qué opción ha sido pulsada y ejecutar lo que queramos. Por ahora lo único que haremos es mostrar un mensaje.

@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case R.id.Menu1:
Toast.makeText(this, "Opcion 1 pulsada!",
Toast.LENGTH_LONG).show();
return true;
case R.id.Menu2:
Toast.makeText(this, "Opcion 2 pulsada!",
Toast.LENGTH_LONG).show();
return true;
case R.id.Menu3:
Toast.makeText(this, "Opcion 3 pulsada!",
Toast.LENGTH_LONG).show();
return true;
default:
return super.onOptionsItemSelected(item);
}
}

De este código solo comentar como se muestra el mensaje y es utilizando la clase Toast, el mismo tiene el método makeText para indicar el texto que se mostrará en el mensaje y luego usamos el método show() para que se muestre en nuestro activity. De las notificaciones hablaremos en próximos artículos.

{ Leer Más }


domingo, 12 de mayo de 2013

Desarrollando con Spring Framework 3.1 en el IDE Netbeans 7.2.

Spring Framework 3.1, es un conjunto de bibliotecas para el desarrollo de aplicaciones Java (aplicaciones cliente servidor y aplicaciones Web). Esta versión de Spring es compatible con JDK 6 y 7, y se usan @Anotaciones en lugar de escribir archivos xml.
Para iniciar vamos a utilizar el Netbeans IDE 7.2, en la que viene integrado las bibliotecas de Spring Framework 3.
Creando un nuevo Proyecto
Iniciamos en el menú de Netbeans: File > New Project… Seleccionamos el tipo de proyecto: Java Web > Web Application.
clip_image001
Le damos el nombre “heyma” y establecemos una ubicación específica para el proyecto.
Luego seleccionamos el Servidor de Aplicaciones Glassfish y la versión de Java EE 6, manteniendo el valor del Context Path con “/heyma“.
clip_image002
Nota: Una aplicación Spring puede desplegarse también en un servidor Tomcat un servidor más ligero recomendable para el momento de desarrollo.
Ahora viene el momento de la selección de Frameworks. En esta ventana vamos a seleccionar el Spring Web MVC y seleccionar la versión 3.
clip_image003
Con estos pasos tan solo resta ejecutar la aplicación (Run o Deploy) para tener una aplicación Web con Spring publicado en HTTP.
clip_image004
Ya vimos cómo iniciar un proyecto Web con Spring Framework en Netbeans 7.2, ahora vamos a personalizar un poco más la configuración para desarrollar una aplicación completa.
Para probar nuestra primera parte de la configuración vamos a crear nuestro primer componente de Spring que dirá “Hola mundo” con una simple clase Java.
El Spring Framework 3 soporta @Anotaciones en lugar de escribir archivos XML para describir los componentes. Para activar esto editaremos el archivo applicationContext.xml, quedara de la siguiente forma:
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xmlns:p="http://www.springframework.org/schema/p"
       xmlns:aop="http://www.springframework.org/schema/aop"
       xmlns:tx="http://www.springframework.org/schema/tx"
       xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.1.xsd
       http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-3.1.xsd
       http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-3.1.xsd
       http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.1.xsd
       http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-3.1.xsd">
 
    <context:component-scan base-package="org.heyma.webapp" />
    <mvc:annotation-driven />
 
    <!--bean id="propertyConfigurer"
          class="org.springframework.beans.factory.config.PropertyPlaceholderConfigurer"
          p:location="/WEB-INF/jdbc.properties" />
 
<bean id="dataSource"
    class="org.springframework.jdbc.datasource.DriverManagerDataSource"
    p:driverClassName="${jdbc.driverClassName}"
    p:url="${jdbc.url}"
    p:username="${jdbc.username}"
    p:password="${jdbc.password}" /-->
 
    <!-- ADD PERSISTENCE SUPPORT HERE (jpa, hibernate, etc) -->
 
</beans>

NOTA: Como ven existía un error en la plantilla de creación del proyecto de Netbeans las referencias de ubicación están apuntando a Spring 2.5 y para que funcione correctamente lo hemos cambiado a 3.1:
http://www.springframework.org/schema/tx/spring-tx-3.1.xsd
   //En el original dice .../spring-tx-2.5
La línea 15 del archivo applicationContext.xml (Editado) hace referencia a un paquete que debemos agregar al proyecto (org.heyma.webapp). Como se muestra en la siguiente imagen:
clip_image005
Ahora agregamos al paquete una clase Java con las @Anotaciones necesarias para convertirla en un Bean o Componente de Spring. Será necesario agregar las dependencias correspondientes (imports) de Spring. La clase se llamará MainController.java con el siguiente código:

 package org.heyma.webapp;
 
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
 
/**
 *
 * @author John
 */
@Controller
public class MainController {
 
    @RequestMapping("/saludo.htm")
    public @ResponseBody
    String saludo() {
        return "Hola mundo";
    }
}

A continuación les mostramos una imagen con algunas líneas marcadas que muestran las @Anotaciones de Spring que se están usando. La Clase contiene además un método que retorna la cadena “Hola mundo” llamado saludo().
clip_image006
@Controller, Le dirá al contenedor que la Clase será un Componente o Bean de Spring, y se creará una instancia al momento de desplegar la aplicación.
@RequestMapping(“/urlDelServicio”), determina la URL para la llamada HTTP. Se puede definir el tipo de petición GET o POST, esto lo veremos en siguientes tutoriales.
@ResponseBody, Definirá la respuesta según el objeto. En nuestra primera experiencia retornaremos una cadena “Hola mundo”.
Ahora estamos listos para ejecutar Deploy o Run luego cambiando en la URL index.htm a saludo.htm veremos el resultado como se muestra en la siguiente imagen.
clip_image007
Con esto concluimos con la primera parte de la Configuración de una Aplicación Web con Spring Framework 3.1, en próximas entradas explicare como agregar Base de Datos y otras utilidades.
Espero les haya resultado de utilidad y esperamos sus comentarios.
Referencias:

  1. Introducción al IDE Netbeans 7.2
  2. Creación de Proyectos Java en Netbeans

{ Leer Más }


martes, 23 de abril de 2013

Configurar entorno de desarrollo para el Framework ZK.


Con la presente entrada aprenderás a preparar el entorno de desarrollo para la creación de aplicaciones web con el Framework ZK.
Configurar Eclipse
Para la realización de este tutorial usaremos Eclipse 3.7 Indigo, la distribución para Java EE.
Podemos descargarlo de: Eclipse 3.7 Indigo. Una vez descargado, extraemos el contenido del zip/tar.gz en una carpeta y lo ejecutamos (eclipse.exe o ./eclipse).
Las páginas de interfaz de usuario en ZK son ficheros xml que utilizan la extensión "zul". Para editar páginas de interfaz de usuario de ZK en Eclipse, añadimos "zul" a la lista de páginas de tipo XML dentro de las preferencias de Eclipse, para lo cual procedemos del siguiente modo:
  1. Seleccionamos el menú superior del Eclipse Window / Preferences para abrir la ventana de preferencias.
  2. En el panel de la izquierda, seleccionamos General y dentro de ella Content Types como muestra la imagen.
  3. En el panel de la derecha expandimos el nodo Text en la lista de Content types y finalmente seleccionamos XML.
  4. Hacemos clic en el botón Add y escribimos *.zul, y finalmente pulsamos el botón de OK.

Una vez hayamos hecho esto, Eclipse usará el editor XML para abrir los ficheros ZUL, y los reconocerá como tal.
Instalar ZK en un Proyecto Web de Eclipse
Descargamos ZK
Primero debemos descargar ZK, puedes hacerlo directamente del sitio oficial: ZK Community Edition.
Una vez descargado, reconocerás el fichero porque llevará por nombre algo parecido a zk-bin-[version].zip. Extraer su contenido en una carpeta.
Creamos un Proyecto en Eclipse
Para crear una aplicación web en Eclipse, primero, creamos un Dynamic Web Project:
  1. Seleccionamos File / New / Dynamic Web Project
  2. Escribimos como nombre del proyecto, por ejemplo warmup, o prueba, y dejamos el resto de configuraciones como están por defecto.

  • Puedes dejar configurada la opción Target runtime como None
  • Fíjate en la imagen que usamos Dynamic web module version, la versión 3.0. El motivo es que usando Servlet 3.0 aplicación web requiere menos configuración para funcionar.
Instalar el JAR de ZK en el Proyecto Web
Para usar ZK en un proyecto, tienes que copiar el JAR de ZK en tu carpeta de bibliotecas de la aplicación (library).
Los ficheros JAR de ZK están en la carpeta donde hemos extraído el zip de ZK, concretamente dentro de las subcarpetas WebContent/WEB-INF/lib.
  • {YOUR_ZK_UNZIP_FOLDER}\dist\lib
  • {YOUR_ZK_UNZIP_FOLDER}\dist\lib\ext
Es decir, uno a uno, todos los ficheros .jar que estén en esas carpetas, los copiamos a nuestra carpeta de bibliotecas del proyecto web.
Crear una página simple
Después de la instalación, puedes crear una simple página zul para verificar si ZK está funcionando o no.
Desde el eclipse:
  1. Para añadir un nuevo fichero seleccionamos File / New / File, o también File / New / Other / File. Lo llamaremos hello.zul y lo colocaremos en la carpeta WebContent de nuestro proyecto Web.
  2. Hacemos doble clic para editarlo y nos vamos a la pestaña de Source, para poder editar su contenido como texto.

  3. Copiamos y pegamos el siguiente código fuente de ejemplo dentro del fichero (hello.zul) y lo guardamos.
<window title="My First ZK Application" border="normal">
  Hello World!
</window>
Ahora, en la vista Project Explorer de Eclipse, nuestro proyecto será similar a:

Si no puedes encontrar en Eclipse la vista Project Explorer, puedes seleccionarla en el menú Window / Show View / Project Explorer para abrirla.
Configuramos el servidor
Antes de ejecutar una aplicación web, tenemos que configurar un servidor en Eclipse. Para ello seleccionamos Window / Preferences, y en la parte izquierda de la ventana de preferencias que nos ha aparecido seleccionamos Server / Runtime Environments. Pulsamos Add para añadir una configuración de ejecución de servidor.

Seleccionamos Apache / Tomcat v7.0 Server, puesto que soporta Servlet 3.0, y marcamos Create a new local server, a continuación hacemos clic en siguiente.

Si has instalado Tomcat 7 anteriormente, simplemente indica el directorio de instalación en "Tomcat installation directory".
Si no tienes instalado Tomcat 7 puedes descargarlo siguiendo estos pasos:
  1. Haz clic en Download and Install y elige la carpeta de destino.
Nota: La ruta del directorio de destino no debe contener caracteres que no sean ASCII (como por ejemplo acentos).

  1. Acepta la licencia y espera.
    Nota: Eclipse te mostrará un mensaje de error antes de que la instalación termine, simplemente ignóralo.

    Para garantizar que la instalación se realiza correctamente, no pares la descarga ni interrumpas la actividad del Eclipse hasta que termine.

    Eclipse terminara de descargar e instalar el Tomcat en la carpeta especificada.

    A partir de este momento podrás ver la nueva entrada en Server runtime environments en la pantalla de Preferences. Pulsamos OK.

    Ejecutamos la aplicación
    Ahora hacemos clic con el botón secundario del ratón sobre el fichero "hello.zul" y seleccionamos Run As / Run on Server para ejecutar el fichero en nuestro servidor de aplicaciones.

    Elegimos el servidor Tomcat v7.0 que nos aparece. Y podemos marcar la opción Always use this server when running this project para evitar que nos pregunte lo mismo cada vez que ejecutemos el fichero en el servidor de aplicaciones.
    Hacemos clic en Finish y esperamos a que el servidor arranque.

    Después de que el servidor arranque, Eclipse abrirá su navegador y conectará con el servidor de aplicaciones automáticamente: http://localhost:8080/hello.zul. Si lo que ves es muy similar a la siguiente imagen significa que tienes tu proyecto listo para usar ZK:

    Puedes volver y seguir estos mismos pasos para ejecutar cualquier fichero .zul de tu proyecto.
    Referencias:
{ Leer Más }


IconIconIcon