La primera fuente que me levanté en mis manos ha sido escrito en básico y consistía en unas pocas líneas de código, para aclararme. Era un juego simple que genera un número aleatorio de 1 a 10 y, a través del teclado, compruebe que el número introducido se Maggioni, menor o igual al número aleatorio. A pesar de su simplicidad en bruto sigue siendo, para mí, uno de los mejores ejemplos - simple, divertida y práctica - para explicar a aquellos que no saben nada acerca de la programación lo que se entiende realmente por "programa de ordenador". Así que me decidí a proponer para el iPhone de Apple, tal vez ayude a alguien ...
En este post vamos a conseguir una versión particular de "Adivina el número" y llamar a FirstApp. Después volver a escribir la misma aplicación con diferentes métodos, tales como la creación manual de una UIView o saliendo de Interface Builder.
La aplicación ya está hecho, si lo que desea es descargar, está disponible en mi repositorio de Google Code:
1 - Comenzamos
Abierto XCode, seleccione Nuevo proyecto en el menú Archivo y elegir, para esta versión, desde el clásico Ver aplicación basada en (la próxima vez que inicio desde la ventana de aplicación basada en obtener exactamente el mismo resultado). Llame al proyecto FirstApp y guardarlo en el que más le convenga.
Como se puede ver todavía estoy utilizando la versión de Xcode para SDK 2.2.1, SDK 3.0 no se debe a que todavía están "muy" estable. Tenga en mente esta imagen como la nueva versión de Xcode algunas plantillas no son del todo idénticas, y algunas cosas cambiarán. Pero por ahora no es necesario preocuparse por esto a menos que ya estaban usando la última versión de Xcode.
En esta versión se usará Interface Builder y luego, en primer lugar, vamos a sacar nuestra interfaz de usuario. Vamos a abrir la carpeta de recursos y haga doble clic en FirstAppViewController.xib . Este archivo se encuentra justo en Interface Builder, que el archivo MainWindow.xib (véase también la extensión del archivo que nterface B uilder X).
Los controladores de otros siempre se colocan en esta carpeta. Las carpetas restantes contienen todos los demás archivos de nuestra aplicación y, en particular, vamos a trabajar mucho en las clases de la carpeta.
Volviendo a Interface Builder nos encontramos con una pantalla en blanco que representa nuestra View , el contenedor se colocará en los objetos de nuestra interfaz de usuario UIKit. Este objeto visual que estamos viendo con Interface Builder se conecta a un archivo FirstAppViewController.m (and. h) presente en la carpeta de clases.
En la ventana de la biblioteca son todos los componentes visuales para crear interfaces estándar, agradable y accesible en nuestro iPhone de Apple.
Estos son fácilmente clasificados por tipo (ver la carpeta azul en la parte superior). Para incluirlos en nuestra opinión, sólo tiene que seleccionar el componente de la Biblioteca y arrastrarlo a la nuestra ventana Ver fienstra, donde podía ubicarlo, cambiar su tamaño y configurar a voluntad (todo el código de las cosas también posible, como veremos en breve).
), un campo testo per l'inserimento del numero da indovinare ( UITextField ) e – finalmente – un semplice bottone ( UIButton ) per verificare se abbiamo indovinato: Antes de continuar, es la primera vez que trabajo con Interface Builder, un poco de diversión "probar los distintos componentes, y cuando se pone demasiado, asegúrate de que tienes algo como la imagen se muestra a continuación, que se hace con un título el componente UINavigationBar , un texto introductorio ( UILabel ), un campo de texto para introducir el número de adivinar ( UITextField ) y - finalmente - un simple botón ( UIButton ) para ver si nos imaginamos:
La configuración de los componentes de Interface Builder a través de una ventana en particular es siempre dividida en cuatro pestañas: atributos, las conexiones, el tamaño y la identidad, una especie de "inspector" de los componentes. Dependiendo del componente de diálogo Identidad seleccionado está configurado con las características apropiadas para el componente. Si seleccionamos la UINavigationBar , por ejemplo, tenemos todas las opciones posibles para este tipo de componentes.
2 - Código
Ahora que hemos establecido nuestra posición y los componentes visuales de la interfaz, vamos a escribir un poco de código destinado a manipular. En primer lugar es que abrir el archivo FirstAppViewController.he tan:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | / / / / FirstAppViewController.h / / FirstApp / / / / Creado por Giovambattista Fazioli el 19/06/09. / / Copyright Saidmade Ltd. 2009. Todos los derechos reservados. / / # Importar <UIKit/UIKit.h> UIViewController { @ Interface FirstAppViewController: {UIViewController IBOutlet UITextField * número; IBOutlet UIButton botón *; numeroACaso int; } IBAction ) controllaNumero; - (IBAction) obtenerNumero; @ End |
Líneas 12, 13 y 14 definen las "variables" de nuestro juego. di Interface Builder. Los dos primeros son punteros a nuestros gráficos incluidos con Interface Builder:. Del cuadro de texto y un botón IBOutlet , tipo davati, sirve para crear un vínculo, una referencia, a la interfaz de .xib Interface Builder. De hecho, si quisiéramos crear nuestros franquiciados a través de componentes de código sin tener que pasar a través de Interface Builder, simplemente borre el IBOutlet , como redundante. La línea 17, sin embargo, define un método (un evento posterior) que queremos activar cuando el usuario hace clic en el botón. En este archivo. H (archivos de cabecera) se realizó sólo definiciones. La aplicación del código real se encuentra en el archivo correspondiente M:. FirstAppViewController.m . Control-clic es ALT + FLECHA cambia alternativamente. Archivo H en el archivo. M. Vamos entonces a editar FirstAppViewController.m . En primer lugar a eliminar los comentarios meotdo viewDidLoad (33 ª fila más o menos) y vamos a llegar a ser:
1 2 3 4 5 6 7 | / / Implementa viewDidLoad que hacer una configuración adicional después de la carga de la vista, normalmente desde un punta. void ) viewDidLoad { - (Void) {viewDidLoad ; [Super viewDidLoad]; + arc4random ( ) % 10 ; numeroACaso arc4random = 1 + () 10%; "Numero pensato %d" , numeroACaso ) ; NSLog (@ "% d Número de pensamiento," numeroACaso); } |
viewDidLoad es uno de los métodos se invoca cuando se inicia la aplicación. di jQuery . Si usted quiere es un poco "al document onload Javascript o $(document).ready() de jQuery . He añadido las líneas que son 5 y 6. El 5, en particular, crea un número aleatorios de 1 a 10! El número de la línea 6, sin embargo, es sólo para la depuración y se imprime el número generado en la consola. : Ahora podemos escribir el código (el impementazione) método controllaNumero() que se define en el archivo FirstAppViewController.h :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | IBAction ) controllaNumero { - (IBAction) {obtenerNumero "Premuto bottone di controlla numero" ) ; NSLog (@ "número presionado el botón de control"); [ numero.text integerValue ] ; numeroInserito = int [numero.text integerValue]; message; NSString * mensaje; "Il numero inserito è %d" , numeroInserito ) ; NSLog (@ "El número introducido es% d", numeroInserito); numeroInserito < numeroACaso ) { if (numeroInserito <numeroACaso) { "Troppo basso..." ; message = @ "demasiado baja ..."; ( numeroInserito > numeroACaso ) { } Else if (numeroInserito> numeroACaso) { "Troppo alto..." ; message = @ "demasiado alto ..."; ( numeroInserito == numeroACaso ) { } Else if (numeroInserito numeroACaso ==) { "Bravo hai indovinato" ; message = @ "Bravo, lo habéis adivinado"; + arc4random ( ) % 10 ; numeroACaso arc4random = 1 + () 10%; "Numero pensato %d" , numeroACaso ) ; NSLog (@ "% d Número de pensamiento," numeroACaso); } [ [ UIAlertView alloc ] initWithTitle : @ "Responso" message : message delegate : nil cancelButtonTitle : @ "OK" otherButtonTitles : nil ] ; UIAlertView alertMessaggio * = [[UIAlertView alloc] initWithTitle: @ "Respuesta" mensaje de: Delegado mensaje: cancelButtonTitle nada: @ "OK" otherButtonTitles: nil]; ; [AlertMessaggio show]; ; [AlertMessaggio liberación]; "" ; numero.text @ = ""; } |
Este código, la última escritura antes de volver a Interface Builder, podemos definirlo como el corazón del sistema, o mejor del juego. De hecho, comprueba si el número introducido en el campo de texto ( UITextField ) es menor que, mayor o igual al número de "pensamiento" de nuestro iPhone. Dependiendo de los resultados muestra una alerta. La línea 2, como siempre, es sólo para la depuración y muestra un mensaje en la consola cuando se haga clic en el botón. Línea 4, sin embargo, es interesante, y esto transforma el contenido textual de nuestra caja de texto a un número entero. Esto es necesario comparar el número aleatorio numeroACaso con el número introducido por el usuario. En Objective-C, al igual que en C, no hay conversiones de tipo implícitas, tales como otros lenguajes de alto nivel que no son compatibles con el sentido estricto de las variables en tipizazzione. En algunos idiomas, de hecho, usted puede comparar cadenas y números enteros sin realizar ninguna conversión explícita, o fundición.
Línea 5 prepara un puntero a una cadena de message que la respuesta se mostrará nell'alert. Líneas 9 a 17 el número de control introducidos por el usuario con el número aleatorio y sacar las conclusiones necesarias. A propósito poner estos " if "brutal para que el código lo más claro posible. Como alternativa podemos utilizar:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | ( ( numeroInserito - numeroACaso ) < 0 ) ? - 1 : ( ( numeroInserito - numeroACaso ) ? 1 : 0 ) ; Decisión = int ((numeroInserito - numeroACaso) <0) - 1: ((numeroInserito - numeroACaso) 1: 0); decisione ) { switch (decisión) { 1 : casas - 1: "Troppo basso..." ; message = @ "demasiado baja ..."; break; : caso 1: "Troppo alto..." ; message = @ "demasiado alto ..."; break; : case 0: "Bravo hai indovinato" ; message = @ "Bravo, lo habéis adivinado"; / / Empezar de nuevo ... + arc4random ( ) % 10 ; numeroACaso arc4random = 1 + () 10%; "Numero pensato %d" , numeroACaso ) ; NSLog (@ "% d Número de pensamiento," numeroACaso); break; } |
Combinamos el código con Interface Builder
Volvamos ahora a Interface Builder, haga clic en el archivo siempre FirstAppViewController.xib . ¿Qué vamos a hacer ahora permiten vincular la interfaz visual con Interface Builder y preparó el código que hemos escrito, en especial con los componentes resaltados con IBOutlet . Los componentes que necesitamos para conectar nuestro código para que el cuadro de texto y el botón, tal como se define en los archivos de definición de interfaz FirstAppViewController.h . . A ellos se le dio el nombre de los respectivos numero y bottone . De Interface Builder tenemos varias maneras de conectar componentes visuales con el código, una de las más sencillas es hacer clic en el botón derecho del ratón sobre nuestro componente visual, tales como el campo de texto ( UITextField ):
Esta ventana es diferente para cada componente, nos muestra todo lo que podamos "link" con el código. En particular, estamos interesados en el último punto, los puntos de referencia la sección de salida de Nueva referencia. Haga clic en el "círculo" a la derecha y - manteniendo pulsado el botón del ratón - arrastrar la ventana princiaple FirstAppViewController.xib FirstAppViewController sobre el icono (el dueño del archivo):
: Al soltar el botón del ratón aparecerá un menú con la lista de todas las "variables" (propiedades) IBOutlet y se define como UITextField :
En nuestro caso, seleccionamos numero . Repetimos exactamente el mismo procedimiento para el botón, con el añadido de que este último también había llamado a un evento: - (IBAction) controllaNumero; . Al final otteremo:
Conclusiones
Si usted hizo todo correctamente ya hemos terminado! Nuestro juego está listo. Si usted puede descargar el código fuente completo aquí . Obviamente esto es solo un ejemplo y le faltan algunos detalles para que sea una aplicación real, el 57 × 57 iconos para controlar el número de entrada y otros detalles aún. El proceso de desarrollo descrito aquí puede variar, por ejemplo a través de Interface Builder una sola vez, es decir al final: Antes de escribir todo el código y luego ir a Interface Builder para objetos de vínculo. En este ejemplo se ha pasado a Interface Builder para dibujar el contorno de nuestra interfaz, siendo la aplicación más sencilla.
La próxima vez vamos a ver cómo implementar el medisimo "jugar" sin el uso de Interface Builder.
No hay comentarios para esta entrada
Deja un comentario