Archivo de la categoría ‘Aplicaciones móviles’

Instalación Cordova/PhoneGap

lunes 28 de julio de 2014

Apache_Cordova1

En general la instalación de Cordova no resulta muy complicada, pero si es verdad que con la aparición de la versión 3.x resulta un poco más compleja que las anteriores. Es posible encontrar por la red tutoriales sobre la instalación en MacOS y Windows, pero cuesta más encontrarlos sobre Linux.

Los pasos se han realizado en un Linux Mint, pero debería ser posible realizarlos sin problemas en cualquier distribución basada en Debian.

1. Instalación del entorno de desarrollo. Al trabajar con Linux tenemos la posibilidad de poder instalar los SDK de Amazon, Android, Blackberry10, Firefox OS y Ubuntu, aunque nosotros nos vamos a centrar en la instalación de Android. Puedes seguir los pasos de la instalación desde aquí. En caso de que el SDK ya esté instalado es conveniente actualizar a la última versión del SDK y del SDK-tools

Desde MacOS tenemos también la opción de instalación del SDK de iOS, para lo cual es necesario instalar XCode.

2. Instalación de Node.js. En principio puede ser instalado directamente desde el propio gestor de paquetes que la distribución tenga (synaptic o similar), pero es importante tener en cuenta dos cosas.

  • La primera es la versión a instalar. Normalmente en el gestor puede haber una versión antigua, por lo que es interesante incluir el ppa correspondiente para estar al día.
  • Lo siguiente es que hay que tener en cuenta que el paquete npm (el instalador de paquetes de Node) se encuentra en un paquete distinto a Nodejs, por lo que hay que recordar instalarlo.

En MacOS la instalación simplemente consiste en descargar el paquete desde la web de nodejs e instalarlo.

3. Instalación de phonegap. Simplemente

sudo npm install -g cordova

Una vez completada la instalación lo mejor es comprobar que todo el sistema funciona correctamente. Para ello lo primero es crear un proyecto.

  • Desde un terminal vamos a la carpeta en la que queremos alojar el proyecto. En caso de estar con MacOS podemos arrastrar desde el finder el icono de la carpeta a un terminal.

cordova create hello com.ejemplo.hello HelloWorld

siendo hello la carpeta que crearemos, HelloWorld el nombre del proyecto y com.ejemplo.hello el paquete

  • Creamos las plataformas, es decir las estructuras de los proyectos para cada una de las plataformas en la que queremos crear la aplicación. En este caso sólo hemos instalado los SDK de Android, luego sólo podremos generar para esa plataforma. Entramos dentro de la carpeta creada (en nuestro caso hello) y desde allí:

cordova platform add android

En MacOS podríamos crear también para iOS.

cordova platform add ios

 Al añadir el proyecto en Android es posible que aparezca algún error. Casi seguro que es porque o no se ha instalado el SDK o no está en el path. Si has hecho el paso 1, el problema será el path. Para añadirlo:

export ANDROID_HOME=/carpeta/donde/esta/instalado/sdk
export PATH=$ANDROID_HOME/tools:$PATH
export PATH=$ANDROID_HOME/platform-tools:$PATH

  • Construimos las plataformas:

cordova build android

A partir de ese momento ya podemos ejecutar la aplicación, ya sea en un emulador o en un dispositivo. Por eficiencia lo mejor es conectar un dispositivo Android y ejecutar :

cordova run android

En el caso que quisiéramos probar con el emulador el comando sería:

cordova emulate android



PhoneGap/Cordova: desarrollo de aplicaciones móviles multiplataforma

martes 8 de julio de 2014

Apache_Cordova1

 

Con toda seguridad el requisito más importante de VisualDomo sea la necesidad de que corra en varias plataformas móviles sin ser necesario la creación desde cero de una nueva aplicación. La clave está en el uso de PhoneGap/Cordova.

¿Qué es PhoneGap?

De manera resumida, PhoneGap es un framework para la creación de aplicaciones móviles multiplataforma. Es decir su objetivo es crear un único código y que este pueda funcionar en distintas plataformas móviles como iOS, Android, Blackberry, FirefoxOS, Windows Phone… Suena bien, ¿verdad?

En general para conseguir un objetivo así, la idea es crear aplicaciones web con HTML5, CSS3 y javascript que corran sobre un navegador. Evidentemente este método proporciona multiplataforma, pero por contra hace las aplicaciones más lentas (necesitan al navegador entre ellas y el SO) y, por motivos obvios de seguridad, limita el acceso a varios recursos como la cámara, el acelerómetro, etc.

Para solucionar en parte este problema PhoneGap permite la creación de aplicaciones híbridas, es decir, añadir ciertos componentes (que llama plugins) que conectan de manera nativa con esos recursos. Lógicamente esto hace que la aplicación pierda la posibilidad de ser multiplataforma, pero la manera de migrar a otras plataformas queda únicamente reducida a crear los plugins en ellas. Estos accesos se desarrollan en javascript, que si permite la llamada a código nativo (ya sea Java, C, C++…)

De esta manera una aplicación desarrollada con PhoneGap no es una simple página web, sino que que es una aplicación nativa (un apk si hablamos en sistemas Android) que en su interior lleva un componente visualizador Web (WebView), las páginas web creadas y los plugins de acceso a los recursos.

Por otra parte, para entender el concepto de framework podemos relacionarlo con Java o .NET. Este concepto incluye herramientas que ayudan al proceso de compilación, API’s, etc. y que generalmente se ejecutan sobre una máquina virtual. En este caso podríamos hacer la relación de máquina virtual/webView. Para entenderlo mejor podemos ver el esquema de bloques de una aplicación PhoneGap.

Esquema phonegap

El bloque UI framework no es necesario. Obviamente podemos desarrollar las aplicaciones desde cero con CSS3 y Javascript, pero es obvio que si ya hay diferencias entre distintos navegadores más las puede haber ahora que entra además el factor plataforma. Es por ello que resulta muy interesante el uso de algún tipo de librería como JQuery mobile que ayude de a la creación sencilla del interfaz.

Por último queda otro pequeña confusión a aclarar: ¿qué es Apache Cordova y que tiene que ver con PhoneGap? Durante todo el post he hablado de PhoneGap, pero realmente tendría que haberlo hecho de Apache Cordova. PhoneGap fue desarrollado por Nitobi, empresa que al poco tiempo fue comprada por Adobe. Adobe ha cedido la licencia a la Fundación Apache para liberar el código y asegurar que ese tipo de licencia se mantenga. De esta manera el producto pasó a denominarse Apache Cordova y PhoneGap a ser una distribución del él. No puedo asegurarlo, pero la única diferencia es el servicio de compilación en la nube que PhoneGap ofrece.

VisualDomo: Requisitos

martes 1 de julio de 2014

VisualDomo logo_com7

Antes de empezar a diseñar conviene dejar bien definidos los requerimientos del proyecto, tanto los mínimos como los opcionales

Mínimos

  • No será posible acceder a un ODControl que no esté en la red a la que se encuentre conectado VisualDomo. Dicho de otro modo, no es posible controlar dispositivos externos a la red local. Aún así se preverá un posible acceso futuro a dicha funcionalidad.
  • Posibilidad de trabajar con varios ODControl de una misma red (mínimo 10)
  • El protocolo de comunicación entre VisualDomo y los ODControl será HTTP autenticado (no seguro)
  • En una primera fase, VisualDomo debe correr en plataformas Android. Los cambios entre plataformas deben ser mínimos.
  • Se debe permitir la configuración de localizaciones con varias plantas.
  • La definición de los planos se hará mediante la carga de algún formato gráfico (png, jpg, etc…)
  • La configuración de la localización podrá realizarse off-line.
  • VisualDomo debe guardar las configuraciones de cada localización (puertos, planos, ubicaciones,…) para facilitar una posterior conexión.
  • Identificación sencilla por iconos del tipo y estado de cada puerto.
  • Control de errores con notificaciones en caso de problemas en los ODControl.
  • Los estados serán actualizados de manera automática a los ODControl, aunque también se podrán solicitar de manera manual.

Opcionales

  • La aplicación permitirá trabajar con varias localizaciones si bien al mismo tiempo únicamente con una de ellas. Aplicación SDI (Single Document Interface).
  • Modo multivista en tabletas que permitan visualizar varias plantas de manera simultánea.

Por cierto, en la cabecera ya utilizo el logo de la aplicación, muy inspirado en el logo oficial de OpenDomo. Espero que os guste.

VisualDomo. Entendiendo el problema (II). Objetivos

lunes 23 de junio de 2014

ODControl-logo

 

Después del post anterior donde se presentaba ODControl, el siguiente paso es definir los objetivos a los que se pretende llegar con el proyecto:

El objetivo principal es la creación de una aplicación de código abierto para el control visual de una localización domotizada controlada por uno o varios ODControl. Dicha aplicación debe ser compatible con la gran mayoría de dispositivos móviles independientemente de su plataforma o modelo. Específicamente la aplicación debe:

  • Localizar o permitir configurar los posibles ODControl existentes.
  • Permitir cargar planos de la localización a controlar.
  • Ubicar en los planos los distintos dispositivos a controlar.
  • Guardar las configuraciones para simplificar futuros accesos.
  • Visualizar el estado de los puertos de entrada, ya sean digitales o analógicos.
  • Modificar el estado de los puertos de salida.

En otro ámbito más transversal:

  • Es de desear que la aplicación pueda trabajar en varios idiomas (al menos español e inglés).
  • Diseño responsable. Dentro de las limitaciones de diseño indicadas por los fabricantes de los sistemas se pretende que el diseño de la aplicación se adapte al entorno hardware en el que está siendo ejecutado (móvil, tableta o navegador en equipo de sobremesa).
  • Se tendrá especial cuidado en conseguir alta usabilidad.

Existen otros objetivos relacionados con la visibilidad del proyecto:

  • El código del proyecto será publicado en alguna comunidad virtual, en este caso GitHub.
  • Documentar el código de tal manera que simplifique la continuidad del trabajo por parte de otros usuarios. Para facilitar la internacionalización de esta labor dicha documentación se hará en inglés.
  • Se pretende realizar un seguimiento del proyecto mediante el desarrollo de un blog que muestre tanto el proceso de diseño como el de programación. Dado el carácter abierto de VisualDomo se espera que, junto con la publicación del código, el blog facilite la labor de hacer crecer el desarrollo inicial del mismo.
  •  Publicación en las principales tiendas electrónicas de aplicaciones (Google Play, App Store...)

 

 

VisualDomo. Entendiendo el problema (I)

viernes 20 de junio de 2014

Como en cualquier otro proyecto, el primer paso a realizar es conocer bien el problema al que nos enfrentamos y definir correctamente adonde queremos llegar. Obviamente en nuestro contexto el protagonista principal es ODControl.

Controlador IP

De manera sencilla, un ODControl es un controlador IP. Un controlador es un sistema electrónico que, como su nombre indica, permite controlar un conjunto dispositivos eléctricos que puede ser conectados a él, para lo cual dispone de una serie de puertos ya sean por una parte de entrada o salida y por otra, analógicos o digitales.

El hecho de ser IP lo convierte además en un dispositivo que puede ser conectado a un red IP, posibilitando el acceso desde otro dispositivos de la red y,  mediante un navegador web, una consola ssh o cualquier otro método, acceder a las funciones que disponen sus entradas y salidas.

Por ver un ejemplo gráfico, el esquema de una supuesta instalación completa (y básica) para controlar un sistema de iluminación podría ser:

esquema-controlador

El controlador IP (C-IP) está conectado mediante Ethernet a un modem-router que, por una parte, da salida/entrada a internet y por otra funciona como punto de acceso WiFi. Además el C-IP conecta una de sus salidas a un relé (R1) que hace las funciones de interruptor y que a su vez estará conectado a la fase y al punto de luz a controlar. Dicho control (apagado/encendido) se podrá realizar desde el dispositivo móvil.

ODControl

ODControl es el controlador IP que comercializa OpenDomo Services S.L.. En el momento de desarrollo del proyecto, OpenDomo Services S.L. tiene disponibles dos versiones (la 1 y 2).

ODControl-picture

Para nuestro objetivo, no es necesario entrar en detalle en varias de las especificaciones técnicas de cada una, si bien es interesante saber las funcionalidades de ambos productos, especialmente en la versión 2 que es en la que nos centraremos en un primer momento.

 

ODControl 1

ODControl 2

Parámetro

Valor

Parámetro

Valor

Número de salidas digitales

8

Número de salidas digitales

8

Número de entradas digitales

8

Número de entradas digitales

8

Número de entradas analógicas

8

Número de entradas analógicas

2

Número de salidas analógicas

0

Número de salidas analógicas

2

Bus IP (RJ45)

1

Bus IP (RJ45)

1

Protocolos

UDP, HTTP

Protocolos

UDP, HTTP

Puertos virtuales

48

Puertos virtuales

61

 

Obviamente, el número de puertos es limitado luego según las necesidades de la instalación puede ser necesario utilizar para cada una de las localizaciones más de un ODControl.

La configuración de cada ODControl se realiza accediendo mediante un navegador web a la dirección IP asignada al controlador (por defecto 169.254.0.15), lo que da acceso a la aplicación Configurator. Desde ella es posible visualizar el estado de los puertos digitales de salida y de entrada, pero también podremos configurar los puertos, ejecutar comandos o realizar tareas de mantenimiento (cambio de IP’s, contraseñas, nombre, etc)

Para simplificar la configuración, ODControl permite el uso de plantillas predefinidas. El usuario puede crear las que desee y posteriormente replicarlas en otros de sus ODControl o descargar desde el sitio web de OpenDomo aquellas que le resulten interesantes y que otros usuarios han compartido. Así, por ejemplo, si deseamos una instalación para el control de 8 puntos de luz (plantilla que podemos encontrar en la web) la configuración de los puertos (asignar nombres a los puertos de entrada, activarlos… ) simplemente se reduce a cargar la plantilla.

Además de los puertos físicos ODControl también posee puertos virtuales. Estos puertos permite el almacenamiento de manera temporal o persistente de valores para ser utilizados posteriormente. El valor que guardan puede venir calculado por alguna operación booleana o aritmética entre otros dos puertos, por la finalización de un disparador (día, fecha o cuenta atrás) o el resultado de una operación de comparación donde el puerto virtual se activará (1) en caso de que la condición sea cierta.

Por último, el ODControl posee una gran cantidad de comandos que puede ser ejecutados desde el propio Configurator o mediante llamadas externas al puerto 81 utilizando el protocolo HTTP. Este tipo de comunicación va autenticada pero no cifrada, por lo que únicamente resulta conveniente su uso en entornos controlados. Como se verá a lo largo del desarrollo este va a ser el principal mecanismo de comunicación entre VisualDomo y ODControl.

+Info: Comandos ODControl
+Info: OpenDomo Lightweight Encryption Protocol (ODLEP)

Un nuevo proyecto: VisualDomo

viernes 13 de junio de 2014

logoODS

Tras unos meses de sequía por compromisos varios, en los próximos meses voy a desarrollar un nuevo proyecto: VisualDomo,una aplicación para dispositivos móviles que permite el control de manera visual de dispositivos ODControl.

ODControl es un controlador con posibilidad de conexión IP desarrollado por la empresa OpenDomo Services S.L.. Este controlador permite actuar sobre diferentes dispositivos electrónicos gracias a varios puertos tanto de tipo analógico como digital, lo que lo hace muy adecuado para el control de instalaciones domóticas.

El objetivo del proyecto es facilitar al usuario el manejo de su instalación domótica, permitiendo definir su localización mediante la carga de planos y controlar cada uno de los aparatos conectados a los puertos de manera sencilla.

Las propia idiosincracia del proyecto implica la posibilidad de abarcar el mayor número posible de dispositivos móviles existentes, no únicamente por configuración física (tabletas o móviles) sino también por la variedad de plataformas existentes. Además los productos OpenDomo están en constante evolución, lo que hace complicado el mantenimiento de varias aplicaciones. Por todo ello se ha decidido utilizar para el desarrollo el framework PhoneGap/Cordova, que permite mediante tecnologías web (HTML5+JS+CSS3) crear un único código fácilmente compilable en distintas plataformas.

Además de su valor empresarial, el proyecto también tiene carácter académico y educativo ya que se presenta como Trabajo Final del Master Universitario de Software Libre, impartido por la Universitat Oberta de Catalunya (UOC).

La idea es  crear durante estos meses una serie de posts que hablen sobre el proceso de creación, centrándome especialmente en la parte técnica.

+Info: opendomo
+Info: ODControl
+Info: cordova
+info: Univesitat Oberta de Catalunya

Firmando aplicaciones Android

jueves 18 de julio de 2013

Todas las aplicaciones que vayan a ser instaladas en un Android (ya sea en un terminal o el emulador) deben estar firmadas. Esto es así porque Android utiliza esa firma para identificar a la aplicación que está realizando cualquier tipo de petición ya sea al sistema o a otras aplicaciones.

En principio se podía pensar que para poder firmar Google o alguna entidad nos tendría que dar algún tipo de certificado que “confirmara quien somos” (algo así como la FNMT en España, que nos proporciona el DNIe), pero no hace falta: las aplicaciones Android pueden ser firmadas con certificados personal, es decir, creados por nosotros mismos.

El proceso de firmado es sencillo, de hecho lo hacemos cada vez que compilamos. En modo depuración, Eclipse firma con unas firmas públicas todo los apk que genera para que así puedan ser instalados en el emulador. Esas claves se encuentran en (en Linux y MacOSX) ~/.android/debug.keystore y las genera cuando se compila por primera vez.

ATENCIÓN: Es posible cambiar la ubicación del fichero de almacén de claves (debug.keystore) desde  Eclipse/ADT, yendo a Windows > Preferences > Android > Build.

ATENCIÓN: si la firma caduca, sólo tenéis que borrar el fichero y Eclipse generará otro.

Esta firma es de acceso público (las contraseñas son “Android” y el alias de la clave es: “androiddebugkey”) por lo que a la hora de distribuir la aplicación, debes generarte tu propia firma.

¿Cómo generar mi clave?

Hay dos formas: una usando la herramienta de línea de comandos keytool (tal como se explica aquí) y otra con el  propio Eclipse. Para ello vamos al ficheros Manifest.xml de nuestro proyecto y en la pestaña Manifest, pinchamos sobre la opción Uses the Export Wizard.

Esta acción arranca el asistente para la exportación de aplicaciones Android, que nos va a permitir utilizar nuestras claves ya guardadas o crear unas nuevas. Las claves se agrupan en lo que se llama almacén de claves o keystore. Como el objetivo es crear nuestra clave, en la primera ventana seleccionamos Create new keystore, seleccionamos la ubicación de nuestro almacén y le ponemos una contraseña.

¿Hay que firmar cada aplicación con una firma distinta?

No es necesario ni recomendable. Lo más habitual es firmar todas las aplicaciones que vayas desarrollando con la misma firma. Hay varias razones. Una es la la creación de actualizaciones: todas las versiones de una aplicación deben ir firmadas con la firma, o no se podrán actualizar. Además,  si queremos conectar varias de nuestras aplicaciones, la única manera será la utilización de la misma firma en todas ellas.

¿Qué es el periodo de validez?

Indica la caducidad de la firma, pero sólo a efectos de instalación. Es decir, una vez instalada la aplicación aunque la firma caduque la aplicación seguirá funcionando perfectamente. A la hora de indicar el tiempo, hay que pensar en la vida presumible de la aplicación (con sus versiones) y de todas aquellas que vayamos a firmar con la misma clave. Es por eso que se recomienda duraciones largas.

ATENCIÓN: Si estás pensando en subirla a Google Play, la firma tiene que caducar obligatoriamente después del 22/10/2033.

Como hacer una calculadora simple en Android (y II)

domingo 24 de junio de 2012

En la entrada anterior estuvimos diseñando la layout de nuestra calculadora. Ahora toca hacer que funcione 🙂

Código

Aparte del algoritmo básico de la calculadora, lo principal es darle funcionalidad a los distintos botones. Para ello vamos a hacer uso de los listeners.

Un listener (o “escuchador” en español) es un objeto de una clase que implementa un interfaz que “le obliga” a tener una función que se ejecutará en el caso de que se produzca un evento determinado. Dicho así queda confuso, así que lo mejor es implementarlo para nuestra calculadora.

Lo primero será crear para cada uno de los recursos de la calculadora una variable de control, por ejemplo:

private EditText _edit;
private Button _b1;

Lo siguiente es asignar a cada una de estas variables, los objetos de cada uno de los recursos que ya han sido creados por la función setContentView(R.layout.main);. Para ello utilizamos la función miembro de la clase Activity findViewById, que busca un recurso por su identificador. En nuestro caso, y siguiendo con los dos recursos anteriores;

_edit = (EditText)findViewById(R.id.editTextos);
_b0 = (Button)findViewById(R.id.button0);

Y por fin, el listener. En nuestro caso tenemos 16 botones, pero 10 de ellos tiene un funcionalidad similar: queremos que al pulsar, aparezca en la casilla de edición el número que aparece como texto en el botón. Es por esto, que en vez de hacer 10 listeners para cada uno de los botones, optamos por la creación de un único listener común a todos ellos:

View.OnClickListener lsBoton = new View.OnClickListener() {
     @Override
     public void onClick(View arg0) {
         _edit.setText(_edit.getText()+((Button)arg0).getText().toString());
     }
};

Analicémoslo:

View.OnClickListener, es un interfaz que han de implementar aquellas clases que vayan a crear objetos listeners. Para no crear la clase ya que solo va a tener un uso mu concreto, hacemos un new del interfaz, pero definiendo la función que el listener nos “obliga” a tener, en este caso OnClick(). Dicha función recibe como argumento la View del recurso sobre el que se pincha (arg0), así que son un casting  podemos obtener de manera sencilla el valor del rótulo del botón.

Sólo nos queda asociar este listener a nuestro botones:

_b1.setOnClickListener(lsBoton);

Sólo nos queda repitir este paso para todos los botones numéricos, repitir un proceso similar con los botones de las operaciones y aplicar la lógica de la calculadora.

Extra

Existe otras dos  posibilidades para asignar el listener al botón.

La primera es definirlo desde el propio layout. Simplemente se le añade la propiedad android:onClick, dándole como valor la función a la que se llamará en el caso de producirse el evento Click. Por ejemplo:

android:onClick="funcion"

La segunda es hacer que la propia Activity implemente el interfaz View.OnClickListener, con lo cual será necesario definir la función onClick en su interior, pero podríamos asignar el objeto this como valor a las funciones de asignación de listeners

_b1.setOnClickListener(this);
class Calculadora extends Activity implments View.OnClickListener {
     ...
     @Override
     public void onClick(View v) {
           ...
     }
     ...
}

Puedes acceder al código de la calculadora en github
+ Info en | Android developers

 

Como hacer una calculadora simple en Android (I)

jueves 21 de junio de 2012

En estas dos entradas vamos a crear una primera aplicación en Android, consistente en una calculadora que únicamente procese números enteros. La idea es manejar el TableLayout y los listeners.

Creando el proyecto

Para empezar desde Eclipse, seleccionamos File/New/Android Project… Le damos como nombre de proyecto Calculadora, elegimos una de las plataformas que tenemos instaladas y en la última ventana elegimos el nombre del paquete al que pertenece la aplicación. Este nombre es importante, ya que será el nombre completo con el que la aplicación será conocida, y podría entrar en conflicto con otras aplicaciones si el nombre se repitiera. En este caso ponemos: edu.uhuru.moviles.android.Calculadora

Creando el layout

Vamos al fichero main.xml que está dentro de la carpeta res. En ese fichero se define el diseño de la actividad principal (y única en nuestro caso). Desde el diseñador gráfico incluímos un TableLayout.

Nota: en muchas ocasiones puede ser interesante insertar los layouts en la ventana de Outline, que muestra el árbol de recursos de la Activity

Los layouts son los elementos invisibles pensando para controlar la distribución, posición y dimensiones de los controles que van en su interior. Hay varios disponibles, pero en este nos decidimos por un TableLayout, que organiza a sus hijos en forma de tabla. Se compone de elementos TableRow (filas). Cada fila puede contener cero o mas celdas. El ancho de la columna viene normalmente definido por el ancho de la celda más ancha, aunque siempre es posible aplicar algún atributo para jugar con el tamaño de las columnas.

Por defecto se nos crean 4 filas, así que añadimos una más simplemente arrastrando desde la paleta de controles una TableRow. Una vez añadida, procedemos a ir incorporando a cada fila los distintos recursos:

  1. Fila 1: 1 EditText
  2. Fila 2: 4 Buttons
  3. Fila 3: 4 Buttons
  4. Fila 4: 4 Buttons
  5. Fila 5: 4 Buttons

El siguiente problema es como hacer “crecer” el EditText para que ocupe las 4 columnas. Para ello utilizamos la propiedad  layout_span=”4″, que al igual que en HTML, nos expande la columna para que ocupe 4 columnas. Para colocar estas propiedades es casi más recomendable (y rápido) dejar el editor visual y trabajar directamente sobre el HTML:

<EditText  android:id="@+id/editTextos" 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
            android:layout_span="4" />

A continuación hay que ajustar los botones, para que se repartan de manera equitativa por todo el ancho de la actividad. Para ello utilizamos la propiedad android:stretchColumns=”*”, que indica que columnas (en nuestro caso todas, *) pueden expandirse para absorver el espacio libre dejado por las demás columnas a la derecha de la pantalla. De esta forma, los botones aparecerán ya compensados. O al menos aparentemente. El problema vendría si alguno de los botones tuviera más de un caracter (por ejemplo si pusiéramos  +/- , MR …). En ese caso, todos los botones de la columna de ese botón aumentaría su ancho. El problema se soluciona de una manera simple mediante  el uso de la propiedad  android:layout_weight=”1″.

Esta propiedad indica el peso relativo que ha de tener ese recursos con sus hermanos. Por ejemplo, si a 3 de los botones les pusieramos android:layout_weight=”1″ y al cuarto android:layout_weight=”2″, este último sería el doble de ancho que el primero. Como en nuestro caso queremos tener todos del mismo ancho indicamos android:layout_weight=”1″.

Por otra parte, necesitamos indicar al renderizador que el ancho de los botones no ha de ir en función de su tamaño “natural” (cuanto más texto tenga dentro, más grande). Por ello cambiaremos el ancho de wrap_content a 0dip. Juntando cada una de estas dos opciones en uno de los botones (por ejemplo el 7) quedaría:

<Button android:id="@+id/button7"
         android:layout_width="0dip"
         android:layout_height="wrap_content"
         android:text="7"
         android:layout_weight="1" />

Por último, para darle los últimos detalles estéticos, vamos a justificar el texto del EditText a la derecha, a no permitir la edición y a ocultar el cursor. Para ello, modificamos el EditText añadiendo:

<EditText  android:id="@+id/editTextos" 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
            android:layout_span="4" 
            android:editable="false"
            android:gravity="right"
            android:cursorVisible="false" />

 

Programar dispositivos Android: Herramientas e instalación.

jueves 24 de mayo de 2012

Lo primero es descargarse e instalar las herramientas necesarias Herramientas:

  1. JDK 6: Se puede encontrar aquí para los 3 SO principales.
  2. Eclipse. Va a ser nuestro entorno de desarrollo (IDE). Desde el sitio de descargas es posible bajar varias versiones. En principio con la Eclipse Classis es más que suficiente.
  3. SDK Android. Se puede descargar de aquí y posteriormente descomprímirlo en un carpeta. En este paquete realmente sólo se encuentran las herramientas básicas que proporciona el SDK. Para empezar a trabajar es necesario descargarse al menos una plataforma de Android y las herramientas de plataforma.
  4. Instalar ADT (o lo que es lo mismo Android Development Tools). ADT es un plugin para Eclipse que ayuda al desarrollo de aplicaciones para Android. Para ello dentro de Eclipse, en la opción Working with que se encuentra en Help / Install new software… se debe añadir la URL: https://dl-ssl.google.com/android/eclipse/. Una vez añadida se conectará y mostrará en la parte inferior la entrada Developer Tools. Hay que seleccionarla y darle a siguiente. Este último paso puede dar problemas de dependencias por varias razones: a)  si estás con una versión relativamente antigua de Eclipse (Galileo – 3.5). Para evitar este problema añade la url http://download.eclipse.org/releases/galileo en Available Software Sites dentro del menú Window / Preferences. b) Si has instalado Eclipse mediante los paquetes que te ofrece tu distribución de Linux. En ese caso has de incluir en Windows / Preferences / Install/Update / Available Software Repositories, el repositorio de tu versión de Eclipse. Por ejemplo, https://download.eclipse.org/releases/indigo
  5. El siguiente paso es la instalación de las plataformas. Para ello lo primero es indicarle a Eclipse donde se encuentra el SDK descargado en el paso 3, lo que se hará desde Window / Preferences / Android. Una vez indicada la ruta, dentro en Window /SDK and AVD Manager encontraremos las opciones para cargar las plataformas. En available packages se encuentran los paquetes disponibles para la instalación, mientras que en Virtual Devices y en installed packages están emuladores y plataformas instalados respectivamente. Una vez instaladas las plataformas, instalar un emulador es muy sencillo.

Te recomiendo que utilices la última versión de Eclipse (en el momento de escribir estas líneas es Indigo, la 3.7) para evitar problemas. Si desde tu distribución Linux no tienes aún acceso a ella, puedes seguir este pequeño tutorial, que te ayudará a instalarla. Fácil ¿verdad?. Ahora ya está todo preparado para poder empezar a programar.