Aplicacion CuentaCaracteres, parte 1
Tutorial creado con Xcode 2
Hoy os presentamos nuestra nueva aplicacion Cocoa, CuentaCaracteres. Dividido en dos partes, ya que explicamos muchismas cosas al ser nuestra primera aplicación, despues del Hello World. Es una aplicación sencilla de un solo documento (ahora explicamos eso) que dado un texto de entrada, nos dice cuantos caracteres posee. No creo que esta aplicación la utilicemos en nuestro dia a dia, pero para aprender nos viene de lujo.
Primero creamos nuestro proyecto como anteriormente lo haciamos, abriendo Xcode pero con una salvedad. En el asistente de creacion de proyecto de Xcode seleccionamos Cocoa Application. La diferencia entre Cocoa Application y Cocoa Document-based Application es sencilla, la primera no es capaz de crear instancias del mismo programa y la segunda si lo es (por ejemplo Firefox, TextEdit..). Para nuestra aplicación, nos interesa que sea Cocoa Application, debido a que no queremos tener varias ventanas de la misma aplicación.
De vuelta al proyecto, seleccionamos Cocoa Application y le indicamos el nombre y la ruta donde guardarlo y comenzamos.

Con el proyecto creado, vamos a seguir unas pautas muy tipicas en toda aplicación sencilla de Cocoa, empezar primero por el documento NIB, es decir por la interfaz grafica. Por lo tanto intentamos realizar una interfaz gráfica parecida a esta de las imagenes con las herramientas que nos proporciona Interface Builder.

En esta interfaz, hay varias cosas a las que prestar bastante atención como el tamaño del TextField (ampliable al seleccionarlo), el nombre del boton (posible cambiarlo al pinchar sobre el) o que el segundo NSTextField ocupe bastante ancho en la aplicación.
En este momento vamos a crear una subclase de NSObject (superclase de las que heredan todas las clases en Cocoa), llamada Controlador, encargada de tomar los datos del NSTextField de entrada y escribirlos en el de salida, en el momento que se pulse el botón Contar. Para ello, estando en Interface Builder, pinchamos en Classes en una de las ventanas del mismo y navegamos hacia la izquierda hasta encontrar NSObject, para hacer botón derecho y seleccionar Subclass NSObject, dandole nombre Controlador.

Teniendo ya nuestra clases creada y llamada Controlador, vamos a crear sus atributos y metodos. Basicamente, en Cocoa un enlace a un objeto es un outlet(parecido a un atributo) y un método, una action. Para crearlas, debemos hacer botón derecho sobre el nombre de nuestra clase y elegir Add Outlet. Tenemos que crear dos, uno llamado salida y otro entrada, los dos de tipo NSTextField, de esta forma:

Y pinchamos en Actions y añadimos una action, llamada contar, pinchando en Add como con los outlets para tener esto:

Ya tenemos creado nuestro actions y outlets, y nuestro siguiente paso es conectarlo con la interfaz. Este paso es muy curioso, tremendamente sencillo pero sumamente importante. Primeros debemos crear una instancia de nuestra clase Controlador, pinchando en su nombre en el navegador de clases (donde pinchamos en Add Outlet) y hacemos Instantiate Controlador para crear una instancia de nuestra clase. Este paso nos llevara a la pestaña Instances.

Ahora, todos atentos, tenemos dos outlets llamados entrada y salida, y un action llamado contar. Entrada es el campo de texto donde introducimos el texto, el grande, luego nuestro controlador tiene que ser consciente de que existe este texto, y asociarlo al outlet entrada. Pinchamos con control y el boton izquierdo en el controlador y no los soltamos hasta el campo de texto de entrada, para asociarlos y pinchar en connect en el outlet de entrada, en la ventana de outlets. Lo mismo con la salida, pinchamos en la instancia en la clase, sujetando el control, y lo arrastramos hasta el campo de texto de salida, el que dice System Font Text, y soltamos. Ahora lo conectamos al outlet de salida en la ventana de outlets. Para conectarla action, contar, tenemos que hacerlo al contrario, hacemos Control+Clic sobre el boton Contar, y nos desplazamos hasta nuestro Controlador, soltamos y pulsamos connect en la action Contar:. Todo debe quedar como en estas dos imagenes.
Esta práctica para conectar Objetos con su controlador, es muy tipica en Interface Builder, y debeis tenerla clara. Tenemos como que presentar los objetos, haciendo Control+Clic desde el objeto que necesita conocer, hacia el objeto del que es necesario conocer. Esta explicacion esta traducida del libro de Aaron Hillegas, y es muy útil.
En este momento tenemos conectados todos los objetos a nuestro controlador, y como ultimo paso de esta parte, seleccionamos nuestra clase controlador en el navegador de clases, hacemos botón derecho sobre ella, y seleccionamos Create Files For Controlador.
Y como respuesta a esta acción, Interface Builder nos ofrece guardar los archivos creados para la clase Controlador en el mismo directorio del proyecto. Elegimos guardar, para que el sistema cree dos archivos Controlador.h y Controlador.m, cuyo contenido explicaremos en la segunda parte de este tutorial.
Si teneis alguna duda, por que no entendais algo o por que no me hay explicado lo suficientemente bien, contactar conmigo en la sección Contacto, y estaré encantado entre los dos solucionar las dudas.
Posteado en Cocoa


Octubre 2nd, 2007 at 12:08 am
Al final vas a hacer que aprenda cocoa…
bajo tu cuenta y riesgo…
Advertido quedas…
¡Sigue asi, muy bueno!
Octubre 2nd, 2007 at 11:15 am
[…] con CuentaCaracteres y para los que no sepáis de lo que estamos hablando, leed este anterior post. Si recordáis por donde nos quedamos, seguro que terminasteis de hacer […]
Octubre 9th, 2007 at 11:00 pm
Muy bueno!
No te voy a mentir, esto de conectar me volvió un poco loco jejeje.
Muchas gracias!
Octubre 9th, 2007 at 11:05 pm
Hola a todas, muchas gracias por los comentarios.Rodrigo si tienes alguna duda, mandame un email y hablamos. Gracias
Enero 7th, 2008 at 1:01 am
Recién leo tu respuesta.
Muchas gracias por el ofrecimiento, sin dudas en algún momento estaré molestándote con alguna pregunta.
Por el momento estoy lidiando con XCode 3.
Un abrazo.
Enero 11th, 2008 at 10:25 am
Vaya pues se ve muy bien. me he quedado varado por que tengo leopard y el interface builder es muy , pero muy diferente y no ato ni desato para armar la clase controlador.. pero bueno.. seguire investigando
Enero 31st, 2008 at 5:02 pm
Thanks for sharing
Febrero 15th, 2008 at 7:32 pm
I’d prefer reading in my native language, because my knowledge of your languange is no so well. But it was interesting! Look for some my links:
Marzo 24th, 2008 at 2:31 am
I’d prefer reading in my native language, because my knowledge of your languange is no so well.
Julio 8th, 2008 at 1:23 am
[…] a todos los emails y comentarios recibidos, he decidido volver a realizar este sencillo programa pero para Leopard y su Xcode 3.0. Decir primero, que este tutorial esta realizado con el […]