Píldora xCode #6: Cómo usar un UISegmentedControl en Objective-C (iPhone SDK programming tutorial)

Los controles de Cocoa UISwitch son un modo muy elegante de habilitar opciones de configuración cuando tenemos dos valores.

Sin embargo, a menudo necesitamos más de dos estados para seleccionar una configuración o un modo de trabajo más complejos.

En estos casos, el programador de iPhone iOS cuenta con un control denominado UISegmentedControl que nos permite definir un número arbitrarios de estados, llamados segmentos.

En la píldora xCode #5, habíamos visto que necesitábamos algo más que un UISwitch para regular los tres estados de nuestro botón  personalizado: Activo (enabled=YES), Inactivo (enabled=NO) y Oculto (setHidden=YES).

En esta nueva píldora, vamos a utilizar un control de segmentos para programar los tres estados de nuestro UIButton, tal como vemos en esta captura de pantalla:

Nuestro UISegmentedControl en acción

He aquí el vídeo tutorial correspondiente a la Píldora xCode #6:




Tal como se explica en el vídeo tutorial, no tenemos más que definir nuestro UISegmentedControl, crear una IBAction que responda a los cambios de valor y escribir dos líneas de código, como vemos en este extracto del proyecto XCode:

   
    - (IBAction)segmentedClicked:(UISegmentedControl *)sender {
    
    okButton.enabled = sender.selectedSegmentIndex == 0;
    [okButton setHidden:sender.selectedSegmentIndex == 2];
}

¡ Hasta la próxima píldora !

Píldora xCode #5: Cómo usar un Switch Control (iPhone SDK UISwitch Programming)

En el pasado ejemplo de la Píldora xCode #4, nos faltaba por mostrar el gráfico que habíamos creado para el estado Disabled de nuestro Custom Button.

En este nuevo tutorial, vamos a utilizar un control iOS de tipoi Swtich para habilitar y deshabilitar el botón personalizado de la píldora anterior.


Según vemos en este vídeo, no hay más que crear un Outlet que apunte al botón que deseamos habilitar/deshabilitar y usar la propiedad ".enabled" del botón, leyendo de la propiedad ".on" del Switch Control.


En la próxima píldora, (Píldora xCode #6), ampliaremos este ejemplo usando un Segmented Control, que nos permitirá ocultar y mostar el control, además de habilitarlo y deshabilitarlo. Hasta la vista.

Píldora xCode #4: Cómo crear botones personalizados tipo Custom Button (iPhone XCode 4 UIButton Custom programming)

Probablemente nada delate tanto a una aplicación iPhone/iPad de amateur como el uso de los botones estándar del Xcode.

Por tanto, una de las primeras cosas que debemos aprender -si queremos que nuestra aplicación iOS tenga un aspecto profesional- es a crear botones personalizados.

Básicamente, tenemos dos vías:

a) Crear el aspecto personalizado de nuestro botón mediante llamadas Cocoa para crear líneas, fondos, degradados, etc. Es el camino más flexible, pues nos permite tener botones totalmente adaptables a diversas resoluciones sin pérdida de calidad. Sin embargo, también es el más costoso, ya que tenemos que hacer un trabajo que es básicamente gráfico, a través de llamadas de la API.

b) Diseñar nuestros botones en un programa gráfico, exportarlos en formato PNG y aplicar los gráficos creados a un botón personalizado. Es, sin duda, la opción más flexible, ya que podemos usar toda la potencia gráfica de nuestro programa favorito (Photoshop, Fireworks, Xara, ...).

En este tutorial, vamos a mostrar esta segunda opción que, como veremos, es muy fácil de implementar, una vez que tenemos diseñados los gráficos de los botones.

Para este ejemplo, he creado tres imágenes PNG, una para cada estado, según vemos a continuación:

Selected/Default (okButton-SELECTED.png, 100 pix X 50 pix)

Highlighted (okButton-HIGHLIGHTED .png, 100 pix X 50 pix )

Disabled ( okButton-DISABLED.png, 100 pix X 50 pix)

Hay que tener en cuenta que, tras la aparición de los dispositivos con pantalla retina (iPhone 4 y siguientes, iPad 3 y siguientes, iPod Touch de nueva generación), es necesario incorporar versiones de alta resolución de cada una de las imágenes. Para ello, no tenemos más crear, para cada una de las imágenes, otra de doble resolución vertical y horizontal, y asignarle el mismo nombre del fichero original, pero terminado en @2x, tal como vemos a continuación:

Selected/Default (okButton-SELECTED@2x.png, 200 pix X 100 pix)

Selected/Default (okButton-HIGHLIGHTED@2x.png, 200 pix X 100 pix)

Disabled ( okButton-DISABLED @2x.png, 200 pix X 100 pix)

Según vemos en el vídeo, debemos importar las dos versiones de cada una de las imágenes, pero asignar solamente las versiones de baja resolución. Al ejecutarse la aplicación en un dispositivo retina, el framework Cococa ya se encarga automáticamente de reemplazar cada imagen por su versión de doble resolución (la que acaba en @2x).


En la próxima píldora (Píldora xCode #5), veremos cómo activar el estado Disabled, aprovechando la explicación de los controles tipo switch:

 

Píldora xCode #3: Cómo dividir un literal String en varias líneas de programa Cocoa

La buena programación tiene tanto de ciencia, como de estética. A diferencia de los compiladores, las personas necesitamos de buenas pautas semánticas -tales como la acertada elección de los identificadores de variables, objetos, funciones...- como visuales -tal como la ordenada disposición del código mediante una correcta indentación, uso de espacios, etc.-.

Segmento de código desordenado, El literal String está pidiendo a gritos ser cortado en varias líneas.

Una de las necesidades que a menudo surgen al programador de Cocoa, es separar un literal String constante en varias líneas. La correcta división en líneas, cortando por los puntos adecuados, puede suponer la diferencia entre un segmento de código claro, legible y correcto y un auténtico galimatías que nos haga perder tiempo.

El mismo segmento de código del ejemplo previo ya ordenado. Pero, todavía, no es sintácticamente correcto en  Cocoa.  

Haz click en el vídeo de la Pildora xCode #3 para ver cómo escribir correctamente un literal Objective-C en varias líneas de programa.

    
    
    NSLog(@"\n\Mi variable unEntero: %d\n"
          "Mi variable unDouble: %g\n"
          "Mi variable unFloat: %f\n"
          "Mi variable unString: %@\n", unEntero, unDouble, unFloat, unString );

Una última idea: Recuerda que el grueso del tiempo de programación nunca se emplea en escribir el programa, sino en depurar los errores una vez escrito. Un minuto de más dedicado a escribir un código claro, comprensible y elegante, puede suponer un ahorro de horas de sufrimiento posterior.

Hasta la próxima píldora. Ciao.

Píldora xCode #2: Cómo usar NSLog para escribir en la consola con Objective-C (iPhone XCode 4 SDK)

Los mejores programadores no se caracterizan por no cometer errores. Lo que les distingue del resto es, entre otras cosas, su capacidad para depurar los errores que cometen en menos tiempo que la media.

A pesar de las muchas técnicas disponibles hoy día para ayudarnos a depurar nuestros programas, la práctica de hacer log en la consola sigue siendo una de las principales herramientas en la mano del programador Objective-C.

El entorno iOS Cocoa, nos ofrece una función del Foundation Kit denominada NSLog(), según podemos ver en la documentación oficial de Apple.

En esta píldora xCode, mostramos el uso básico de la consola para depurar tu programa, así como una referencia de los especificadores de formato que se pueden usar para mostrar las variables, según figura en la siguiente tabla:

Especificadores de formato para NSLog y printf() en Objective-C con Cocoa-Touch para iOS.

También mostramos en este tutorial, cómo combinar varias llamadas NSLog() en una sola, con las ventajas e inconvenientes que presenta.


En la próxima píldora xCode (Píldora xCode #3: Cómo dividir un string literal de Objetive-C en varias líneas) os presentaremos un truco para solucionar los problemas que se presentan redactar un literal con especificadores de formato demasiado largo.

Como referencia, también os dejo aquí el código del tutorial:

    NSLog(@"Pulsa botón 1");
      
    int unEntero = 254;
    double unDouble = 6.789;
    float unFloat = 3.1416;
    NSString *unString = @"Píldora xCode #2";

    NSLog(@"Mi variable unEntero: %d", unEntero);
    NSLog(@"Mi variable unDouble: %g", unDouble);
    NSLog(@"Mi variable unFloat: %f", unFloat);
    NSLog(@"Mi variable unString: %@", unString);

    
    NSLog(@"\nMi variable unEntero: %d\nMi variable unDouble: %g\nMi variable unFloat: %f\nMi variable unString: %@\n", unEntero, unDouble, unFloat, unString );
    

Nota: El código ha sido formateado con las librerías de Google Prettify, gracias a las instrucciones facilitadas por Heiner Peuser en este artículo de su blog, donde describe cómo agregar las librerías usando un gadget de blogger. ¡Gracias Heiner!

Nos vemos en la próxima píldora xCode. Ciao.

Píldora xCode #1: "Hola mundo", tu primera aplicación Xcode en Objective-C. (iPhone SDK XCode 4 programar Hello World)

Los primeros pasos de un bebé son siempre los más difíciles. Al enfrentarnos a un nuevo lenguaje, entorno de programación o ambos, el hito más relevante es nuestro primer programa.

En esta píldora xCode, aprenderemos a crear nuestra primera aplicación iPhone, sin tener que escribir una sola línea de Objective-C.

Si ya has instalado el entorno de desarrollo xCode, estás a poco más de tres minutos de tiempo de poder crear tu proyecto, diseñar la pantalla y ejecutarlo en el entorno iPhone simulado.

Haz click en el siguiente vídeo para acceder a la primera Píldora xCode.

Si te ha gustado, hay otras píldoras xCode esperándote; vuelve al blog, o suscríbete al canal de youtube en  http://www.youtube.com/josefemenias .

Ciao