Para empezar apenas hay espacio en la ventana al no poder quitarnos de encima los componentes que estorban para rellenar datos, hace falta añadir controles con los que ocultar las zonas laterales, como se hace con la zona inferior. Los botones de menú no se ocultan al pinchar sobre una opción y no se muestran mensajes de “cargando” ni información pertinente, de hecho si ocurre algún error este es ininteligible. El chat no funcionaba, aún así se está sincronizando contínuamente por lo que el ancho de banda que consume es considerable. Internamente no hay una verdadera lógica de programación para los roles de administrador representada en JavaScript, es decir, se mezclan los prototipos de todos los usuarios:usuario invitado, cliente, admin,etc. por lo que cualquier usuario que conociera las url o fuera un poco inteligente podría encontrar un mecanismo de operar con la base de datos de la web usando la ingeniería inversa y consultas en los scripts de JSON que además ya vienen en ficheros .js.

Más allá de mi opinión

Sobre si la decisión de usar Ext JS u otro framework JavaScript como JQuery la dejo a elección del programador porque realmente depende de cómo de cómodo te sientas escrbiendo las piezas del puzzle del portal, en este caso está bastante bien porque se utiliza Firebug para depurar PHP con una consola de estado de Ext JS. Aunque es un poco raro mezclar opensource con freesource, es una buena manera de construir un portal complejo, eso sí, siempre que tengamos claro qué es lo que queremos construir…

Veamos un ejemplo de cómo por medio de una vista del modelo MVC de CodeIgniter, construimos contenido JavaScript para alimentar una acción lanzada desde el portal, la bienvenida:

var Center = Ext.extend(Ext.util.Observable, {
constructor	: function(ui) {
this.ui = ui;
 
this.panel = new Ext.TabPanel({
	title		: 'Center',
        region		: 'center',
	activeTab	: 0,
	autoDestroy	: false,
	items: [
	{
	  title:'Bienvenido',
	  closable	: false,
	  bodyStyle	:'font-family:sans-serif;font-size:12px;',
	  html		:'[contenido]'
    }]
});
}
});

MisClientes = Ext.extend(Ext.Panel,{
    // Prototype Defaults
    propA: 1,
	title: 'Mis Clientes',
	closable	: true,
	iconCls: 'icon-mis-clientes-tab',
 
    initComponent: function(){
        // Called during component initialization
this.fields =[
{name:'cliente', type:'string'},
{name:'nombre', type:'string'},
{name:'email', type:'string'}
];
this.storeGrid = new Ext.data.Store({
 reader:new Ext.data.JsonReader({
  idProperty:'cliente',
  totalProperty:'totalCount',
  root:'rows',
  fields: this.fields
 }),
proxy:new Ext.data.HttpProxy(
 {url: BASE_URL +
  'asignarEntrenador/load_clientes_asig'}),
 baseParams:{entrenador:USER_LOGGED},
 remoteSort:true
});
//...etc.

class Usuarios extends Model {
    public function __construct()
    {
        parent::Model(); // Call the Model constructor
		$this->table_usuarios = 'usuarios';
		$this->table_usuarios_tipo = 'usuarios_tipo';
		$this->table_session = 'dasm_sessions';
		//$this->load->library('firephp');
    }
 
	//TODO: Comprobar que es un admin
	function crear(){
//etc.

class User extends Controller {
 
    public function __construct()
    {
        parent::Controller();
		if (function_exists('force_ssl')) force_ssl();
		$this->load->library('session'); 
 //iniciar libreria de sesiones
		$this->load->library('firephp'); //FIREBUG
		$this->firephp->log("force shhl");
    }
	public function index(){
		$this->login();
	}
 
    public function login()
    {
        if ($this->my_usession->logged_in)
        {
	 $this->firephp->log("login");
//....

Y quizás, usar otra tecnología…¿Google? :’D

Curso de creación de aplicaciones de iOS

Hardware y Software que “nos exigen”

• OSX (Snow Leopard al menos) actualizado a la última versión, para poder instalar el IDE de la manzanita. Nos quieren obligar a comprarnos un Mac, peeero, también podéis instalaros el VMWare Fusion  en un PC (o el VMWare normal pero sin soporte OpenGL), u Oracle VM VirtualBox sobre Windows o GNU/Linux y descargar una imagen de OSX de la red para este software-emulador, e incluso…crearos un Hackintosh, que no es muy caro y están de moda jeje
• XCode 4 + iPhone SDK: podéis descargarlo de Internet si no tenéis dinero para la licencia de developer, aunque si queréis publicar pronto una aplicación podéis daros de alta en el programa de desarrolladores de la empresa, pagando claro!…
• iPhone/iPad/iPod: pues hombre, estaría bien  tenerlo para poder probar lo que escribamos, ya que el simulador (no es un emulador!) que trae el IDE se comporta de manera algo distinta a como debería ser…pero bueno, para empezar tampoco vamos a tirar la casa por la ventana jeje Si tienes un dispositivo intenta instalarte el AppWizard para el siguiente paso -no te diré como conseguirlo-

Hardware de los dispositivos iOS

• El iPhone 4 tiene una resolución de pantalla de 960×640 a 326 ppi.
• El iPhone 3 tiene una resolución de 480×320 píxels
• La resolución del iPad es de 1024×768 a 132 ppi

Habilidades que necesitamos para programar aplicaciones de iOS

• Programar en Objective C: programar aplicaciones de iPhone en XCode es, básicamente, empezar a conocer cómo funciona Objective C y cómo asociar los objetos del Interface Builder a nuestro código. Para eso existen cientos de tutoriales, algunos más famosos que otros como “Masters of the Void“, pero lo mejor es seguir un libro gratuito de la propia empresa (en el apartado de desarrolladores) o ir a una biblioteca y pillarse libros como Objective C for dummies, iPhone application development for dummies, y luego algo más serio como iOs4 Programming Cookbook de O’Reilly, ya que contienen multitud de ejemplos y trucos para desarrollar todo lo que deseemos/necesitemos.
• Hay un libro de la web de MacProgramadores bastante bueno sobre Objective C con especial énfasis en su origen (NeXT) y XCode, lo han borrado de la web, pero seguro que lo encontráis…
  

Introducción a XCode e iOS4 SDK

Conceptos básicos:

XCode

• Xcode es el IDE que nos ofrece Apple para desarrollar aplicaciones de iOS.
• El SDK (Software Development Kit) incorpora herramientas para el desarrollo (entre ellas, el simulador de iPhone/iPad).
• El lenguaje de programación es Objective-C

• Simulador de iOS: Permite simular tanto iPhone como iPad en nuestro Mac.
• Interface Builder: Editor visual para diseñar interfaces de usuario para nuestras aplicaciones.
• Instruments: Herramienta de análisis que nos ayuda a optimizar y monitorizar la aplicación

Sistema Operativo iOS

• El Sistema Operativo de los dispositivos de Apple (iOS), está formado por un conjunto de capas, que conforman el conjunto de servicios ofrecidos por el dispositivo. Arquitectura:
• Cada capa de la arquitectura está compuesta por un conjunto de frameworks
• La capa Core OS es la base del sistema operativo. Se encarga de realizar la gestión de memoria, el sistema de ficheros, conexión a la red y procesos que interactúan con el hardware
• Core Services nos permite el acceso a los servicios básicos, tales como la agenda, el acceso a la base de datos, preferencias, conexión a servidores y procesamiento de URLs, etc…
• La capa Media nos permite la ejecución de tareas multimedia. Entre ella el acceso al Audio, OpenGL, Imágenes y PDF, Animaciones, etc…
• Cocoa Touch nos permite acceder al acelerómetro, los eventos y controles táctiles, la jerarquía de vistas, alertas, etc…gestiona la interacción visual con el usuario
• Novedades de iOS4:

• Multitarea: mientras ejecutamos una aplicación, al pulsar el botón “home” no se cierra sino que pasa a segundo plano, pueden continuar ejecutándose o pueden suspenderse
• Notificaciones Locales: completa el sistema de notificaciones push (desde un servidor remoto que nosotros mismos podemos crear)
• Core Motion: conjunto de interfaces para acceder a toda la información basada en el movimiento (giroscopio ,motion-based)
• Data protection: sistema integrado de encriptación
• Soporte para pantalla de alta resolución (adaptación a la antigua)

• Leer más >

Frameworks

• Un framework es un conjunto de librerías que nos permite añadir una funcionalidad concreta a nuestra aplicación
• Por defecto, cuando creamos un proyecto, tenemos los frameworks esenciales para el funcionamiento básico
• Por ejemplo, para usar bases de datos SQLite usaremos su framework, simplemente con copiar el directorio descargado de su web, aunque en la versión de XCode4 ya viene integrado, también haremos lo mismo con Cocos2D
• Cocoa Touch: conjunto de frameworks orientados a objetos que permiten el desarrollo de aplicaciones nativas para iOS

Crear una aplicación

Pasos

1. Abrir XCode y crear un proyecto
2. Diseñar la interfaz de usuario
3. Escribir el código asociado de la aplicación
4. Compilar, ejecutar y probar (vuelta al paso 2)
5. Medir y ajustar el rendimiento de la aplicación
6. Producir y publicar la aplicación

Tipos de proyecto

• Cocos 2d: para crear juegos (necesita el framework Cocos2D),lo veremos en otro curso, de programación de videojuegos para iPhone
• Navigation-based : presentan la información de forma jerárquica usando múltiples vistas (diseño de pantallas)
• Open GL : igual que cocos, además de juegos podemos crear cualquier tipo de aplicación que represente imágenes, animaciones o gráficos 3D
• Split View-based : Aplicaciones enfocadas para iPad que muestran más de una vista en la pantalla al mismo tiempo (un control listado y una vista detalle de elementos normalmente)
• Tab Bar : presentan una interfaz de “radio” que permite al usuario elegir entre varias opciones
• Utility : aplicaciones que presentan una vista principal y permiten que el usuario acceda a otra vista para realizar personalizaciones básicas
• View-based : una vista simple para implementar la interfaz
• Window-based : plantilla universal (cualquier dispositivo con iOS) que sirve de punto de partida con un delegado y una ventana. Útil para aplicaciones con jerarquía propia

Recordar que no todos los tipos de aplicaciones pueden ser universales (para cualquier iDevice) y las que lo son tienen diferentes diseños de interfaces de usuario en subdirectorios con su nombre.

Interfaz de XCode

XCode4: editor en una ventana

XCode4: Interface Builder

XCode4: Git integrado

Tipos de ficheros de un proyecto

• Info.plist: como todos los plist, es un XML (introducido por NeXT) constituído de propiedades de configuración en UTF-8
• Ficheros.h: declaraciones de interfaces ,clases y atributos
• Ficheros.m: implementación de clases y métodos definididos en los .h (aunque no necesariamente requieren un .h)
• Ficheros .pch: cabeceras precompiladas que se añaden a las clases
• Ficheros de objetivo: resultado de la compilación de un conjunto de ficheros de código, puede ser una librería o una aplicación. Un conjunto de objetivos forman un producto. Lo utilizaremos para publicar una aplicación en la tienda

Perfiles de compilación

• Depuración: incluye la opción de depuración al compilar con gcc, es más lenta pero encuentra errores lógicos. Se puede depurar en el editor de texto, mini-depurador, depurador y en la consola [(gdb)]. Opción: GCC_GENERATE_DEBUGGING_SYMBOLS. Podemos usar breakpoints.
  Mientras el programa está siendo depurado podemos modificarlo (como pasaba en VisualBasic y otros lenguajes! :D) : cambiar el nº y tipo de argumentos de una función o método que esté en la pila,el tipo del valor de retorno o el nombre de una  función o método también en la pila, así como cambiar el tipo de las variables estáticas, un fichero NIB, añadir clases o cambiar sus métodos…
  Leer más >
• Lanzamiento: mayor rendimiento de la app, tamaño de objeto final compilado menor.
• Distribución: como el anterior pero necesita un certificado o firma de Distribución válida (con apple hemos topado xD, aunque podemos arreglar esto con algún que otro truco de Cydia…). Se añade meta-información necesaria para ser validada en la tienda.

Introducción a Objective C

¿Qué es?

• Pequeño set de extensiones de ANSI C
• Sus añadidos a C están basados en Smalltalk, uno de los primeros lenguajes orientados a objetos
• Diseñado para dotar a C de toda la potencia de la orientación a objetos

Clases

• Sintáxis normal de creación de clases: interfaz (.h) + implentación (.m)
  
• Ejemplo de clase Persona.h:

  @interface Persona : NSObject {
  NSString *nombre;
  NSString *apellidos;
  }
  -(NSString*) nombre;
  -(NSString*) apellidos;-(void) setNombre: (NSString *) _Nombre;
  -(void) setApellidos: (NSString *) _Apellidos;
   
  +(NSString *) soyMetodoEstatico: (NSString *)  mensaje;
  @end

  Ejemplo de clase Persona.m:

  #import "Persona.h"
  @implementation Persona
  -(NSString*) nombre {
  return self.nombre;
  }
  -(NSString*) apellidos {
  return self.apellidos;
  }
  -(void) setNombre: (NSString *) _Nombre {
  self.nombre = _Nombre;
  }
  -(void) setApellidos: (NSString *) _Apellidos{
  self.apellidos = _Apellidos;
  }
  +(NSString) soyMetodoEstatico: (NSString *) mensaje{
  return mensaje;
  }
  @end

• Ejempo de función que toma datos de la clase padre de la que hereda:

  - (id) init {
  if ( self = [super init] ) {
  [self setNombre:@"nombre por defecto"];
  [self setApellidos:@"apellidos por defecto"];
  }
   
  return self;
  }

  self es la propia instancia del objeto y super es la clase de la que hereda

• Declaración de un método:
  
• A través del corchete accedemos a un objeto, que es el primer parámetro, el segundo es la llamada al método, es como hacer
  $this->método en PHP , o puntero_a_clase -> método , en C / C++,Java.
  Por ejemplo , un método sin entrada

  [object method];

  Con entrada:

  [object methodWithInput:input];

  Con salida:

  output = [object methodWithOutput];

  Con entrada y salida:

  output = [object methodWithInputAndOutput:input];

• Recordar que si queremos especificar una función con varios parámetros se ponen dos nombres, uno para el nombre clave de llamada y otro para el nombre interno del parámetro, el primer nombre de nombre clave no se pone, ejemplo:
  -(void) miFuncion: (int)parametro1 nombre1: (bool) parametro2 nombre3:(NSString*) parametro3;
  a esta función accedemos así, ejemplo con datos:
  [miObjeto miFuncion:7 nombre1:true nombre3: @"cadena"
  Fijaros que una cadena siempre se precede de una arroba.
• Propiedades de una clase: (@property)
  permiten generar automáticamente métodos de acceso para los atributos de una clase, podemos sobrecargar los métodos setter & getter si no usamos las especificaciones por defecto de una propiedad, para saber cuál nos conviene primero debemos ver la gestión de memoria. Por defecto, el setter se añade automática a la propiedad definida como setNombre_variable (set+UCase(nombre_variable)), y el getter es el nombre de la variable atributo tal cual, en Persona.h el setter es setNombre y el getter nombre. Fácil.
  Para que podamos usar las propiedades es obligatorio inicializarlas con @synthesize en Persona.m (la implementación de la clase),este genera los setters y getters automáticamente. Una vez hecho además podemos especificar en esta línea de sintetización el nombre local del acceso o accesser, algo como @synthesize nombre = _nombre_local;
• Ver más >

Gestión de memoria!: de lo más importante en Objective C

• Con el método dealloc liberamos memoria utilizada en las instancias de nuestras clases, lo vamos a sobrecargar para hacer "release" de todas las instancias de objetos que hayamos creado
• Se debe liberar por completo el propio objeto también ,con [super dealloc] .
• Debemos liberar las variables de tipado fuerte
• Para aprovechar la memoria tenemos que crear nuestro propio “recolector de basura”, algunos ven esto como muy buena idea y otros no son partícipes de que el lenguaje no tenga las bondades de Java…
• Para gestionar qué variables están siendo utilizadas en memoria, tenemos lo que se llama el “contador de referencia” de Objective C, sólo tenemos que especificar qué hacer con las variables al asignarlas, crearlas, copiarlas, pasarlas por parámetro, etc. y la ejecución del programa hace el resto.
• Con alloc inicializamos memoria en función del tipo o clase de una variable, por ejemplo, cuando declaramos una variable de tipo NSNumber con una instrucción como esta:
  NSNumber *number = [[NSNumberalloc initWithFloat:8.75;
  lo que pasa internamente es que el contador de referencias se pone a 1.
• Con retain aumentamos el contador de referencias en uno, por ejemplo si deseamos liberar en un contexto la variable pero no queremos que se pierda la variable porque se usa en otro contexto, por ejemplo:
  -(void) setNombre: (NSString *) _Nombre {
  [self.nombre autorelease;
  self.nombre = [_Nombre retain;
  }
  Usando autorelease se libera al objeto de manera diferida, es decir, es posible usar la variable de la primera línea durante un tiempo más, le dice al compilador que la variable self.nombre se decremente al salir del contexto de la clase de la función setNombre, después le asigna un nuevo valor, el del parámetro, pero a este le dice que lo retenga aunque se borre fuera, para que sea gestionado desde la clase.

• Con release se decrementa el contador en una unidad, si tiene valor 1 ,se borra la variable, es decir, le decimos al sistema que no la necesitamos y éste llama a dealloc automáticamente (primer punto)
  
• Ojo entonces, si por ejemplo creamos un método en una clase para asignar un valor y hacemos que use release para luego hacer retain con el nuevo valor que le pasamos, siendo este no una variable sino una llamada de una función, algo así:
  ________
  - (void) setNombre: (NSString*) _Nombre {
  [self.nombre release;
  self.nombre = [_Nombre retain;
  }
  ...
  persona* ego = [[personaalloc init];
  …
  [ego setNombre:[ego nombre];
  ________
  al llamar a la función setNombre, primero se libera el objeto self.nombre antes de retenerlo, por lo que ya no hay espacio reservado en memoria para esta variable y aquella pasa a estado incoherente ya que el valor que le hemos pasado es precisamente el que hemos liberado, para solucionarlo ponemos autorelease en lugar de release.
• Ahora podremos saber qué tipo de gestión de memoria asignarle a una propiedad, por ejemplo para el nombre en nuestra clase Persona.h:
  @property (retain) NSString* nombre;
  al poner retain hemos declarado que el setter (función como setNombre pero automática) debe hacer retain sobre el valor de entrada. Pero podemos especificar con setter=setNombre nuestra propia función ;)
• A veces tenemos que tener cuidado con lo que liberamos de la memoria, no podemos dejar todo en autorelease porque al pasar la referencia de una variable entre funciones es posible que se libere antes de tiempo, sin embargo de esto nos daremos cuenta cuando el simulador haga CRASH! jaja

Variables

• Tipado débil: int, bool, float, etc.
• Tipado fuerte: objetos como NSString, NSNumber, etc.
• ejemplos de métodos con tipos distintos:

  - (int) multiplica: (int)a por:(int)b {
  return a * b;
  }
   
  - (NSString *) cadenaResultado: (int)resultado {
  NSString *res = [NSString stringWithFormat:@"El resultado es: %d", resultado];
   
  return res;
  }
   
  int resultado = [self multiplica:2 por:3];
  NSString *cadena = [self cadenaResultado:resultado];
  NSLog(@"%@", cadena); //devuelve 6

• Un protocolo (@protocol) permite que la lista de métodos que contienen se puedan implementar por cualquier clase, puede especificarse al crear una clase en su definición de la clase que hereda de otra…

  @protocol MyProtocol
  - (void)requiredMethod;
  @optional
  - (void)anOptionalMethod;
  - (void)anotherOptionalMethod;
  @required
  - (void)anotherRequiredMethod;
  @end
   
  @interface ClassName : ItsSuperclass < protocol list >

• Otro método para depurar es usar el log, la función NSLog(cadena) usa el mismo formato que un printf, recordar el formato:

  NSLog(@”La fecha y hora actual es %@”, [NSDatedate );

XCode Organizer

• Una vez creada la aplicación, si queremos usarla en un iDevice, tenemos que desplegarla (necesita certificado), conectar el dispositivo por USB y probar! Pero también podemos usar el simulador ,aunque no refleja el comportamiento exacto (real) de la aplicación si que sabremos si funciona o no :)

Consejos

Diseñar como un ingeniero y producir como un artista: echad mano de vuestro amigo el arquitecto de información para encontrar la mejor manera para guardar los datos,… no es lo mismo una base de datos en SQLite que un conjunto de ficheros XML.

• Hay que conocer el flujo de la información en el sistema de aplicaciones, por ejemplo un sistema de etiquetas debe ser recurrente en cuanto a que hay tags que se repiten, la forma óptima de hacer esto es como lo hace WordPress o algunas aplicaciones web si lo prefieres. Debemos consultar a nuestro amigo experto en marketing para el nombre del programa, así será el dominio para publicarlo, también nos aconseja qué tipo de características son viables en cuanto a lo que el público demanda y nos da su perspectiva como experto lo bonito, barato y bueno. Efectivamente, necesitamos conocer cómo construir diagramas pero no son indispensables, aunque sería ideal diseñar previamente la app con UML
• Beta tester: antes de empezar si quiera a pensar en querer programar algo para iOS ,lo primero que debemos hacer es conocer los dispositivos, el iOS y OSX, todos los widgets del sistema operativo, así que al menos tenemos que haber probado todas las aplicaciones antes mencionadas, aunque sea en el ifón de un amigo, no vale haberlo visto en vídeo, tenemos que tocar la esencia de la magia de esta tecnología para sentir qué queremos hacer realmente.

Otros tutoriales para conocer el IDE XCode 3: nos sirve para empezar.

• Tutorial 1 Introducción al iphone sdk
• Tutorial 2 : INTERFACE BUILDER

Ahora que conocemos el IDE de la mano de Noemi gracias a sus tutoriales de Youtube, vamos a seguir un poco más adelante, tenemos la ayuda necesitamos aquí:

• Apple Dev Forum
• iPhoneSDK (moderado por Erica Sadun)
• iPhoneSDKForum
• iPhoneDev Forums
• iPhoneSB
• SQLite para iPhone!: recordar cómo se creaban aplicaciones con XCode que usen bases de datos SQLite, se trata de un único fichero que podemos fácilmente exportar ya que utiliza instrucciones SQL.
• Podemos seguir el siguiente tutorial de icodeblog.
• Tutoriales para empezar a programar juegos con Cocos2D

Ejercicios (Deberes :)

1. Ejercicio 1: crear un proyecto tipo “View-based”, crear una clase Persona y otra clase Usuario, establecer propiedades en las clases asociadas a sus atributos, una clase Usuario debe tener un atributo que sea una clase Persona.
2. Ejercicio 2: Crear un NSArray e inicializarlo con clases NSNumber, luego mostrarlo con NSLog
3. Ejercicio 3: Crear un NSMutableArray e inicializarlo con clases Persona, añadir  a dicha clase la función (sobrecargada) description para que NSLog pueda mostrar el contenido de todos sus atributos

Para corregirlo podéis enviármelo con el formulario de contacto.

<< Volver al curso de programación de aplicaciones de iOS

Siguiente: conectar interfaz con el código