live code manual español

340

Upload: sykrayo

Post on 18-Nov-2014

14.281 views

Category:

Education


422 download

DESCRIPTION

Crea tus propias aplicaciones android iphone.

TRANSCRIPT

Page 1: Live code manual Español
Page 2: Live code manual Español

LiveCode Mobile DevelopmentGuía para principiantes

Crea divertidas, aplicaciones ricas para Android y iOS conLiveCode

Colin Holgate

BIRMINGHAM - MUMBAI

Page 3: Live code manual Español

Guía LiveCode Mobile Development principiantes

Copyright © 2012 Packt Publishing

Todos los derechos reservados. Ninguna parte de este libro puede ser reproducida,almacenada en un sistema de recuperación, o transmitida en cualquier forma o porcualquier medio, sin el permiso previo y por escrito del editor, excepto en el caso debreves citas incluidas en artículos críticos o revisiones.

Cada esfuerzo se ha hecho en la preparación de este libro para asegurar la exactitud de lainformación presentada. Sin embargo, la información contenida en este libro se vende sin garantía,ya sea expresa o implícita. Ni el autor, ni Packt Publishing y sus concesionarios y distribuidoresserán responsables por cualquier daño causado o presuntamente causado directa oindirectamente por este libro.

Packt Publishing ha tratado de proporcionar información sobre todas las marcas de las compañíasy productos mencionados en este libro por el uso adecuado de los capitales. Sin embargo, PacktPublishing no puede garantizar la exactitud de esta información.

Publicado por primera vez: Julio 2012

Producción de Referencia: 1190712

Publicado por Packt PublishingLtd. Place Livery35 Livery StreetBirmingham B3 2PB, Reino Unido.

ISBN 978-1-84969-248-9

www.packtpub.com

Cover Image Artie por Ng ([email protected])

Page 4: Live code manual Español

Créditos

AutorColin Holgate

RevisoresBjörnke von Gierke

Andreas Rozek

Adquisición EditorMaría Jazmín Nadar

Lead Editor TécnicoSusmita Panda

Editores TécnicosRati Pillai

Lubna Shaikh

Coordinador del ProyectoLeena Purkait

Corrector de pruebasStephen Seda

Los indizadoresHemanjini Bari

Tejal Daruwale

Coordinador de ProducciónArvindkumar Gupta

Cubrir las obrasArvindkumar Gupta

Page 5: Live code manual Español

Acerca del Autor

Colin Holgate se formó originalmente como un técnico en telecomunicaciones en laReal Fuerza Aérea, pero con el advenimiento de la era de la computadora personal hizo latransición a trabajar como ingeniero de soporte técnico para las empresas que se incluyenApple Computer Reino Unido.

En 1992 se trasladó a los EE.UU. para convertirse en un programador de tiempo multimediacompleto, que trabaja para La Compañía Voyager. En este cargo, programado premioganando varios CD-ROM, incluyendo la Noche de un día duro y This Is Spinal Tap.

Durante los últimos 12 años ha trabajado para Colin basura divertida, una ciudad de NuevaYork basado empresa Diseño de Medios Interactivos. Además de utilizar Adobe Director yAdobe Flash para Internety las aplicaciones de puestos, se ha utilizado para crear LiveCode de la casa y lasherramientas de cliente de producción. En la Conferencia RunRevLive en 2011, Colinparticipó y ganó un concurso para crear una aplicación móvil hecho con LiveCode.

Page 6: Live code manual Español

Acerca de losrevisores

Björnke von Gierke comenzó scripting con HyperCard cuando era un adolescente.Comenzó a usar LiveCode como un hobby y porque quería crear un juego de ordenador, porlo que nunca hizo ningún tipo de codificación. Pronto su enfoque cambió a varias iniciativascomunitarias y libres de add-ons para desarrolladores LiveCode, así como pequeñasaplicaciones de bases de datos para la organización local sin fines de lucroorganizaciones. Por ahora ha funcionado y, sobre todo, juega con LiveCode por más de 10años.

Andreas Rozek es un físico (aunque con muchos años de experiencia en proyectos deinvestigación de la UE en materia de telecomunicaciones y multimedia móvil). Pero, comosu esperanza (es decir,que "Las computadoras debe ser divertido y apoyar a las personas en lugar de molestar oincluso impedir") todavía tiene que convertirse en la realidad común, esencialmente debúsqueda - día tras día - para entornos de desarrollo muy adecuado "para el resto denosotros" y trata de construir "soluciones humanitarias" por medio de sistemas acopladosde manera inteligente, conceptos intuitivos operativos, interfaces de usuario atractivas yprocedimientos de tolerancia a fallos.

LiveCode es a la vez, un lenguaje de programación que puede ser fácilmente utilizado porlos programadores "casuales", y un entorno de desarrollo que ayuda en la construcciónde interfaces de usuario visualmente atractivas para una amplia variedad de dispositivosde destino. Por esa razón, Andreas se alegra de haber tenido la oportunidad de revisareste maravilloso libro que le ayudará a convertir sus ideas en aplicaciones móviles reales.

Page 7: Live code manual Español

www.PacktPub.com

Los archivos de soporte, libros electrónicos, ofertas dedescuento y mucho másEs posible que desee visitarwww.PacktPub.com para los archivos de soporte técnico ydescargas relacionadas con tu libro.

¿Sabía usted que Packt ofrece versiones de libros electrónicos de todos los librospublicados, con archivos PDF y ePub disponibles? Puede actualizar a la versión de libroelectrónico en www.PacktPub.com y como cliente Libro, usted tiene derecho a undescuento en la copia de libros electrónicos. Póngase en contacto con nosotros [email protected] para más detalles.

En www.PacktPub.com, También se puede leer una colección de artículos libres detécnicos, regístrate para abrir una serie de boletines gratuitos y recibe descuentos yofertas exclusivas en los libros Packt y libros electrónicos.

http://PacktLib.PacktPub.com

¿Necesita soluciones inmediatas a todas sus preguntas? PacktLib está en línea Packtbiblioteca digital de libros. Aquí, usted puede acceder, leer y buscar en toda la bibliotecade Packt de libros.

¿Por qué registrar? Se pueden hacer búsquedas a través de cada libro publicado por Packt

Copiar y pegar, imprimir y marcar contenido

A petición y accesible a través del navegador web

Acceso gratuito para los titulares de cuentas PacktSi usted tiene una cuenta con Packt en www.PacktPub.com, Puede utilizar estaopción para acceder PacktLib hoy y ver nueve libros totalmente gratis. Sólo tiene queutilizar sus credenciales de inicio de sesión para acceso inmediato.

Page 8: Live code manual Español

Tabla de contenidosPreFas 1Tíoter 1: LivEcode fundatals 7

Antecedentes historia y metaphors8Usted tiene LiveCode, ¿no? 9

Aprender la disposición de la land9Principal windows10

Tiempo de acción - es un lastre, pero te va a gustar 11!Creación de un hierarchy13

Pila structure14¿Dónde código goes14

Tiempo para la acción - de decisiones y la navegación entre cards15Realización de una aplicación sencilla calculadora 18

Inspector de pistas, oh ... 18Tiempo de acción - hacer de la calculadora buttons19

Verbosidad, sinónimos, y "yo" 20Adición de la tarjeta handlers22Tipos de variables en LiveCode24Ampliación de la calculator27

Otra interfaz controls28Reproductor de vídeo control28Imagen fija control28Rollover buttons28Controles muchos más ... 30

Debugging30Tutorials32 línea de RunRev

Summary32

Tíoter 2: Getting Starteed con LivEcode Mobile 35iOS, Android, o ambas 36?

Page 9: Live code manual Español
Page 10: Live code manual Español

Table of Contents

[ 2 ]

Convertirse en un Android developer36Android Market36

Amazon Appstore40Descarga del SDK44 Android

Instalación del SDK de Android en Mac OS X (Intel) 45Instalación del SDK de Android en Windows46LiveCode Señalando el SDK47 Android

Convertirse en un developer49 iOSInstalación Xcode57

LiveCode Señalando el SDKs59 iOSAntes de que podamos hacer nuestro primer móvil app60

Cómo prepararse para la prueba de Android60Tiempo de acción - a partir de un Android virtuales device60

Conexión de un físico device61 AndroidEl uso de un Fire61 Kindle

Tiempo para la acción - la adición de un fuego Kindle a ADB62Cómo prepararse para la prueba de iOS64

Tiempo de acción - con el iOS simulator64Appiness por fin! 64

Tiempo para la acción - probando una simple pila en la simulators65Tiempo para la acción - probando una simple pila de devices66

Además reading67Summary68

Tíoter 3: El usuario Edificio Enterfaces 69La creación de un banco de pruebas móvil app70

Tiempo para la acción - lo que el banco de pruebas stack70Invocando el escritorio aplicación de correo electrónico 72

Tiempo de acción - pidiendo que el nativo de aplicación de correo electrónico 72Instalación del correo electrónico de prueba a devices72

Tiempo de acción - stack tratando de banco de pruebas en devices73Abrir una web page75

Tiempo de acción - pidiendo la aplicación del navegador nativo 75Mobile-solamente, fecha picker76

Tiempo de acción - que muestra una fecha picker77Móvil de sólo carga pictures77

Tiempo de acción - Carga pictures78Haciendo OS estilo buttons79

Usando bitmaps80Tiempo para la acción - el uso de Photoshop para preparar botón states80

MobGUI al rescate! 83Tiempo de acción - Conceptos básicos del MobGUI84

Page 11: Live code manual Español

Table of Contents

[ 3 ]

Test app cama, el way86 MobGUITiempo de acción - con MobGUI para hacer un banco de pruebas app86

MobGUI nativo controls88Tiempo de acción - con controles nativos de MobGUI89

Ajuste de las cosas por pantalla diferente sizes91Diseño con un cambio de tamaño handler91

Tiempo para la acción - diseño simple código example92Layout usando la Geometría LiveCode Manager93

Tiempo para la acción - con el Administrador de Geometría para posicionar buttons94Layout usando MobGUI95

Tiempo de acción - con MobGUI recordar diseños para US95Además reading96

Summary97

Tíoter 4: Uso de RemotDa etuna y Medios de Comunicación 99Pila structure100

Código impulsado y creado manualmente layouts100Lugares para code101

Cargar y guardar data103 externosConsultar un URL103

Leer y escribir en un archivo de texto 105Usando otra pila para almacenar data107

Tiempo de acción - la creación de una base de datos guardar stack107Creación de una web "scraper" app110

Tiempo de acción - la creación de navegación por pestañas 110El navegador card112

Tiempo de acción - la adición del navegador controls113El card114 Links

Tiempo para la acción - hacer una función de extracción de enlaces 115Las personas desaparecidas links118

Una cosa más ... 118Tiempo de acción - la adición de la tarjeta de Enlaces "init" handler118

El texto card120Tiempo de acción - la creación de la card120 Texto

El card121 MediosTiempo para la acción - la extracción de una lista de medios links121

Tiempo de acción - la creación de la tarjeta de los medios de comunicación scripts123Los encargados card125

Time for Action - la creación de los Guardianes card126¿Y ahora qué? 129

Summary129

Page 12: Live code manual Español

Table of Contents

[ 4 ]

Tíoter 5: Realización de una Jigsaw Puzzle Aplicunción 131Datos Formato de la imagen 132

Misterio byte ... 133El mal uso imageData del! 134Tiempo para la acción - probando una función getPixel 134

Simulación de un montón y un montón de botones 136Tiempo de acción - hacer un mapa de los Estados Unidos 136

Uso de maskData para la detección de colisiones 139Tiempo de acción - haciendo un hipódromo 139Tiempo para la acción - lo que un coche de carreras 141Cómo hacer un rompecabezas 146

Ir a pedazos ... 146Tiempo de acción - la creación de las piezas y la elección de un image146

Tiempo de acción - la transferencia de imageData151Adición de interactividad 154

Tiempo para la acción - creación contacto events155Summary158

Tíoter 6: Realización de una Reminder Aplicunción 159¿Qué es un "recordatorio"? 159

¿Cuándo? 160Fecha y hora pickers161

Tiempo de acción - la creación de fecha y hora pickers161¿Dónde? 164

Tiempo para la acción - probando ubicación nativo tracking165Cálculo de la distancia entre dos puntos en Earth167

¿Qué? 169Hacer que los recordatorios app170

Diseñar el cards170Tiempo de acción - crear el recordatorio aplicación screens170

Pila nivel scripts174Tiempo para la acción - la adición de funciones de nivel de pila 174

Home tarjeta scripts177Tiempo para la acción - lo que los botones de la tarjeta Inicio work178

Crear una ubicación card180Tiempo de acción - hacer de la ubicación de la tarjeta work181

Recordatorio entrada form182Tiempo de acción - teniendo en información sobre el reminder182

Summary185

Tíoter 7: deploying to YDe nuestrovicio 187Configuración de aplicaciones independientes 188

Page 13: Live code manual Español

Table of Contents

[ 5 ]

General188Stacks189

Copia Files189iOS189

Construir for190Configuración básica de aplicación 191

Icons192Splash Screens193

Opciones de orientación 194URL personalizada Scheme194

Requisitos y restricciones 194Estado Bar195

Android196Configuración básica de aplicación 196Requisitos y restricciones 198

Aplicación Permissions198Opciones de la interfaz de usuario 199

Creación de aplicaciones para Beta Testers199Envío de una aplicación Android para testers199

Preparación de una aplicación iOS para que pueda trabajar en algún otro device200La creación de "Over The Air" instaladores para iOS202

AirLaunch202BetaBuilder203

TestFlightApp.com204Creación de una tienda de aplicaciones de archivo de envío 204

Encontrar y utilizar la aplicación para Android Keytool 204Creación de un certificado de distribución para iOS206

Subida a la aplicación stores208¿Qué es similar209

¿Qué es different209Line209 BottomSummary210

Apéndice: Extterminando LivEcode 211La historia hasta ahora ... 211

Extender LiveCode212MobGUI212

tmControl213DropTools Palette214

mergExt215La creación de su propio complemento ons216

Custom controls216Externals216

Page 14: Live code manual Español

Table of Contents

[ 6 ]

Pop Concurso Answers 219Capítulo 1, LiveCode Fundamentals219

Capítulo 2, Primeros pasos con LiveCode Mobile220Capítulo 3, Edificio del usuario Interfaces220

Capítulo 4, Uso de datos remotos y Media221Capítulo 5, Cómo hacer una aplicación Jigsaw Puzzle 221Capítulo 6, Cómo hacer una aplicación Recordatorios 222

Index 223

Page 15: Live code manual Español

Table of Contents

[ 7 ]

PrefacioTodo el mundo te conoce tiene un dispositivo móvil inteligente de algún tipo. Ustedprobablemente posee varios! La idea general de tener aplicaciones de utilidad en un teléfonono es nueva, e incluso teléfonos celulares y juegos de PDA han existido durante años, pero laforma en que el iPhone utiliza táctil en lugar de un lápiz o el teclado y gestos para reducir elnúmero de pasos para hacer algo, era un elemento de cambio.

El iPhone fue lanzado en junio de 2007, y el sistema operativo Android, en septiembre de2008. Si quieres crear algo que funcionaba en ambas plataformas que tenía que aprenderdos entornos de desarrollo y lenguajes; Objective-C para el iPhone y Java para Android.

En el mundo del escritorio hay varias herramientas de desarrollo que le permiten publicaren Mac y Windows, así como Linux en el caso de LiveCode. La más exitosa de estasherramientas son Adobe Director, Adobe Flash, Unity, y LiveCode. La publicación en iOS seestá trabajando para el director, lo que significa que las cuatro herramientas también sonadecuados para el desarrollo para móviles.

Estas herramientas tienen diferentes puntos fuertes. En algunos casos, las fortalezas serefieren a la naturaleza de las aplicaciones que puede hacer, y en otros casos se refiere a laaccesibilidad de la herramienta es para personas que no son programadores hardcore. Siquieres hacer un juego 3D de alta calidad, la Unidad sería la mejor opción, con el director yluego Flash como otras opciones. Si usted necesita una gran cantidad de animaciones de lospersonajes, Flash sería la mejor opción, con el director ser una buena alternativa.

Si lo importante es la forma en que la herramienta es accesible, entonces LiveCode ganafácilmente. Es tambiéntan válida una opción para hacer la mayoría de las aplicaciones que usted podría desear. Dehecho, para aplicaciones queson un conjunto de pantallas individuales, como sería el caso para la mayoría de aplicaciones deutilidad, así como para el tableroy los juegos de puzzle, LiveCode se adapta mejor que las otras herramientas. También tiene unmejor accesoa elementos de la interfaz nativa, con el resto de herramientas que normalmente tienes que creargráficos quese asemejan a la apariencia de los controles nativos de iOS y Android, en lugar de acceder a larealidad.

Page 16: Live code manual Español

Preface

[ 2 ]

Con su fácil de usar Inglés-como lenguaje de programación, y la "pila de tarjetas de" lametáfora, LiveCode le permite concentrarse más en la creación de la aplicación que deseahacer, y menos en los aspectos técnicos del entorno de desarrollo.

Lo que este libro cubreCapítulo 1, Fundamentos LiveCode, le dará a conocer el entorno LiveCode, y su lenguaje deprogramación similar al Inglés. Los usuarios experimentados LiveCode puede saltarse estecapítulo, pero para alguien nuevo en LiveCode este capítulo le llevará a través de la creaciónde una aplicación de calculadora simple como una manera de hacer que usted familiarizadocon las distintas herramientas y la jerarquía de LiveCode.

Capítulo 2, Introducción a LiveCode Mobile, describe en detalle cómo configurar tu ordenadorMac o Windows para que esté listo para desarrollar y publicar aplicaciones móviles. Estecapítulo le llevará hasta el final de registrarse como un desarrollador de iOS y Android, paracrear y probar su aplicación móvil LiveCode primero.

Capítulo 3, La construcción de interfaces de usuario, se muestra cómo utilizar algunas de lascaracterísticas estándar de telefonía móvil, tales como selectores de fecha, álbum de fotos ycámara. En este capítulo también mostrará cómo hacer sus propios botones con iOS mirar aellos, y cómo utilizar el LiveCode add-on, MobGUI, para hacer su vida más fácil!

Capítulo 4, Uso de datos remotos y medios de comunicación, se analiza la estructura de lasaplicaciones, dónde colocar el código, y cómo leer y escribir en archivos de texto externos.También creará una aplicación móvil que es un "web-scraper", capaz de extraer enlaces y losmedios de comunicación desde una página web, y mostrar o reproducir el contenido de esapágina.

Capítulo 5, Realización de una aplicación Puzzle Jigsaw, le mostrará cómo procesar datos deimagen, y utilizar la información para crear un selector de color, detectar las regiones, y parahacer un mapa de la colisión. A continuación, creará una aplicación de rompecabezascompleto que lleva su imagen desde el álbum de fotos o cámara del dispositivo.

Capítulo 6, Realización de una aplicación Recordatorios, examina qué tipo de información senecesita para representar un "recordatorio", y cómo configurar los eventos de notificaciónpara que sean alertadas en una fecha y hora especificadas. Va a hacer una aplicación derecordatorios que puede crear una lista de este tipo de eventos, e incluso una lista de loseventos en función de su ubicación actual.

Capítulo 7, Implementación en tu equipo, es un capítulo de referencia que describe todos losajustes de publicación móviles. El capítulo también muestra cómo enviar aplicaciones a losprobadores beta, y cómo empezar con la presentación de su aplicación final a las tiendas deaplicaciones diversas.

Apéndice A, Extender LiveCode, describe los complementos para LiveCode que hará que sus

Page 17: Live code manual Español

Preface

[ 3 ]

aplicaciones móviles se ven mejor, o que se extiendan las capacidades móviles de LiveCode.

Page 18: Live code manual Español

Preface

[ 4 ]

Lo que necesitas para este libroAdemás del propio LiveCode, se necesitaría un Mac o un PC, iOS y / o dispositivos Android, yuna cantidad de dinero si se siguen las partes sobre cómo registrarse como desarrolladormóvil! Para el desarrollo de iOS tendrá acceso a un Mac basado en Intel para algunos de lospasos. El código de ejemplo requiere LiveCode versión 5.5 o posterior.

¿Quién es este libro paraEl lector ideal para este libro sería alguien que ya sabe LiveCode, está interesado en lacreación de aplicaciones móviles, y quiere salvar a las muchas horas que tomaría paralocalizar toda la información sobre la manera de empezar! Capítulo 1, FundamentosLiveCode, ayudará a los lectores que saben de programación, pero no están familiarizadoscon LiveCode suficiente para que puedan beneficiarse del resto del libro.

ConveniosEn este libro, usted encontrará varios epígrafes que aparecen con frecuencia.

Dar instrucciones claras de cómo llevar a cabo un procedimiento o tarea, usamos:

Tiempo de acción - en el epígrafe1. Acción 1

2. Acción 2

3. Acción 3

Instrucciones a menudo necesitan una explicación adicional para que tengansentido, por lo que se siguen con:

¿Qué ha pasado?En este epígrafe se explica el funcionamiento de las tareas o instrucciones que acaban

de terminar. Usted también encontrará algunas otras ayudas de aprendizaje en el libro,

incluyendo:

Pop Quiz - encabezamientoEstos son cortas preguntas de opción múltiple destinadas a ayudarle a probar su comprensión.

Page 19: Live code manual Español

Preface

[ 5 ]

Tener un héroe go -encabezamiento

Estos fijará objetivos prácticos y darle ideas para experimentar con lo que hasaprendido.

Usted también encontrará una serie de estilos de texto que distinguen a los diferentes tipos de información.Estos son algunos ejemplos de estos estilos, y una explicación de su significado.

Las palabras de código en texto se muestran de la siguiente manera: "En la línea en blancoentre en mouseUp y mouseUp final, tipo numberPressed la etiqueta de mí. "

Un bloque de código seestablece como sigue:

en clearPressed

poner en verdadero newNumber

poner 0 en el campo

"display" poner 0 en

currentTotal

poner 0 en CurrentValue

puesto vacío en el extremo

currentCommand clearPressed

Cualquier entrada de línea de comandos o de salida seescribe de la siguiente manera:

export PATH = $ PATH :/ Usuarios / nombredeusuario / Documents /android-sdk-macosx /plataforma-herramienta

Los nuevos términos y las palabras importantes se muestran en negrita. Las palabras queusted ve en la pantalla, los menús y cuadros de diálogo, por ejemplo, aparecen en el textode esta manera: "Toma nota de los elementos en el lado derecho, las Muestras deusuario, tutoriales, recursos, y un diccionario.".

Advertencias y notas importantes aparecen en un cuadrocomo este.

Consejos y trucos aparecer así.

Page 20: Live code manual Español

Preface

[ 6 ]

Lector de retroalimentaciónLos comentarios de nuestros lectores siempre es bienvenida. Háganos saber lo quepiensas acerca de este libro, lo que le gustó o no le gustaba puede haber. Lector deretroalimentación es importante para nosotros desarrollar títulos que realmente sacar elmáximo provecho de.

Para enviarnos sus consultas generales, sólo tiene que enviar un e-mail [email protected],y mencionar el título del libro a través del tema de su mensaje.

Si hay un tema que tiene experiencia y está interesado en cualquiera de los dos porescrito o contribuir a un libro, ver nuestra guía de autor en www.packtpub.com /

autores.

Atención al clienteAhora que usted es el orgulloso propietario de un libro de Packt, tenemos una serie decosas que le ayudarán a sacar el máximo partido a su compra.

Descargar el código de ejemploPuede descargar los archivos de código de ejemplo para todos los Packt libros que haya comprado de su cuentaalhttp://www.packtpub.com. Si ha adquirido este libro en otra parte, se puede visitarhttp://www.packtpub.com/support y registrarse para tener los archivos enviados porcorreo electrónico directamente a usted.

Fe de erratasAunque hemos tomado todas las precauciones para asegurar la exactitud de nuestrocontenido, los errores ocurren. Si usted encuentra un error en uno de nuestros libros, tal vezun error en el texto o el código estaríamos agradecidos si usted desea informar de esto anosotros. De esta manera, usted puede ahorrar otros lectores de la frustración y nos ayudana mejorar las versiones posteriores de este libro. Si encuentra algunafe de erratas, por favor informe al visitar http://www.packtpub.com/support, laselección de su libro, al hacer clic en el enlace de envío de formularios fe de erratas, y entraren los detalles de sus erratas. Una vez que sus erratas se verifican, su presentación seráaceptada y la fe de erratas se subirán a nuestro sitio web, o añadir a una lista de erratasexistentes, en la sección de erratas de ese título.

Page 21: Live code manual Español

Preface

[ 7 ]

PirateríaLa piratería de material con copyright en Internet es un problema constante en todos losmedios. En Packt, tomamos la protección del derecho de autor y licencias muy en serio. Si teencuentras con las copias ilegales de nuestras obras, en cualquier forma, en el Internet, porfavor indíquenos la dirección de ubicación o el nombre del sitio web inmediatamente paraque podamos presentar un recurso.

Por favor, póngase en contacto con nosotros en [email protected] con un enlace al

material sospechoso pirata. Le agradecemos su ayuda en la protección de nuestros autores, y

nuestra capacidad para producir contenido valioso.

PreguntasPuede contactar con nosotros [email protected] si usted está teniendoproblemas con algún aspecto del libro, y haremos nuestro mejor esfuerzo para resolverel problema.

Page 22: Live code manual Español

1Fundamentos LiveCode

¿Es este capítulo para usted?

LiveCode tiene un lenguaje de programación similar al Inglés, un entorno dedesarrollo gráfico, y una metáfora fácil de entender estructural. Cuando se creauna aplicación, pasar más tiempo pensando en cómo poner en práctica lasdiferentes características, y menos acerca de las complejidades de laherramienta que está utilizando. Pero si usted nunca ha usado antes LiveCode,todavía va a ser desconocido al principio. Este capítulo le llevará hasta lavelocidad, listo para los últimos capítulos que requerirán que usted está másfamiliarizado con la terminología y las características de la herramienta.

LiveCode es fácil, pero hay miles de cosas fáciles de aprender! A lo largo del libro vamos aver la última de las cosas fáciles, sobre todo los relacionados con las aplicaciones móviles,pero primero debemos repasar algunos de los conceptos básicos.

En este capítulo, deberá:

Familiarizarse con el entorno LiveCode

Investigar la jerarquía de un LiveCode "pila"

Crear una aplicación de calculadora simple

Más información sobre los controles de la interfaz diversos

Así que vamos a seguir adelante con ella ...

Page 23: Live code manual Español
Page 24: Live code manual Español

LiveCode Fundamentals

[ 8 ]

Antecedentes historia y metáforasMuchas herramientas de desarrollo sólo tiene que presentar un lenguaje deprogramación y las interfaces con las rutinas del sistema. Herramientas de alto nivel amenudo presentan las mismas cosas, pero con una estructura de tal manera que sepueda imaginar metáforas del mundo real de los diferentes aspectos de la herramienta.LiveCode es muy parecido a eso, y su metáfora es una pila de tarjetas. Esta metáfora seoriginó conHyperCard de Apple Computer herramienta de autoría, creada por Bill Atkinson enmediados de 1980. La primera versión de HyperCard fue lanzado en agosto de 1987, y seconvirtió en un gran éxito tanto en la educación y multimedia. Empresas como la CompañíaVoyager publicada líneas enteras de productos que se crearon utilizando HyperCard.

Otras compañías producen herramientas que estaban muy parecido a HyperCard, sino quetambién intentópara dar al usuario más funciones que estaban en HyperCard. La más destacada de estasherramientaseran SuperCard, Plus y MetaCard. Plus pasó a tener una vida interesante, el productosí mismo se convirtió sólo para Windows (era multiplataforma al principio), pero terminó mástarde el mismo códigoen las plataformas de herramientas Objetos Oracle Media. Todas estas herramientas perpetuadolametáfora de una pila de tarjetas.

MetaCard fue más notable por el hecho de que era multi-plataforma, no sólo entreplataformas. Stacks, el término general que se utiliza para los documentos creados porestas herramientas, hechas con MetaCard podía correr en sistemas Unix y Linux, así comoMac y Windows. Por desgracia, era un poco feo! La compañía escocesa RunRev hizo unproducto que era un intento de presentar MetaCard de una manera más atractiva.Eventualmente RunRev adquirido MetaCard, y desde2003 RunRev ha seguido basándose en MetaCard, utilizando el nombre del producto "en tiempode ejecuciónRevolución ", más tarde renombrado a LiveCode.

Bajo la variación HyperCard de la metáfora, los documentos consistían en cartas quesostenía botones, campos y gráficos de mapas de bits, fondos que mantenían un conjuntode tarjetas y pilas que contenían un conjunto de fondos. LiveCode adopta un enfoqueligeramente diferente, y en lugar de tener fondos que sostienen las tarjetas, que le permiteagrupar un conjunto de controles de interfaz y configurar aquellos a actuar como si fueranuna entidad de fondo. Esto termina siendo más flexible, aunque algo ajeno a las personasque han utilizado HyperCard mucho.

Tanto HyperCard y LiveCode proporcionar formas de extender la jerarquía más. Usted serácapaz de tomar otras pilas y ponerlas en uso. Para guardar reescribir el mismo conjunto defunciones en cada pila, usted puede optar por tener una pila dedicado a dichas funciones y,

Page 25: Live code manual Español

Chapter 1

[ 9 ]

a continuación añadir que la pila a la "stackinsuse", utilizando el comando:

empezar a utilizar la pila "utilidad pila"

Además, puede escribir lo externo, que son comandos y funciones escritas en Cidioma, lo que puede ampliar las capacidades de LiveCode aún más.

Page 26: Live code manual Español

LiveCode Fundamentals

[ 10 ]

Usted tiene LiveCode, ¿no?Si aún no ha instalado LiveCode, vaya to esta página web: http://www.runrev.com/descargas /. Usted tendrá que crear una cuenta para poder descargar la versión deprueba. Si usted planea ir a comprar LiveCode, lea esta página:http://www.runrev.com/ productos / livecode / licencia de tipo-

overview / para comprender las variaciones de licencia hay. Como guía aproximada,basada en el precio en el momento de la escritura, para crear aplicaciones móviles que sonlibres, que sería de $ 99, o si desea hacer que las aplicaciones quepodría cobrar, que sería de $ 499. Cada plataforma adicional que usted desea publicar seríanotros $ 99.

Una vez que haya descargado la versión de prueba, o comprar una de las licencias,¿por qué no seguir adelante y lanzar él!

El aprendizaje de la configuración del terrenoLa primera vez que LiveCode abierto se le mostrará una ventana de inicio, que funcionacomo una forma de abrir documentos recientes, una lista de enlaces a foros, e informaciónde instalación inicial. También proporciona una manera de ver la información promocional.No hace ningún daño para mantener la ventana abierta, pero si lo hace pasar a cerrarlapuede volver a abrir la interfaz de inicio en el menú Ayuda.

Como te ves en LiveCode por primera vez, te darás cuenta de una barra de herramientasen la parte superior de la pantalla, justo debajo de la barra de menús. Toma nota de loselementos en el lado derecho, las Muestras de usuario, tutoriales, recursos, y undiccionario. Estas áreas están llenas de información que le ayudará a empezar conLiveCode. El diccionario es algo que va a utilizar unmucho, y sólo la navegación a través de las entradas o bien a responder a su preguntainmediata o darle información avanzada acerca de los problemas que se encontrará másadelante.

El menú Ayuda también proporciona acceso a una guía del usuario y varios archivos denotas de la versión. Consulte la Guía del usuario para leer con mayor profundidad acercade las características mencionadas aquí.

Las lecciones en línea

Además de los recursos que se ven dentro de sí mismoLiveCode, hay una enorme cantidad de información ytutoriales en el sitio web RunRev. Un buen starting puntosería: http://lessons.runrev.com/

Page 27: Live code manual Español

Chapter 1

[ 11 ]

La captura de pantalla siguiente muestra las ventanas y paletas que vamos a utilizar por elmomento, así como la ventana del documento, que muestra una calculadora sencilla quepronto va a construir:

Principal ventanasAdemás de la ventana del documento en sí, estas son las ventanas principales quetendremos que estar familiarizado con por ahora:

Instrumentospaleta

Inspector paleta

Message Box

Page 28: Live code manual Español

LiveCode Fundamentals

[ 12 ]

La parte superior de la paleta de herramientas muestra todos los controles de la interfazque usted tendrá que crear una aplicación interactiva. Debajo de ellos son un conjunto deherramientas para la edición de gráficos vectoriales, y un conjunto de herramientas para laedición de gráficos de mapa de bits.

La paleta Inspector muestra todas las opciones para el control que ha seleccionadoactualmente. En la imagen de arriba no es seleccionada, por lo que la paletaInspector muestra información acerca de la propia pila.

El cuadro de mensaje es una ventana que le permite probar ya sea una o varias líneas decódigo. Usted será capaz de invocar funciones en sus stacks demasiado, por lo que esuna manera muy útil para comprobar distintas funciones mientras se está rastreandotemas. Vamos a utilizar el cuadro de mensaje en capítulos posteriores.

Como se sugirió anteriormente, usted debe leer la Guía del Usuario para obtener unacomprensión más profunda de estas ventanas, pero vamos a tratar de armar algo simple,por ahora, para conseguir que más familiarizados con el uso de la paleta de herramientas.

Tiempo de acción - es un lastre, pero te va a gustar!Usted construye cosas en LiveCode arrastrando los iconos de la paleta de herramientas a la ventana Stack. Si laspaletas no están abiertas, la paleta Inspector se puede abrir haciendo clic en elicono en la parte izquierda de labarra de herramientas, o seleccionando una de las opciones del inspector de menú en el menú Objeto. La paletade herramientas se puede abrir mediante la selección de la paleta de herramientas en el menú Herramientas.Paraello, siga estos pasos:

1. En el menú Archivo, seleccione Nuevo Mainstack.

2. En la paleta de herramientas, haga clic en la herramienta de edición (la parte superiorderecha icono de lado).

Seleccione Editar, o no ...

En LiveCode puede arrastrar controles de la paleta de herramientas a laventana de la tarjeta sin seleccionar primero la herramienta de edición. Sinembargo, si usted está en la herramienta de ejecución que no será capaz deseleccionar el control con el fin de ajustar su posición o tamaño, por lo queen estas instrucciones se nos intencionalmente la selección de la herramientade edición antes de agregar controles a la ventana de la tarjeta, sólo paraestar seguro.

3. Arrastre los iconos de la parte superior de la paleta de herramientas a la ventana de pila.

4. Pruebe las opciones de capas en la parte inferior del menú Objeto.

Page 29: Live code manual Español

Chapter 1

[ 13 ]

5. Seleccionar más de un elemento, y experimentar con las opciones de alineación delos objetos en la paleta Inspector. La alinear opciones se muestran de formaautomática cuando se selecciona varios objetos, pero también puede seleccionarAlinear objetos en el menú desplegable de la paleta Inspector. Usted no verá estaopción si sólo hay un objeto seleccionado. Aquí vemos las opciones, porque tresbotones están seleccionados:

6. Seleccione un solo botón, y en la paleta Inspector introduzca un nombre y unaetiqueta. Si no ve el nombre y los campos de la etiqueta, asegúrese de que haseleccionado las propiedades básicas de menú desplegable la paleta Inspector.

Page 30: Live code manual Español

LiveCode Fundamentals

[ 14 ]

7. Agregar varios controles más a la ventana de la tarjeta, y practicar la alineación y elnombramiento de los controles. También puede cambiar el tamaño arrastrando lasasas que se ve en las esquinas y los laterales, mientras que el control estáseleccionado. Así es como se podría mirar si había añadido algunos botones, uncampo, un panel de pestañas, y un control de reproductor de video:

¿Qué ha pasado?Esperamos que pueda haber hecho un montón de controles de interfaz aleatorio,tal vez algunos que están muy bien alineados también! Ahora eliminar a todosellos, y prepárate para hacer que la interfaz simple calculadora.

Pero primero debemos repasar algo de la estructura y la jerarquía de una pila LiveCode, ytambién crear algo de navegación básica.

Creación de una jerarquíaTodo va a alguna parte, pero tener las cosas en el lugar equivocado puede llevar a problemas.Así que debemos aprender más sobre la estructura de una pila LiveCode.

Page 31: Live code manual Español

Chapter 1

[ 15 ]

Pila estructuraComo se describe en la sección Antecedentes y metáforas de este capítulo, LiveCode utilizauna pila de tarjetas de metáfora. Cuando usted hace una pila nueva que, en efecto, tieneuna tarjeta de un solopila de tarjetas. Sin embargo, incluso la aplicación más sencilla es probable que tenga más deuna tarjeta. Por ejemplo, podría haber una pantalla de bienvenida, una tarjeta de título, lastarjetas de la tarea real en la mano, y una página de créditos. En la pantalla de la calculadoravamos a utilizar dos tarjetas. El menú Herramientas incluye una opción para ver la estructurade la pila, al mostrar el navegador de aplicación:

¿Dónde va el códigoEn lenguajes de programación como la de LiveCode, el código se refiere como está,mientras que los métodos o funciones se conocen como controladores (aunque enLiveCode un controlador que devuelve un valor también se llama una función). Proyectoshechos con más difíciles de utilizar herramientas de programación a menudo consisten endecenas de archivos de texto, uno para cada modelo, vista o controlador. En esteLiveCode es más simple que los guiones se adjuntan al objeto que necesita ese código.

Para hacer frente a la interacción del usuario en otras herramientas que usted tendrá que escribir el código querecibe el evento (tal vez sólo un clic del ratón sobre un botón) y, a continuación, realizar la acción correspondiente.En LiveCode hay una ruta del mensaje que se ocupa de estos eventos y los pasa ala jerarquía. Si hace clic en un control de interfaz LiveCode que no tiene un controlador deeventos del ratón, haga clic en el sube por la jerarquía hasta el nivel de la tarjeta. Si latarjeta no tiene un controlador para ese evento, que continúa hasta el nivel de la pila.

Usted puede tener otros niveles de jerarquía, al poner otras pilas en uso, pero para nuestros propósitossólo tenemos el botón, tarjeta, y las jerarquías de la pila.

Esta jerarquía mensaje nos permite colocar el código necesario por varios controles de

Page 32: Live code manual Español

LiveCode Fundamentals

[ 16 ]

interfaz en un nivel superior, a disposición de todos los controles. Uno de estos casos serácon los botones numéricos de la calculadora, y cada uno tiene que hacer exactamente lomismo, y al poner ese código en el nivel de tarjeta, cada uno de ellos puede hacer uso deese solo controlador.

Page 33: Live code manual Español

Chapter 1

[ 17 ]

No hay ninguna ventaja de rendimiento de tener el controlador compartido en el nivel detarjeta, o mucho de una mejora del tamaño del archivo, pero como se está desarrollando elcódigo de la calculadora, puede realizar cambios en el guión sola tarjeta, en lugar de 11calculadora individuo guiones botón.

Ahora vamos a empezar a construir la calculadora, y agregar secuencias de comandospara los 14 botones, un campo, y la tarjeta.

Descargar el código de ejemploPuede descargar los archivos de código de ejemplo para todos los Packt libros que haya compradode su cuenta alhttp://www.packtpub.com. Si ha adquirido este libro enotra parte, se puede visitar http://www.packtpub.com/support yregistrarse para tener los archivos enviados por correo electrónico directamentea usted.

Tiempo de acción - haciendo y navegar entre las tarjetasUna calculadora en realidad no necesita una pantalla de título, pero vamos a hacer de todosmodos, con el fin de

practicar la adición de secuencias de comandos y haciendo un poco de navegación básica.Usted puede tomar su borrado Salida

pila de antes, o iniciar un Mainstack Nuevo en el menú Archivo.

1. Seleccionar tarjeta nueva en el menú Objeto.

2. Utilice el menú Ver para ir ya sea a la tarjeta anterior (Ir Anterior), o primera tarjeta(Vaya primero).

3. Asegúrese de que dispone de la herramienta de edición seleccionado en la paleta deherramientas y arrastre un campo Etiqueta para el centro de la ventana de latarjeta. En este caso es fácil ver cuál es el campo Label (etiqueta que dice: en elicono), sino como un consejo general, puede apuntar a los controlesen la paleta de herramientas y ver un mensaje de ayuda que muestra qué tipo de controlque es.

4. En la sección Propiedades de base de la paleta Inspector, desactive la casilla Noenvuelva

casilla de verificación.

5. Tipotítulo en el campo de entrada Nombre.

6. Elegir contenido del Inspector menú desplegable, y reemplace el texto inicial quedice Label: escribiendo Simple Calculator en el campo de entrada decontenido.

7. Elija el formato de texto en el menú desplegable, y haga clic en el botón de

Page 34: Live code manual Español

LiveCode Fundamentals

[ 18 ]

texto alinear el centro, que es el medio de los tres botones Alinear.

Page 35: Live code manual Español

Chapter 1

[ 19 ]

8. Cambiar la fuente, el tamaño y las opciones de estilo, para hacer un título bonito,cambiar el tamaño del propio campo hasta que te gusta como se ve:

9. Arrastre un botón de inserción (el segundo icono de la parte superior izquierda de lapaleta de Herramientas)

desde la paleta de herramientas y colóquelo debajo del campo de título.

10. En el Inspector, seleccione Propiedades básicas del menú desplegable (que es elmenú que dice Formato de texto en la captura de pantalla anterior), el tipo deComenzar en el campo de entrada Nombre. LiveCode mostrará automáticamenteel mismo texto como etiqueta del botón, aunque no lo escriba en la casilla deEtiqueta.

11. Usted puede entrar en las opciones de formato de texto para los botones también, si lo desea!

12. Prepararse mentalmente - estamos a punto de escribir nuestro primer script!

13. Con el botón seleccionado, elija Objeto de secuencias de comandos en el menúObjeto. También puede hacer clic en el mismo botón y seleccione Editar guión.

Page 36: Live code manual Español

LiveCode Fundamentals

[ 20]

14. La ventana Script aparecerá y mostrará un script de arranque, de en

mouseUp, (Línea en blanco), y final mouseUp como se muestra en lasiguiente captura de pantalla:

15. Completar la secuencia de comandos escribiendo ir ahora en la línea enblanco que le demos este guión final:en mouseUp

ir ahora

final mouseUp

16. Cierre la ventana de script, y haga clic en Sí cuando se le pregunte sidesea guardar los cambios.

17. Elija la herramienta Buscar de la paleta de herramientas (el superior izquierdo-herramienta, que se parece a una flecha de cursor regular), y haga clic en el botónComenzar que usted acaba de hacer. Todo está bien ahora estás mirando unatarjeta en blanco. No se preocupe, usted no acaba de borrarel campo de título y un botón! Ahora se encuentra en la segunda de las dos cartasque usted hizo antes. Utilice el menú Ver de nuevo para volver a la primera tarjeta,para tratar de nuevo el botón.

18. Ahorre! En el menú Archivo, seleccione Guardar y guarde la pila, con el nombreCalculadora Simple, en algún lugar se puede encontrar fácilmente más tarde.

Page 37: Live code manual Español

Chapter 1

[ 21 ]

Tal vez usted podría hacer una carpeta para guardar las pilas que usted harádurante la lectura de este libro.

Page 38: Live code manual Español

LiveCode Fundamentals

[ 22]

¿Qué ha pasado?Eso puede parecer como un montón de pasos, pero sí crear las dos cartas que necesitamos,presentadoun bonito campo en busca del título, y ha creado un botón Comenzar con su propio guión. Enrealidad, esos pasostomar menos de dos minutos, y mucho menos a medida que adquiera experiencia en LiveCode.

Pop Quiz - mejor nombre?Si usted quiere hacer algo grande en el mundo herramienta de autoría multimedia,¿cuál de estos nombres sería una mala elección?

1.Henry

2.Bill

3.Bob

4.Kevin

Realización de una aplicación sencilla calculadoraIncluso con un conocimiento básico de LiveCode, puede empezar a hacer algo de uso. Aquívamos a hacer una pila calculadora muy simple.

Inspector de pistas, oh ...Usted se encontrará con la paleta Inspector mucho, así que tome un momento para estudiar cómo secomporta. Cuando se selecciona un objeto en la tarjeta, verá que la paleta Inspector cambia su apariencia, aveces incluso su altura, para mostrar las opcionespara el elemento seleccionado. Es lo suficientementeinteligente como para notar cuando se ha seleccionado varios artículos, a continuación, se mostrará laalineación herramientas.

A veces usted querrá mantener un conjunto de paleta Inspector para ver las opciones de unobjeto determinado en la tarjeta, y no cambia para mostrar un objeto diferente como lohacen otras selecciones. En la esquina del lado superior derecho de la paleta Inspector esun icono de un candado, que le permitirá bloquear el inspector al objeto actual.

Hasta ahora, la mayoría de las opciones de la paleta Inspector no nos ha afectado, pero queestá a punto de ser relevante es el hecho de que se puede establecer un nombre para unelemento que es diferente a su etiqueta. Usted puede conocer a otros lenguajes deprogramación, y esto también se aplica a LiveCode, que algunos nombres son menos legalque otros. Tal vez usted no puede tener espacios en el nombre, o utilizar los dos puntos obarra invertida. Si el nombre de un botón con un número, Botón "1" no puede ser un botón,lo que podría dar lugar a confusión.

Page 39: Live code manual Español

Chapter 1

[ 23 ]

Para las teclas de la calculadora vamos a configurar una etiqueta para que se vea correcto, yun nombre que no dé lugar a confusión. Hablando de las teclas de la calculadora ...

Page 40: Live code manual Español

LiveCode Fundamentals

[ 24]

Tiempo para la acción - lo que los botones de la calculadoraUso de la primera captura de pantalla de este capítulo como guía, vamos a construir los

botones de la calculadora (los guiones que se escriben también se enumeran más adelante,si usted quiere asegurarse de que la ha escrito correctamente):

1. Si no está ya ahí, diríjase a la segunda tarjeta (la actualmente vacía).

2. Asegúrese de que el botón Editar está seleccionada en la paleta de herramientas yarrastre un botón de comando a la tarjeta, en la posición del botón con la etiqueta7.

3. En las propiedades básicas de la paleta Inspector, para cambiar el estilo del menúdesplegable

a Rectángulo redondeado (en la vida real que se tomara el tiempo para tener buen gráficobotones, aquí se acaba mi juego feo "arte programador!").

4. Establezca el nombre del botón para number7, y la etiqueta 7.

5. Seleccione Guión objeto en el menú de objetos para ver la secuencia de comandosde arranque como lo hizo con el botón Begin.

6. En la línea en blanco entre en mouseUp y mouseUp final, tiponumberPressed la etiqueta de mí.

7. Cierre y guarde el script.

8. Seleccione el botón y hacer una copia de la misma, por la elección de objetosduplicados en el menú Editar, y la posición que el botón con la etiqueta 8 será.Copiar / Pegar alt y arrastrar otras dos formas para duplicar un objeto.

9. Establezca el nombre de Number8, y la etiqueta 8.

10. Repetir los pasos 8 y 9, por los botones 9, 4, 5, 6, 1, 2, 3, 0, y el punto decimal,usando el número correspondiente en lugar de 8. Para el punto decimal, defina elnombre dedecimalpoint.

11. Duplicar uno de los botones de nuevo, el nombre del nuevo botóndividir, y el tipo /por su etiqueta.

12. Seleccione Secuencia de comandos de objetos para el botón de división,y cambiar numberPressed en la línea media paraoperatorPressed, hacer toda la línea se lea comooperatorPressed el nombre corto de mí.

13. Duplicar el botón división tres veces más, y establecer los nombres de semultiplican,

Page 41: Live code manual Español

Chapter 1

[ 25 ]

plus, y menos. Ajuste las etiquetas para *, +, y -.

14. Duplicar el botón Dividir de nuevo, indicando el nombre es igual a para el botóny establezca la etiqueta =, y el cambio de la línea media de la secuencia decomandos para decir equalsPressed

Page 42: Live code manual Español

LiveCode Fundamentals

[ 26]

15. Duplicar la es igual a botón y establecer el nombre del nuevo botón paratoggleSign y la etiqueta al + -, a continuación, cambie la línea media de lasecuencia de comandos para toggleSign.

16. Duplicar la es igual a botón, defina el nombre del nuevo botón para claro yla etiqueta al C, a continuación, cambie la línea media de la secuencia decomandos para ser clearPressed.

17. Arrastre un campo de etiqueta de la paleta de herramientas, y en la paleta Inspectorelegir el formato de texto en el menú desplegable. En la configuración de formato detexto elija una fuente bonita, texto justificado a la derecha, y un tamaño de fuentegrande. Nombre del campo mostrar.

18. Edite el guión de la mostrar campo. Con los campos no obtiene la secuencia decomandos de arranque que se obtiene con los botones, por lo que tendrá queescribir las líneas mouseUp ti mismo. Escriba las siguientes tres líneas:en mouseUpestablecer el clipboardData

["texto"] a mí mouseUp final

19. Mueva todos los botones en sus lugares correctos y seleccionar conjuntos debotones de usar que las herramientas Alinear para hacer su presentación coincidecon la calculadora de pantalla.

20. Ahorre!

¿Qué ha pasado?Mucho ha pasado! Hemos hecho todos los objetos de nivel de tarjeta y escribió en susguiones. La mayor parte de las secuencias de comandos están "llamando" a un manejador denivel de tarjeta que se va a establecer el próximo. Antes de hacer eso, vale la pena tratar deentender algunas de las líneas que acabamos de ingresar.

Verbosidad, sinónimos, y "yo"La naturaleza cerca-Inglés del lenguaje de programación en LiveCode es increíblemente poderoso,pero tan rígidamente. En algunas otras herramientas que usted tiene la opción de si utilizadetallado similar al Ingléssintaxis, menos detallado, o lo que se llama la sintaxis con punto. El lenguaje Lingo, en Adobe Director,es unbuen ejemplo para comparar.

Supongamos que queremos cambiar el texto dentro de un campo que es la primera entradadel reparto de una película del director, se puede utilizar la sintaxis verbose:

poner "hola mundo" en el texto del elemento 1

Page 43: Live code manual Español

Chapter 1

[ 27 ]

o un poco menos detallado sintaxis:

el texto del miembro 1 = "hola mundo"

Page 44: Live code manual Español

LiveCode Fundamentals

[ 28]

o un puntosintaxis:

miembro (1). text = "holamundo"

En LiveCode no hay esa elección - lo que escribe tiene que ser en forma de:

poner valor en uncontenedor

Usted tiene la posibilidad de elegir si utiliza una versión larga de una palabra, una versión corta, o una formaabreviada. También hay sinónimos, que le permiten utilizar una palabra que tiene más sentido para usted.

Aquí hay dos maneras de decir la misma cosa, con la segunda variación utilizando unaforma abreviada de la palabra clave:

poner de 3 caracteres de la palabra 2 de la tarjeta de campo"nombre del campo 1" en aVariable

poner 3 caracteres de la palabra 2 de fld 1en aVariable

Cuando se trata de los contenidos del objeto que tiene la secuencia de comandos que seestá ejecutando, puede utilizar la palabra clave me para ahorrar un poco de mecanografía, yLiveCode también tratará de averiguar lo que usted tiene en mente, si es posible.

Tome las líneas que hemos introducido comoejemplos:

numberPressed la etiqueta demí

numberPressed se propagará hasta un controlador de tarjeta vamos a añadir (pronto). laetiqueta de míse verá en la etiqueta que se define para el objeto de que el guión estádentro de.

establecer el clipboardData["texto"] a mí

En este caso, me normalmente se refieren al objeto (como es el caso con la etiqueta demí), sino porque nos dio la pista adicional de ["Texto"], LiveCode sabe que es elcontenido de texto del campo que tiene ese guión, y no el propio campo. Sin embargo,debido a que es el potencial de confusión al leer su propio código más tarde, habría queagregar un par de palabras para que el significado más claro:

establecer el clipboardData ["texto"] en eltexto de mí

Page 45: Live code manual Español

Chapter 1

[ 29 ]

Por cierto, que el guión de presentación del campo no es necesariopara la calculadora a trabajar. Simplemente está ahí para que encualquier momento puede hacer clic en el campo y tienen el valoractual se copia en el portapapeles para pegaren otras aplicaciones.

Page 46: Live code manual Español

LiveCode Fundamentals

[ 30]

Usted puede optar por ser más detallado de lo que se necesita, sólo por razones de legibilidad, y en estoscapítulos que va a ser el caso. Uso:

poner el texto de mí en textvariable

hace que sea más fácil saber lo que va a suceder que si se utiliza el igualmente válida:

me puso en textVariable

En cualquier caso, ya que es un campo, LiveCode sabe lo que significa.

Ahora mira el guión en el que hemos escrito nombre corto de mí - ¿Qué es todo eso? Losobjetos en LiveCode tienen una larga descripción del lugar en que se encuentran, porejemplo, "Botón" buttonname "de tarjeta de identificación 1234 de pila" ruta / a /stack.livecode "". En la aplicación de la calculadora sólo tenemos la palabra de lo queestablece como el nombre del botón. Si nos preguntamos por nombre de mí, aún diríabotón "buttonname". Para tomar sólo el nombre en sí, se utiliza nombre corto de mí.

Hay ocasiones en las que deseará utilizar las otras variantes de "nombre", incluyendo elnombre completo y el nombre abreviado, que se puede leer en la entrada del DiccionarioLiveCode para "nombre". Además de una descripción de las diferentes maneras de utilizar"nombre", hay una serie de precauciones se muestra.

Mayúsculas y minúsculasSi algún usuario LiveCode avanzadas están leyendo este capítulo, se puedenotar que en algunos casos tengo la caja equivocada. LiveCode no le importalo que el caso de haber utilizado, así que cuando me dijo incorrectamenteclipboardData en lugar de clipboardData, no importaba. Esto noes exclusivo de LiveCode, pero es común entre los lenguajes de programaciónde Inglés-como para no exigir que el usuario obtiene exactamente el casojusto antes del comando funcionará.

Adición de los controladores de tarjetasSi hubieras atrevido a tratar de usar los botones de la calculadora, usted habría visto unmontón de errores de script. Tenemos que añadir en los controladores de la tarjeta de nivelpara estar en el extremo receptor de las llamadas que los botones están haciendo. En lugarde caminar a través de escribir una sola línea de código a la vez, probablemente sería másrápido para presentar las líneas de una sola vez y explicar lo que hace cada línea. En unasesión de práctica, aquí están las líneas que hemos celebrado hasta el momento:

En todos los botones numéricos y el botón de punto decimal, usted debe tener este script:

en mouseup

numberPressed la etiqueta de

mouseup final me

Page 47: Live code manual Español

Chapter 1

[ 31 ]

en mouseUp se activa al presionar y soltar el botón izquierdo del ratón mientras en elbotón, numberPressed llamará a un controlador de tarjeta de llamada"numberPressed", pasando con ella el sello que había establecido para el botón que tieneeste script.

La C(Borrar) botón tiene este script:

en mouseUp

clearPressed

final mouseUp

clearPressed llamará a un guión carta llamada "clearPressed"

Los otros botones todos funcionan de la misma manera - que ellos llaman un controladordel nombre utilizado, que estamos a punto de añadir a la secuencia de comandos de latarjeta. La siguiente es la secuencia de comandos para los símbolos +, -, *, / y botones,pasando el nombre del botón en cuestión al nivel de tarjeta:

en mouseUp

operatorPressed el nombre corto del

mouseUp final me

Y este es el que está en el botón + -:

en mouseUp

toggleSign

final mouseUp

El campo de la pantalla tiene este script:

en mouseUp

establecer el clipboardData

["texto"] a mí mouseUp final

En el caso del campo, es sólo el procesamiento de una sola línea de código, así que no haynecesidad de poner eso en el nivel de tarjeta, a menos que tuviéramos una gran cantidad decampos que hacen lo mismo.

Así que, ¿por qué no añadir todos los scripts de nivel de tarjeta? Aquí están, uno a lavez, con una explicación de cómo cada uno funciona:

Pero espera ... aún no hemos hablado de variables. Espere un momento, mientras vemos cómoLiveCode gestiona las variables.

Page 48: Live code manual Español

LiveCode Fundamentals

[ 32]

Tipos de variables en LiveCodeEn términos generales, las variables son posiciones de memoria donde se almacenan losvalores que usted necesita para acceder más tarde. En la mayoría de lenguajes deprogramación que usted puede dictar que las rutinas tienen acceso a las variables. MenosInglés-como lenguas pueden utilizar los términos "público", "privado", y "protegido". Lascosas no son tan diferentes en LiveCode pero aquí las palabras utilizadas describirmás de la región donde se encuentra la variable utilizada. Si una variable ha de ser legible entodas partes, que sería "global". Si es sólo para ser usado en el guión actual, es "local".

LiveCode también tiene variables de propiedades personalizadas, y mucha gente usaría losde los valores de la calculadora de botón en lugar de confiar en la etiqueta del botón.Nosotros tal vez las utilizaremos más adelante!

Ahora, ¿dónde estaba ... ah, sí, los scripts de

nivel de tarjeta: Esta es la primera línea de la

escritura de la tarjeta:

currenttotal mundial, CurrentValue, currentcommand, newnumber

Como hemos comentado, se trata de variables que permitirán a todos los controladorespara pasar valores entre sí. En este caso las variables podría haber sido local, pero amenudo se puede decidir utilizar global en cambio, pensando que un caso puede surgirdespués que usted necesita para acceder a las variables desde fuera de la secuencia decomandos que está adentro

Es bueno para restablecer las cosas al empezar, y tiene una LiveCode OpenCard eventoque podemos utilizar para hacer esto. Los siguientes códigos se restablece cosas:

en OpenCard

clearpressed

final OpenCard

en clearpressed

poner en verdadero newnumber

poner 0 en el campo

"display" poner 0 en

currenttotal

poner 0 en CurrentValue

puesto vacío en el extremo

currentcommand clearpressed

Tener las líneas de reposición en el clearPressed manejador nos permitirá llamar en otromomento y no sólo cuando la tarjeta se abre. Nos puede llamar directamente al hacer clic enel C(CLEAR)

Page 49: Live code manual Español

Chapter 1

[ 33 ]

que pondrá a cero el campo de visualización, el total acumulado para su cálculo, y el últimonúmero que ha introducido en la calculadora. También borra la variable que se utiliza pararecordarque el operador presiona el botón por última vez, y un booleano (true / false) variable seutiliza para reconocer si un botón se presiona número debe borrar la pantalla o agregar en eldisplay.

Page 50: Live code manual Español

LiveCode Fundamentals

[ 34]

Todos los botones numéricos y el botón de punto decimal, llama a este controlador:

en numberPressed n

si es cierto, entonces newnumber

n poner en el campo

"display" poner en falso

newnumber

más

n después de poner el campo

"display" end if

final numberPressed

La ndespués de que el nombre del controlador es una variable que almacena el parámetroque se ha enviado al controlador. En este caso se trata de la etiqueta de la tecla que sepresionó. Toda esta rutina tiene que hacer es agregar el carácter a la final del campo devisualización, a excepción de cuando se está escribiendo unnuevo número. Ahí es donde el newNumber variable booleana dentro - si que se estableceen verdadero, el carácter entrante reemplaza el contenido del campo de visualización. Sinembargo, si es falsa, el carácter se añade al final del campo.

Este es el controlador para al pulsar las teclas +, -, *, / o botones:

el operador operatorPressed

currentCommand si está vacío,

poner campo "display" en operador

currentTotal poner en currentCommand

poner en verdadero

newNumber más

poner operador en currentCommand

equalsPressed

End If

final operatorPressed

Cuando se utiliza una calculadora, escriba un número, un operador y luego otro número,seguido de otro operador o el =botón. A la vez que se pulsa el botón de operación no haymanera de saber el resultado, ya que aún no ha entrado en el próximo númeroen el cálculo. Así, recordamos que el operador hasta que haya introducido el númerosiguiente. Si el currentcommand variable no tiene ya un valor, se guarda el texto en elcampo de visualización currenttotal variable, el carácter explotador que ustedpresiona en elcurrentcommand variable, y asegúrese de que newnumber se establece cierto. De estaforma se asegura de que el botón se pulsa siguiente número se borrará el campo devisualización. Si currentcommand ya tiene un valor, lo reemplazamos con el nuevo valor y,a continuación, llamar al controlador que se usa cuando se pulsa el =botón.

Page 51: Live code manual Español

Chapter 1

[ 35 ]

Hay maneras más probable más cortas para hacer frente a la =pulsar una tecla, pero aquívamos a utilizar varios si declaraciones, y ejecutar el código de cálculo apropiada:

en equalsPressed

poner campo "display" en CurrentValue

si currentCommand está vacía salga equalsPressed

si currentCommand es "dividir" a continuación, poner currentTotal/ CurrentValue en el campo "display"

si currentCommand es "multiplicar" y luego poner currentTotal *CurrentValue en el campo "display"

si currentCommand es "menos" a continuación, poner currentTotal -CurrentValue en el campo "display"

si currentCommand es "plus" a continuación, poner currentTotal +CurrentValue en el campo "display"

poner campo "display" en currentTotal

poner en verdadero newNumber

puesto vacío en el extremo

currentCommand equalsPressed

El contenido del campo de visualización se almacenan en la CurrentValue variable, y elbotón operador ha pulsado último (que se almacena en currentCommand) se mira paraver qué sucede después. Si no había un operador anterior (como sería el caso si se hapulsado =dos veces en una fila) no hacemos caso al pulsar el botón y salir de la rutina. Paralos cuatro operadores,nosotros hacemos el cálculo correspondiente. Después, guarde el nuevo total corriendo a lacurrentTotal variable, asegúrese de que el newNumber variable booleana se estableceverdadero (De modo que el botón siguiente número pulsado borrará el campo de lapantalla), y nos olvidamos de la última tecla de mando que se pulsa, poniendo vacío enla currentCommand variable.

Una cosa a tener en cuenta es que LiveCode es lo suficientemente inteligente como parasaber que la cadena de texto dentro del campo de la pantalla debe ser tratada como unnúmero de punto flotante.

Para el último controlador, togglesign, inserte el siguiente código:

en togglesign

si el personaje de un campo de "display" es

"-" y luego borrar el carácter de un campo

"display"

más

poner "-" delante campo

"display" end if

final togglesign

Esta es una rutina muy simple, que no tiene que entender que es un número de puntoflotante se representa. Simplemente mira para ver si el primer carácter es un punto negativo

Page 52: Live code manual Español

LiveCode Fundamentals

[ 36]

o no, y si lo es,borra el carácter. Si no es así, se inserta el guión que más tarde LiveCode interpretarácomo un valor negativo.

Page 53: Live code manual Español

Chapter 1

[ 37 ]

Pop Quiz - Trato de recordar ...Como se llega a aprender una nueva herramienta que puede llegar a tomar un montón detiempo recordando que la cosa es que usted necesita. ¿Sabes lo que quieres hacer, yasabes cómo hacerlo, perono puede recordar dónde se encuentra esa cosa! ¿A dónde fuiste a establecer el estilo detexto para el campo título de la calculadora?

1.El menú Editar.

2.El menú Objeto.

3.El sección Formato de texto de la paleta Inspector.

4.El menú Texto.

Ampliación de la calculadoraEs posible añadir más características a la calculadora simple. Si tenemos en cuenta cómo senombran los botones y las funciones de la escritura tarjeta, usted puede comenzar a ver loque tenga que agregar una nueva habilidad:

Los botones de la calculadora de operador se nombran para que el script tarjetasabe que uno hace clic sobre.

Cuando el botón se presiona =, hay un conjunto de si declaraciones en elequalspressed controlador que determinar qué sucede después.

Tener un héroe go - para llegar a la raíz de las cosasEn Windows, puede hacer un símbolo de raíz cuadrada con Alt 251, y en Mac con Opción +v Desafortunadamente LiveCode no le gusta como los rótulos de los botones! Al menos enMac, al escribir ese personaje en la paleta Inspector, el carácter inmediatamente sedesvanece. Una solución alternativa sería utilizar el cuadro de mensaje y escriba losiguiente:

establecer la etiqueta de btn "raíz cuadrada" a "√"

Eso te dará el símbolo de la derecha como la etiqueta del botón.

LiveCode tiene una función de raíz cuadrada, escribiendo esto en el cuadro de mensajeque produciría la raíz cuadrada de 10:

poner sqrt (10)

Ahora, armado con la información anterior, trate de agregar una función raíz cuadrada en lacalculadora.

Page 54: Live code manual Español

LiveCode Fundamentals

[ 38]

Otros controles de interfazHasta ahora sólo hemos tenido que buscar en los botones y los campos para poder crearla calculadora. En capítulos posteriores vamos a usar muchos controles más, así quevamos a echar un vistazo a ellos.

Reproductor de vídeo de controlSi su sistema tiene instalado QuickTime, LiveCode puede reproducir películas QuickTime,utilizando el tipo de control del reproductor. Aquellos se pueden añadir a la tarjeta devarias maneras, así como mediante el uso de un comando de secuencia de comandos talcomo se describe en los siguientes puntos:

Un archivo puede ser añadido de su disco duro seleccionando Importar como archivo decontrol / Video

en el menú Archivo

Un jugador de vacío puede ser creado seleccionando Nuevo Control / Jugador de laObjeto menú

Un control del reproductor se pueden arrastrar desde la paleta de herramientas a latarjeta

Un jugador puede crear con código, incluyendo el establecimiento de su nombre:nuevo jugador "player name"

Después de haber añadido el jugador a la tarjeta, puede configurar qué archivos de vídeo seva a jugar por entrar en la ruta del archivo o URL del archivo con la configuración básica de lapaleta Inspector. También puede establecer la ruta de acceso al video con la siguientesecuencia de comandos:

establecer el nombre del archivo "nombre del jugador" jugador "ruta dearchivo o URL"

Imagen fija de controlDe la misma manera que se acaba de ver para la reproducción de vídeo, imágenes fijastambién se puede añadir a una pila. Todas las opciones que se muestran para la adición deun reproductor de vídeo puede ser utilizado para las imágenes. Aquí, por ejemplo, es elscript necesario para añadir el logotipo de su empresa RunRev de la tarjeta:

nueva imagen "revlogo"

establecer el nombre del archivo de imagen "revlogo" a"http://www.runrev.com/runrev- globals / corporate-nav / images /runrev.gif "

Botones Rollover

Page 55: Live code manual Español

Chapter 1

[ 39 ]

Las imágenes que se importan se pueden utilizar como iconos en un botón. Paraconfigurar un botón para que tenga una imagen agradable estado de reposo, y unaimagen más destacado asociado, deberá seguir los siguientes pasos:

1.Seleccione Archivo | Importar como Control | Imagen de archivo ...

2.Seleccione las imágenes que representan los estados de inactividad y más destacado, yhaga clic en Abrir.

Page 56: Live code manual Español

LiveCode Fundamentals

[ 40]

3.Seleccione el botón que desea ver como estas imágenes, y bajo los iconos y lasfronteras de la paleta Inspector, haga clic en el botón varita mágica para el ladoderecho de la entrada superior (Icono).

4.In el cuadro de diálogo que aparece, seleccione Esta pila en el menú desplegable.

5.Seleccione la imagen que es el estado de inactividad para el botón.

6.Haga clic en el botón varita mágica junto a la entrada Hover, y elegir la imagen delestado resaltado.

7.Under Propiedades básicas, seleccione el botón transparente en el estiloen el menú desplegable.

8.Uncheck las casillas de nombre Show, hilite Auto, y hilite compartida.

9.Resize el botón para ser lo suficientemente grande como para mostrar la imagen.

10. Seleccione cada una de las imágenes originales, y en Propiedades Básicas, desactive laVisible caja.

Aquí podemos ver dos imágenes que se han importado con el fin de darle al botón Beginuna apariencia más iOS. El botón está seleccionado y la paleta Inspector muestra el iconoLas opciones de selección.

Page 57: Live code manual Español

Chapter 1

[ 41 ]

Entonces, cuando usted elige una imagen para usar el mismo botón se actualizará. En estecaso, el icono de la libración se ha ajustado a la versión más oscura de la gráfica, pero comose muestra aquí, el botón queda por cambiar de tamaño.

Controles muchos más ...LiveCode tiene una gran cantidad de diferentes controles. Muchas variaciones son sóloleves, pero hay muchos que son bastante diferentes unos de otros. Mira el menú Objeto yluego nuevo control. Como verás la lista es muy larga!

DepuraciónSi lo hizo seguir adelante y tratar la calculadora antes de haber introducido todos los scripts quenecesitaba,es muy probable que si se hubiera vuelto a ver la depuración de scripts en acción. Esperemos que selogrópara hacer frente a lo que ha visto, puede ser abrumador al principio. La captura de pantallasiguiente es loque habría parecido:

Page 58: Live code manual Español

LiveCode Fundamentals

[ 42]

La mayoría de lo que se ve es el mismo que cuando se edita scripts, pero si usted ve lavariación de depuración esté en un estado de pausa, una imagen congelada del programamientras se ejecuta. En este ejemplo, el programa se detuvo porque la línea 46 está enbusca de un campo denominado dis play, y no hay un campo, debe ser mostrar.

El mensaje de error en la parte inferior deja en claro que el error es algo que ver con elnombre del campo, y rápidamente detectar el error. Aunque a veces puede sernecesario inspeccionar las variables, para asegurarse de que contienen los valores quecreemos que deberían. La ficha Variables mostrará una lista de las personas.

Un problema inesperado es la única vez que se puede ver el depurador, pero cuando sedesarrolla una secuencia de comandos que son capaces de establecer puntos deinterrupción, haga clic en la columna justo a la izquierda del número de línea que deseadetener el programa en.

Si el guión se detuvo por un punto de interrupción, puede utilizar la fila de botones en laparte superior para pasar a través del código. Los botones son:

Continuar establecerá el script que se ejecuta de nuevo

Deténgase se detendrá la secuencia de comandos en ejecución, de modo que ustedpuede hacer cambios

Mostrar siguiente instrucción mostrará un indicador a la izquierda de la línea actual

Entra en la declaración siguiente Se utiliza para entrar en un controlador diferente

Page 59: Live code manual Español

Chapter 1

[ 43 ]

Paso a paso por la declaración siguiente irá en el próximo estado de cuenta enel controlador de corriente, sin entrar en un controlador mencionado en la líneaactual

Al salir del manejador actual se utiliza para saltar las líneas restantes en uncontrolador que había entrado previamente en y salir de vuelta al controladorque llamó a la actual

Usted se familiarizará con el editor de script y depurador a medida que avanza, pero que debería empezar!

Tutoriales en línea de RunRevEn este capítulo hemos cubierto lo suficiente como para que se familiarice con el entorno,para practicar el uso de algunos controles, y para hacer un poco de escritura de guiones. Haymucho para LiveCode como una herramienta, y por lo que puede estar interesado en miraren otros temas, o entrar en más profundidad de la que se describe aquí.

Un buen punto de partida sería propio conjunto RunRev de tutoriales en línea, que seencuentran en la fespués de ubicación:

http://lessons.runrev.com/

Escriba las palabras de búsqueda en la caja que describen su área de interés, y podrás ver una lista deartículos sobre ese tema.

ResumenDespués de haber creado una calculadora sencilla a partir de cero, ahora debería estar másfamiliarizado con elLiveCode ambiente.

En este capítulo cubrimos:

Botones, campos, secuencias de comandos y la estructura de la pila, paraobtener una comprensión de cómo funcionan juntos.

Varios guiones cortos, para ilustrar la sintaxis de Inglés-como utilizado por LiveCode.

La ventana de script, y cómo le depurar un script.

Otros controles de la interfaz, como preparación para su uso en los capítulos posteriores.

Page 60: Live code manual Español

LiveCode Fundamentals

[ 44]

También hablamos sobre los tipos de variables utilizadas por LiveCode, y cómo se pueden utilizarlos comandos abreviados y sinónimos.

Ahora que hemos aprendido lo suficiente para hacer que las pilas normales LiveCode, esnecesario descargar e instalar software adicional de Google y Apple que se requiere para lapublicación de una pila para un dispositivo móvil, y luego comenzar a probar característicasmóviles específicas, las cuales se tratan en el siguiente capítulo.

Page 61: Live code manual Español
Page 62: Live code manual Español

2Introducción a LiveCode Mobile

Antes de que podamos hacer cosas interesantes ...

Creación de pilas que hacer algo que usted encontrará útil o que puede llegar aser una aplicación móvil que se puede vender, es un proceso muy gratificante.Minuto a minuto, puede estar haciendo progresos, y al instante ver las mejorasque se han hecho. Por desgracia, hay un montón de trabajo menos gratificanteque hacer antes y después de haber hecho su obra maestra. Este capítulo leguiará por el "antes" parte.

LiveCode hace que las aplicaciones móviles mediante la adopción de la pila que hapresentado, junto con todos los archivos de soporte que ha añadido, y compila el archivode la aplicación utilizando el kit de desarrollo que se descarga desde el móvil proveedor OS- Google para Android y Apple para iOS.

En este capítulo vamosa:

Regístrate para Android Market

Regístrate para Amazon Appstore

Descargar e instalar el SDK de Android

Configurar LiveCode para que sepa dónde buscar para el SDK de Android

Conviértete en un desarrollador de iOS de Apple

Descargar e instalar Xcode

Configurar LiveCode para que sepa dónde buscar los SDK de iOS

Configure simuladores y dispositivos físicos

Pruebe una pila en un simulador y dispositivo físico

Aquí vamos...

Page 63: Live code manual Español
Page 64: Live code manual Español

Getting Started with LiveCode Mobile

[ 36 ]

iOS, Android, o las dos cosas?Podría ser que sólo tienen interés en iOS o sólo en Android. Usted debe ser capaz de verfácilmente dónde vaya directamente a, a menos que estés intrigado acerca de cómo vive laotra mitad! Si, como yo, eres un capitalista, entonces usted debe estar interesado enambos sistemas operativos.

Muchos menos pasos son necesarios para obtener el SDK de Android que conseguir lasherramientas para desarrolladores de iOS, ya que de tener que registrarse como un desarrolladorde Apple, pero la configuración para Android es más complicado. Vamos a ir a través de todos lospasos para Android y después los de iOS. Si usted es un tipo iOS sólo de la persona, pase laspáginas siguientes, recogiendo de nuevo en la sección Convertirse en un desarrollador de iOS.

Convertirse en un desarrollador de AndroidEs posible desarrollar aplicaciones Android OS sin tener que firmar nada, pero vamos a tratarde ser optimista y suponer que en los próximos 12 meses, usted tendrá tiempo para haceruna aplicación impresionante que le hará rico! Para ello, vamos a repasar lo que estáinvolucrado en la firmaa publicar sus aplicaciones tanto en el Android Market y la Appstore de Amazon.

Android MarketUna buena ubicación inicial wía ser http://developer.android.com/.

Page 65: Live code manual Español

Chapter 2

[ 37 ]

Usted estará de regreso aquí en breve para descargar el SDK de Android, pero por ahora, haga clic en elenlace Más información en el área de publicación. Habrá una pantalla de inicio de sesión, inicie sesióncon sus habituales detalles de Google.

¿Qué dirección de correo electrónico para usar?Algunos servicios de Google son más fáciles para inscribirse, si ustedtiene una cuenta de Gmail. Crear una cuenta de Google +, o firmar paraarriba para algunos de sus servicios de Cloud, requiere una dirección deGmail (o eso me parecía a mí en el tiempo). Si ya ha configurado GoogleCheckout como parte de su cuenta, algunos de los pasos de proceso dela firma a ser más simple. Por lo tanto, usa tu cuenta de Gmail, y si ustedno tiene uno, cree uno!

Google cobra una tarifa de $ 25 para que se inscriba para el mercado Android.Por lo menos usted se entere de esto de inmediato! Introduzca los valores paraNombre del desarrollador, correo electrónico, URL del sitio web (si tiene uno), ynúmero de teléfono.

Page 66: Live code manual Español

Getting Started with LiveCode Mobile

[ 38 ]

El pago de los $ 25 se puede hacer a través de Google Checkout.

El uso de Google Checkout le evita tener que introducir sus datos de facturación,cada vez. Esperemos que no va a adivinar los otros 12 dígitos de mi número detarjeta de crédito!

Page 67: Live code manual Español

Chapter 2

[ 39 ]

Por último, es necesario aceptar el Acuerdo de distribución para desarrolladores deAndroid Market.

Que le den una excusa para ir y hacer un poco de café ...

Page 68: Live code manual Español

[ 40 ]

Chapter 2

Algún tiempo después, ya está todo firmado y listo para hacer su fortuna!

Amazon AppstoreConsiderando que las normas y los costos para el mercado Android de Google son bastanterelajado, Amazon ha adoptado un enfoque más Apple-como, tanto en la cantidad quecobran que te registres y en el proceso de revisión para aceptar propuestas de aplicaciones.La spágina tarting es http://developer. amazon.com / home.html.

Page 69: Live code manual Español

[ 41 ]

Getting Started with LiveCode Mobile

1.Cuando hace clic en Comenzar, se le pedirá que inicie sesión en su cuenta de Amazon.

¿Qué dirección de correo electrónico para usar?Esto se siente como déjà vu! No hay ninguna ventaja real en Googleutilizando su dirección de correo electrónico al registrarse en el Programa deDesarrolladores de Amazon Appstore, perosi le sucede que tiene una cuenta en Amazon, inicia sesión con eso. Sesimplificará la etapa de pago, y su cuenta de desarrollador y la cuentageneral de Amazon se asocian entre sí.

Page 70: Live code manual Español

[ 42 ]

Chapter 2

2.You se les pide que de acuerdo con los términos del convenio AppStoreDISTRIBUCIÓN antes de aprender acerca de los costos.

Costos 3.Those son de $ 99 por año, pero el primer año es gratis. Así que eso es bueno!

Page 71: Live code manual Español

[ 43 ]

Getting Started with LiveCode Mobile

4.Unlike el Google Android Market, Amazon le pide a su banco por adelantado detalles,listo para enviar un montón de dinero en el futuro, esperamos!

5.That 'it s, usted está listo para hacer otra fortuna, para ir junto con el queGoogle te envía!

Page 72: Live code manual Español

[ 44 ]

Chapter 2

Pop Quiz - cuando algo es demasiado?Re 1.You 'al final del desarrollo de su mega-aplicación, es en 49,5 MB de tamaño, y sólo

tiene que añadir música de título de la pantalla. ¿Por qué no añades esa melodíaépica de dos minutos que se han alineado?

a.It tomaría demasiado tiempo para cargar

b. Las personas tienden a omitir la pantalla de título

tamaño de archivo c.El pronto de todos modos se va

a ir a más de 50 MB

d. Heavy metal podría no ser apropiada para aplicaciones de cuentos para niños

Descarga del Android SDKJefe de vuelta a http://developer.android.com/, y haga clic en Descargar enlace, o irdirectamente a http://developer.android.com/sdk/index.html.

En este libro, sólo vamos a cubrir Windows y Mac OS X (Intel), y sólo lo que senecesita para hacer el trabajo LiveCode con el SDK de Android y iOS. Si tienela intención de hacer nativas aplicaciones basadas en Java, entonces ustedpuede estar interesado en la lectura a través de todos los pasos que aredescribe en la web página:http://developer.android.com/sdk/installing.html.

Haga clic en el siguiente enlace para su plataforma. Los pasos que tendrá que ir através son diferentes para Mac y Windows. Vamos a empezar con Mac.

Page 73: Live code manual Español

[ 45 ]

Getting Started with LiveCode Mobile

Instalación del SDK de Android en Mac OS X (Intel)LiveCode sí mismo no requiere un Mac con procesador Intel, se puede desarrollar pilasusando un Mac basado en PowerPC, pero tanto el SDK de Android y algunas de lasherramientas para iOS requiere un Mac basado en Intel, que lamentablemente significa quesi usted está leyendo esto como se sienta al lado de su Mac G4 o G5, entonces no vamos allegar muy lejos!

El archivo que acaba de descargar automáticamente se expandirá para mostrar una carpetacon el nombre android-sdk-macosx. Puede ser en tu carpeta de descargas en estemomento, un lugar más natural para lo que sería en la carpeta Documentos, por lo quemudarse allí antes de realizar los siguientes pasos.

Hay un SDK Léame archivo de texto que enumera los pasos que tendrá que tomar. Si estospasos son diferentes a lo que tenemos aquí y siga los pasos de la Léame, en caso de que sehayan actualizado desde los pasos que se muestran aquí fueron escritos.

Abrir el Terminal de aplicación, que está en Aplicaciones / Utilidades. Es necesariocambiar los directorios que se ubicará en el android-sdk-macosx carpeta. Un truco muyútil en la Terminal es que usted puede arrastrar los elementos en la ventana de terminal paraobtener la ruta de acceso a ese elemento. Con ese truco, puede escribir CD y un espacio en laventana de Terminal, a continuación, arrastre el android-sdk-macosx carpeta justodespués del espacio. Usted va a terminar con esta línea:

nuevo-host-3: colin ~ $ cd / Users / colin / Documents / android-sdk-macosx

Por supuesto, la primera parte de la línea y el usuario carpeta coincide con la suya, no mía!El resto será el mismo aspecto. Así es como se vería un usuario llamado fred:

nuevo-host-3: fred ~ $ cd / Users / fred / Documents / android-sdk-macosx

Sea cual sea su nombre, pulse la tecla Retorno o Intro después de escribir esa línea. Loscambios en las líneas de ubicación a un aspecto similar al siguiente:

nuevo-host-3: android-sdk-macosx colin $

O escriba cuidadosamente o copiar y pegar esta línea del archivo Léame:

tools / android update sdk - no-ui

Pulse Intro o Enter nuevamente. ¿Cuánto tiempo toma la descarga dependerá de suconexión a Internet. Incluso con una conexión a Internet muy rápida, todavía tardarámás de una hora.

Page 74: Live code manual Español

[ 46 ]

Chapter 2

Instalación del SDK de Android en WindowsLa página de descargas recomienda utilizar el exe enlace de descarga, y que va a hacercosas adicionales, tales como comprobar si tiene el Java Development Kit (JDK) instalado. Alhacer clic en el enlace, utilice la opción Ejecutar o Guardar las opciones como lo haría concualquier descarga de un instalador de Windows. Aquí se optó por utilizar Ejecutar. Si ustedhace uso de Guardar, entonces usted tendrá que abrir el archivo después de que se guardanen el disco duro. En el siguiente caso, ya que el JDK no se ha instalado, uncuadro de diálogo aparece diciendo para ir al sitio de Oracle para obtener el JDK:

Si usted ve esto, entonces usted puede dejar el cuadro de diálogo de abrir y haga clic en elbotón java.oracle.com visita. En la página de Oracle, lo que tienes que hacer clic en una casillade verificación para aceptar sus términos, y luego en el siguiente enlace correspondiente a suplataforma. Elija la opción 64-bit si está ejecutando una versión de 64 bits de Windows, o laopción x86 si está ejecutando Windows 32-bit.

De cualquier manera, te da la bienvenida con otro instalador para ejecutar o guardar,como usted prefiera. Naturalmente, se necesita un tiempo para que el instalador haga losuyo también! Cuando finalice la instalación, aparecerá una página de registro JDK, sinoque depende de usted si se registra o no.

De vuelta en el cuadro de diálogo de instalación de Android SDK, puede hacer clic en elbotón Atrás y, a continuación, en el botón Siguiente para volver a esa etapa JDK decheques, sólo que ahora se ve que usted tiene el JDK instalado. Complete los pasos

Page 75: Live code manual Español

[ 47 ]

Getting Started with LiveCode Mobilerestantes de la instalación de SDK, como lo haría con cualquier instalador de Windows.

Page 76: Live code manual Español

[ 48 ]

Chapter 2

Una cosa importante a notar, y la última pantalla del instalador ofrece para abrir elAdministrador de SDK. Usted quiere hacer eso, así que resistir la tentación dedesactivar esa caja!

Haga clic en Finalizar, y le dará la bienvenida con una ventana de línea de comandos porunos momentos, y luego el Administrador de Android SDK aparecerá y haga su cosa.

Al igual que con la versión para Mac, se necesita mucho tiempo para todos estos add-ons paradescargar.

LiveCode Señalando el SDK de AndroidDespués de todo el trabajo de instalación y de línea de comandos, es un cambiorefrescante para volver a LiveCode!

Page 77: Live code manual Español

[ 49 ]

Getting Started with LiveCode Mobile

Abra las Preferencias LiveCode, y seleccione Soporte Móvil.

Vamos a establecer las dos entradas para iOS iOS va después de conseguir (en Mac es decir, estasopciones se atenuarán en Windows). Por ahora, haga clic en el botón ... situado junto al campo deAndroid SDK desarrollo de las raíces, y vaya a donde el SDK está instalado. Si ha seguido los pasosanteriores correctamente, entonces será en elDocumentos carpeta en Mac, o en C: \

Archivos de programa (x86) \ Android \ en Windows (o en otro lugar si decideutilizar una ubicación personalizada).

¡Uf! Ahora, vamos a hacer iOS ...

Pop quiz - nombres sabrosos código1.Android OS utiliza algunos nombres curiosos de código para cada versión. En el

momento de escribir esto, estamos en Android OS 4, que tenía un nombre en clavede Ice Cream Sandwich. Versión 4.1, presentado en el Google I / O en 2012, es JellyBean, y la siguiente versión se piensa que es tarta de lima. Cuál de estos es másprobable que sea el nombre de código para la posterior OS Android?

una. Entrar b

Cabin.

Almuerzo c

Page 78: Live code manual Español

[ 50 ]

Chapter 2Box. Munchies

d. Cheesecake de limón

Page 79: Live code manual Español

[ 51 ]

Getting Started with LiveCode Mobile

Convertirse en un desarrollador de iOSCreación de aplicaciones para iOS LiveCode requiere que LiveCode debe tener acceso al SDKde iOS. Esto está instalado como una parte de las herramientas de desarrollo Xcode, y que esun programa Mac-sólo. Además, al hacer subir una aplicación para iOS App Store, la aplicaciónque se utiliza es también sólo para Mac, y también es parte de la instalación de Xcode. Siusted es un desarrollador basado en Windows y desean desarrollar y publicar para iOS,entonces necesitará una máquina virtual que se puede ejecutar Mac OS, Mac o un real.

La mayor diferencia entre convertirse en un desarrollador de Android y un desarrollador deiOS es que usted tiene que firmar con Apple para su programa de desarrolladores, incluso sinunca producir una aplicación para iOS App Store. Si las cosas van bien, y terminan haciendouna aplicación para las diferentes tiendas, entonces esto no es un gran problema. Se le habrácostado $ 25 para poder presentar al Android Market, $ 99 al año (el primer año gratis) parapresentar a la Appstore Amazon, y$ 99 por año (incluyendo el primer año) para ser un desarrollador de iOS de Apple. Sólo vendenmás de300 copias de su aplicación sorprendente 0,99 dólares, y es pagado fo sí!

Su punto de partida para iOS eshttp://developer.apple.com/programs/ios/.

Page 80: Live code manual Español

[ 52 ]

Chapter 2

Cuando se registra para ser un desarrollador de iOS, existen cuatro posibilidades cuandose trata de su estado actual. Si ya dispone de un ID de Apple, para que puedas usar consus compras en la tienda online de Apple, o tal vez sus compras de iTunes Store, entoncesusted puede elegir el que ya tiene un ID de Apple ... opción. Con el fin de ilustrar todos lospasos en la firma,vamos a elegir para empezar como un nuevo usuario.

Page 81: Live code manual Español

[ 53 ]

Getting Started with LiveCode Mobile

Usted puede optar por inscribirse como individuo o como empresa. Vamos a elegir Individual.

Page 82: Live code manual Español

[ 54 ]

Chapter 2

Al igual que con cualquier tal proceso de registro, tendrá que introducir sus datospersonales, establecer una pregunta de seguridad, y escriba su dirección postal.

Page 83: Live code manual Español

[ 55 ]

Getting Started with LiveCode Mobile

La mayoría del software de Apple y servicios tienen su propio acuerdo legal para que lasfirmen. Éste es el acuerdo general registrada de Apple Developer.

Con el fin de verificar la dirección de correo electrónico que ha utilizado, una verificación de e-mail se envía a usted, conun enlace en el e-mail para hacer clic, o puede introducir el código manualmente. Una vez quehaya completadoel paso de verificación, puede introducir los datos de facturación.

Page 84: Live code manual Español

[ 56 ]

Chapter 2

Podría ser que usted vaya a hacer aplicaciones LiveCode para la Mac App Store, en cuyo casotambién habría que añadir el Mac Developer Program producto. Para nuestros propósitos,sólo hay que registrarse para iOS Developer Program.

Cada producto que se suscribe a tiene su propio acuerdo. Un montón de letra pequeña para leer!

Page 85: Live code manual Español

[ 57 ]

Getting Started with LiveCode Mobile

La compra real de la cuenta de desarrollador de iOS se maneja a través de la Apple Storepara su región.

Page 86: Live code manual Español

[ 58 ]

Chapter 2

Como verán, va a costar $ 99 por año, o $ 198 por año si también se ha registrado parala cuenta de desarrollador Mac. La mayoría de los usuarios LiveCode no tendrá queinscribirse en la cuenta de desarrollador de Mac, a menos que el plan es presentartambién las aplicaciones de escritorio de la Mac App Store.

Una vez enviado el pedido, son recompensados cuando se les dice que ahora está registradocomo unApple Developer!

Page 87: Live code manual Español

[ 59 ]

Getting Started with LiveCode Mobile

Por desgracia, no es una aprobación inmediata, como fue el caso con el Android Market oAppstore Amazon. Usted tiene hasta cinco días para esperar la aprobación. En los díastempranos de desarrolladores de iPhone, podría tomar un mes o más, por lo que 24horas es una mejora!

Pop quiz - nombres de código para iOSUsted tuvo fácil con el examen sorpresa sobre los nombres de Android OS de código! No es así con iOS.

1.Which de estos nombres es más probable que sea un nombre de código para una versiónfutura de iOS?

a.Las Vegas

b. Laguna Beach

c.Hunter Mountain d.

Valle de la Muerte

Instalar XcodeUna vez que reciba la confirmación de ser un desarrollador de iOS, you podrá iniciar sesiónen el iOS Dev Center, enhttps://developer.apple.com/devcenter/ios/index.action.

Page 88: Live code manual Español

[ 60 ]

Chapter 2

Esta página se utiliza la misma por los desarrolladores de iOS que no usan LiveCode, y estállena de documentos de apoyo para ayudar a alguien a crear aplicaciones nativas usandoXcode y Objective-C. No necesitamos más de eso, pero es necesario descargar Xcode.

Page 89: Live code manual Español

[ 61 ]

Getting Started with LiveCode Mobile

En el área de descargas de la página iOS Dev Center, podrás ver diferentes versiones de Xcodepara Mac OS 10.6 (Snow Leopard) y Mac OS 10.7 (Lion), así como el enlace a la antiguaXcode 3. También puede obtener el código de la Mac App Store, ya partir de la versión 4.3 deXcode, quetoma la forma de una aplicación en lugar de una carpeta de desarrollador.

Instalar Xcode desde la Mac App Store es muy sencillo, es como comprar cualquier otraaplicación en la tienda, sólo que es gratis! Se requiere que usted utiliza Mac OS 10.7.3 oposterior. Si está utilizando un sistema mayor, entonces usted descargue una de lasversiones más antiguas de la página del desarrollador.

El mayor proceso de instalación de Xcode es muy similar a cualquier otra aplicación de Mac:

Las instalaciones Xcode tomar un tiempo muy largo, pero al final, usted debe tener laRevelador carpeta o aplicación Xcode nuevo, listo para LiveCode de encontrar.

Page 90: Live code manual Español

[ 62 ]

Chapter 2

Hacer frente a los dispositivos más nuevos y mayoresA principios de 2012, Apple lanzó al mercado un nuevo iPad. El principalpunto de venta de éste en comparación con el iPad 2 es que tiene una"Retina" display. Los iPads regulares tienen una resolución de 1024x768,y la versión retina tiene unresolución de 2048x1536. Si desea crear aplicaciones para tomar ventaja deeso, usted debe obtener la versión de Xcode desde la Mac App Store, yno es una de las versiones más antiguas de la página del desarrollador. Elnuevo Xcode exige que sea en Mac OS 10.7.3 o posterior. Por lo tanto, paraapoyar plenamente los últimos dispositivos, es posible que tenga queactualizar el software del sistema más de lo que esperábamos! Pero espere,hay más. Al tomar una versión posterior de Xcode, seA continuación se ausente de las versiones de iOS SDK que se necesitan paraapoyar mayores dispositivos iOS, como el iPhone original y el iPhone 3G.Afortunadamente, usted puede ir a Preferencias en Xcode, y hay unapestaña de descargas, donde se puede disfrutar de los SDKs mayoresdescargados en la nueva versión de Xcode.

LiveCode Señalando los SDK de iOSAbra las Preferencias LiveCode, y seleccione Soporte Móvil.

Page 91: Live code manual Español

[ 63 ]

Getting Started with LiveCode Mobile

Haga clic en el ...situado junto a la ubicación de la raíz desarrollador de iOS 5.0 y superior:campo, y usted verá un cuadro de diálogo que le pregunta si está usando Xcode 4.2 o 4.3. Siselecciona 4,2, entoncesseguir para seleccionar la carpeta con el nombre Revelador en la raíz de su disco duro.Para 4.3, seleccione la aplicación Xcode sí mismo, en su Aplicaciones carpeta. Si estáutilizando un sistema antiguo que no era capaz de correr Xcode 4.2 o 4.3, y tuvo que tomar elXcode 3 descarga, haga clic enla ...situado junto a la ubicación de la raíz desarrollador de iOS 4.0 y superior: campo, yde nuevo, seleccione la carpeta con el nombre Revelador en la raíz de su disco duro.LiveCode ahora sabe dónde encontrar los SDK para iOS.

Antes de que podamos hacer nuestra primera aplicaciónmóvilAhora que los SDK necesarios están instalados y LiveCode sabe dónde están, podemos haceruna pila y probarlo en un simulador o en un dispositivo físico. Nosotros, sin embargo, tieneque conseguir los simuladores y dispositivos físicos calentado ...

Cómo prepararse para la prueba de AndroidSimulación en iOS es más fácil de lo que es para Android, y las pruebas en un dispositivo físico esmás fácil enAndroid que en iOS, pero la puesta en marcha de los dispositivos Android físicas puede serhorrendo!

Tiempo de acción - a partir de un dispositivo virtual de AndroidUsted tendrá que hacer un poco de investigación profunda en las carpetas del SDK de Android para encontrarel programa de instalación de Android Virtual Device, y bien puede ser que desee crear un acceso directo oalias para un acceso más rápido.

1. Navegue hasta el SDK de Android instrumentos carpeta, situado en C: \

Archivos de programa (x86) \ Android \ android-sdk \ en Windows,y en su Documentos: android-sdk-macosx: herramientas carpeta en MacOS.

2. Abra el Administrador de AVD en Windows o Android en Mac (se parece a un ejecutablede Unix

- Haz doble clic en él, y la aplicación se abrirá a través de una ventana de línea decomandos).

3. Si estás en Mac, seleccione Administrar AVDS ... en el menú Herramientas.

Page 92: Live code manual Español

[ 64 ]

Chapter 24. Seleccione Tablet de la lista de dispositivos (sólo hay dos cuando se ha

instalado por primera vez el SDK de Android - usted puede añadir suspropios personalizados aquí también).

5. Haga clic en el botón Inicio.

6. Siéntate pacientemente mientras el dispositivo virtual se pone en marcha!

7. Abra LiveCode, y crear un nuevo Mainstack y Guardar la pila en su disco duro.

8. Seleccione Archivo | Configuración de aplicaciones independientes ....

Page 93: Live code manual Español

[ 65 ]

Getting Started with LiveCode Mobile

9. Haga clic en el icono de Android, y seleccione la casilla de verificación Build Andoid.

10. Cierre el cuadro de diálogo Configuración, y echar un vistazo en el menú Desarrollo.

11. Si la máquina virtual está en funcionamiento, debería ver que aparece en elTarget Testsubmenú.

¿Qué ha pasado?Ustedes han abierto un dispositivo Android virtual, y LiveCode podrá probar las pilas que utilizan esedispositivo, carga una vez que ha terminado.

Conexión de un dispositivo físico AndroidConexión de un dispositivo Android físico puede ser muy sencillo:

1.Conecte el dispositivo por USB.

2.Observe el submenú Desarrollo Target Test para ver en la lista.

Puede haber casos problemáticos sin embargo, y de búsqueda de Google se convertirá en sumejor amigo antes de que haya terminado! Deberíamos considerar un caso problema deejemplo para darle ideas sobre cómo resolver situaciones similares que pueden aparecer.

El uso de un Kindle FireCuando se trata de encontrar los dispositivos Android, el SDK de Android reconoce quemuchos de ellos de forma automática. Algunos dispositivos no son reconocidos, y hayque hacer algo para ayudar Android Debug Bridge (ADB) encontrarlos.

ADB es la parte del SDK de Android que actúa como un intermediario entre desde eldispositivo a cualquier software que necesita para ser capaz de acceder al dispositivo. Enalgunos casos, usted tendrá que entrar en el sistema Android en el dispositivo para indicarleque debe permitir el acceso para fines de desarrollo. Por ejemplo, en un Android 3(Honeycomb) del dispositivo, tienes que ir a Ajustes | Aplicaciones | Desarrollo y activar elmodo de depuración USB.

Kindle Fire viene con la depuración USB ya está habilitado, usted no tiene que hacer nada,pero el sistema ADB no sabe sobre el dispositivo en absoluto. Usted puede arreglar eso!

Page 94: Live code manual Español

[ 66 ]

Chapter 2

Tiempo para la acción - la adición de un fuego Kindle a ADBSólo se necesita una línea de texto para agregar el Kindle Fire a la lista de dispositivos queADB conoce. La parte difícil es localizar el archivo de texto para editar y conseguir ADB parareiniciar después de hacer los cambios. Las cosas están más involucrados con Windows aMac, ya que también hay que configurar el controlador de USB, por lo que los dos sistemasse muestran aquí como procesos distintos:

Para Windows:

1. En el Explorador de Windows, navegue hasta la ubicación del archivoadb_usb.ini se encuentra, en C: \ Users \ nombredeusuario \android \..

2. Abrir el archivo de texto adb_usb.ini en un editor de texto. El archivo no tienesaltos de línea visibles, por lo que Wordpad sería una opción mejor que el Bloc denotas.

3. En la línea después de las tres líneas de instrucción, tipo de 0x1949.

4. Asegúrese de que no hay líneas en blanco, y el último carácter del archivo de textodebe ser el 9al final de 0x1949.

5. Guardar.

6. Vaya a donde android_winusb.inf se encuentra, en C: \ Archivos deprograma

(X86) \ Android \ android-sdk \ extras \ google \ USB_Driver \.

7. Haga clic derecho en el archivo y en Propiedades | Seguridad, seleccioneUsuarios de la lista, y haga clic en Editar para configurar los permisos para que sele permite escribir en el archivo.

8. Abierto android_winusb.inf en el Bloc de notas.

9. Agregue estas tres líneas al [Google.NTx86] y [Google.NTamd64] secciones,y guardar el archivo.; Kindle Fire

%% SingleAdbInterface = USB_Install, USB \ VID_1949 PID_0006 y

%% CompositeAdbInterface = USB_Install, USB \ VID_1949 PID_0006 + +MI_01

10. Usted tendrá que ajustar el Kindle para utilizar el controlador USB que Google acaba de editar.

11. En el panel de control de Windows, el Administrador de dispositivos, busque laentrada Kindle en la lista que se encuentra bajo USB.

12. Haga clic en la entrada Kindle y seleccione Actualizar software de controlador ....

Page 95: Live code manual Español

[ 67 ]

Getting Started with LiveCode Mobile

13. Elija la opción que le permite encontrar el controlador en la unidad local, vaya a lagoogle \ USB_Driver \ carpeta, y seleccione para ser el nuevo controlador.

Page 96: Live code manual Español

[ 68 ]

Chapter 2

14. Cuando se actualice el controlador, abra una ventana de comandos (práctico truco:Shift + clic derecho en el escritorio y seleccione Abrir ventana de comandos aquí).

15. Cambie al directorio donde la herramienta ADB se encuentra, escribiendo lo siguiente:cd C: \ Archivos de programa (x86) \ Android \ android-sdk \ platform-tools \

16. Escriba estas tres líneas, presionando ENTRAR después de cada línea:adb kill-server

adb start-server

adb dispositivos

17. Usted debe ver el Kindle Fire en la lista (comoun número desconocido buscando), así como eldispositivo virtual, si usted todavía tiene que correr.

Para Mac (mucho más simple!):

1. Vaya a la ubicación del archivo adb_usb.ini se encuentra. En Mac, en elFinder, seleccione el menú Buscar | Ir a la carpeta ..., y el tipo de ~ /. Android/.

2. Abrir el archivo adb_usb.ini en un editor de texto.

3. En la línea después de las tres líneas de instrucción, tipo de 0x1949.

4. Asegúrese de que no hay líneas en blanco, y el último carácter en el archivo de texto seríael 9

al final de 0x1949.

5. Guardar.

6. Open Utilities | Terminal.

7. Usted puede dejar OSX saber cómo encontrar ADB desde cualquier lugar, al escribir esta línea(reemplaceyourusername con su nombre de usuario, y también cambiar la ruta siha instalado el SDK de Android en una ubicación diferente):export PATH = $ PATH :/Users/yourusername/Documents/android-sdk- macosx / platform-tools

8. Ahora, introduzca las mismas tres líneas que hicimos con Windows:adb kill-server

adb start-server

adb dispositivos

Page 97: Live code manual Español

[ 69 ]

Getting Started with LiveCode Mobile

9. Una vez más, usted debe ver el Kindle Fire en la lista.

Page 98: Live code manual Español

[ 70 ]

Chapter 2

Sospecho que vas a tener pesadillas sobre todos los pasos! Me tomó un montón debúsqueda en la web para encontrar algunos de esos hacks oscuros. El caso general condispositivos Androiden Windows es que usted tiene que modificar el controlador USB para el dispositivo paraser manejado por el conductor Google USB, y es posible que tenga que modificar laadb_usb.ini archivo (en Mac también) para el dispositivo sea considerado como undispositivo compatible ADB.

Cómo prepararse para la prueba de iOSSi cuida pasó por todas las etapas Android, sobre todo en Windows, se espera que seadivertido por la brevedad de esta sección! Hay un problema, aunque, en realidad no sepuede probar en un dispositivo iOS de LiveCode. Vamos a ver lo que tiene que hacer en sulugar en un momento, pero primero, aquí están los pasos necesarios para probar unaaplicación en el simulador de iOS.

Tiempo de acción - utilizando el simulador de iOSLos primeros pasos son muy parecidos a los de aplicaciones de Android, pero luego sevuelve más rápido. Recuerde que esto sólo se aplica a Mac OS, y sólo se puede hacerestas cosas en Windows si está utilizando Mac OS en una máquina virtual, y hacer quemuy probablemente no cubiertos por el acuerdo de usuario Mac OS! En otras palabras, lomejor es conseguir un Mac si tiene la intención de desarrollar para iOS.

1. Abra LiveCode, cree un nuevo Mainstack y guarde la pila en su disco duro.

2. Seleccione Archivo | Configuración de aplicaciones independientes ....

3. Haga clic en el icono de iOS y seleccione la casilla de verificación Generar para iOS.

4. Cierre el cuadro de diálogo de configuración, y echar un vistazo en el menú Desarrollo.

5. Usted verá una lista de opciones del simulador, para el iPhone y el iPad, y diferentes versiones deiOS.

¿Qué ha pasado?Eso fue todo, todo lo que necesita para ponerse en marcha con las pruebasutilizando los simuladores de iOS! Las pruebas en un dispositivo iOS física requiereque crear una primera aplicación, así que vamos a hacer eso.

Appiness por fin!

Page 99: Live code manual Español

[ 71 ]

Getting Started with LiveCode Mobile

What just happened?En este punto, usted debería ser capaz de crear un nuevo Mainstack, guardarlo, seleccione iOSo Android en el cuadro de diálogo Configuración independiente, y ser capaz de ver lossimuladores o dispositivos virtuales en el menú Desarrollo / Test. En el caso de una aplicaciónpara Android, también podrá ver el dispositivo en la lista, si está conectado a través de USB a lavez.

Page 100: Live code manual Español

[ 72 ]

Chapter 2

Tiempo para la acción - probando una simple pila en lossimuladores

Siéntase libre de hacer lo que es más elaborado que solicitó en estos pasos! Las instruccionesestarán haciendo la suposición de que usted sabe cómo encontrar las cosas por ti mismo en lapaleta de inspector de objetos.

1. Abra LiveCode, cree un nuevo Mainstack, y guárdelo en un lugar donde es fácilencontrar en un momento de ahora.

2. Establecer la ventana de la tarjeta a un tamaño de 1024x768, y desactive la casilla deverificación Redimensionable.

3. Arrastre un campo de etiqueta en la esquina superior izquierda de la ventana de latarjeta, y establecer su contenido en algo apropiado. Hello World podría hacermuy bien!

4. Si está desarrollando en Windows, vaya al paso 11.

5. Abra la aplicación autónoma de diálogo Configuración, haga clic en el icono deiOS y seleccione la casilla de verificación Generar para iOS.

6. En Opciones de orientación, establecer la orientación inicial iPhone en horizontal.

7. Cierre el cuadro de diálogo.

8. Desde el Desarrollo / Target Test sub-menú, seleccione el simulador de iPad.

9. Seleccione Prueba en el menú Desarrollo.

10. Usted debe ahora ver a su pila de prueba que se ejecuta en el simulador de iOS!

11. Como se señaló anteriormente, el lanzamiento del dispositivo virtual Android.

12. Abra la aplicación autónoma cuadro de diálogo Configuración, haga clic en el iconode Android, y seleccione la casilla de verificación Build para Android.

13. En Opciones de la interfaz de usuario, establezca la orientación inicial a Horizontal.

14. Cierre el cuadro de diálogo.

15. Si el dispositivo virtual está en ejecución por ahora, hacer todo lo necesariopara pasar de la pantalla de inicio bloqueada, si eso es lo que se estámostrando.

16. Desde el Desarrollo / Target Test sub-menú, seleccione el emulador de Android.

17. Seleccione Prueba en el menú Desarrollo.

Page 101: Live code manual Español

[ 73 ]

Getting Started with LiveCode Mobile

What just happened?18. Usted debe ahora ver a su pila de prueba que se ejecuta en el emulador de Android!

Page 102: Live code manual Español

[ 74 ]

Chapter 2

Si todo va bien, que acaba de hacer y corrió su primera aplicación móvil, tanto en Android yiOS! Para un encore, debemos probarlo en dispositivos físicos, aunque sólo sea para darAndroid oportunidad de demostrar lo fácil que puede ser para hacer eso. Hay toda una latade gusanos que aún no han abierto que ver con conseguir un dispositivo IOS configurado demanera que puede ser utilizado para la prueba. Esto se trata en profundidadEn un capítulo posterior, que se puede leer ahora, o puede visitar el Pro iOSPortal visionarioen https://developer.apple.com/ios/manage/overview/index.action, Y miraren la ficha Cómo en cada una de las diferentes secciones.

Tiempo para la acción - probando una simple pila de dispositivosConsiga sus cables USB listo, y conectar los dispositivos a su computadora. Android primero ...

1. Se le debe quedar seleccionado en Configuración Android aplicación independiente.

2. Obtenga su dispositivo a su pantalla de inicio, más allá de la pantalla de bloqueo inicial, sies que existe.

3. Elige Desarrollo / Target Test y seleccione su dispositivo Android. Bien puede decirAndroide y un número muy largo.

4. Elige Desarrollo / Test.

5. La pila debe ahora estar ejecutándose en su dispositivo

Android. Ahora iOS ...

1. Si usted no ha leído el capítulo posterior sobre la implementación en el dispositivo,o las páginas de Apple, o que no han instalado los certificados y los archivos deaprovisionamiento, entonces usted tendrá que pasar esta prueba, por ahora.

2. Cambiar la configuración de aplicación independiente de nuevo a iOS.

3. En Configuración de la aplicación básica de la configuración de iOS es un perfil enel menú desplegable que muestra los archivos de aprovisionamiento que hainstalado. Elija el que está configurado para el dispositivo que se va a probar.

4. Cierre el cuadro de diálogo y selecciona Guardar como aplicación autónoma ... en elExpediente menú.

5. En Finder, busque la carpeta que acaba de crear, y lo abre para revelar la Apppropio archivo. Como no se dio por la pila de un nombre sensible, será nombradoUntitled 1.

6. Abra Xcode, que está en la carpeta del desarrollador que creó anteriormente, en elAplicaciones sub-carpeta.

Page 103: Live code manual Español

[ 75 ]

Getting Started with LiveCode Mobile

What just happened?7. En Xcode, seleccione Organizador en el menú Ventana y seleccione Dispositivos,si no está ya seleccionado.

8. Debe aparecer en la lista. Selecciónelo, y si ves un botón etiquetado para usoDesarrollo, haga clic en ese botón.

9. Arrastre el archivo app directamente desde el Finder a su dispositivo en la ventana deOrganizer.

10. El pequeño círculo de color naranja a su vez, por un momento, y luego de vuelta a verde.

11. Ahora puede abrir la aplicación en tu dispositivo iOS!

¿Qué ha pasado?Además de obtener una pila de prueba trabajando en dispositivos reales, también vimos lofácil que es, una vez que todo está configurado, para poner a prueba una pila directamentea un dispositivo Android. Si está desarrollando una aplicación que se va a desplegar entanto Android y iOS, es posible que la manera más rápida al trabajo es poner a prueba conel simulador de iOS para las pruebas de iOS, pero para probar directamente en undispositivo Android en lugar de utilizar el Android SDK virtuales dispositivos.

Tener un héroe go - NookHasta hace poco, el apoyo de Android para el Nook Color de Barnes and Noble no era losuficientemente bueno para aplicaciones LiveCode a instalar. Parece que ha mejorado, sinembargo, y bien podría ser otra tienda de aplicaciones que vale la pena para que ustedpueda apuntar.

Investigar el proceso de firma, descargar su SDK, y así sucesivamente. Con un poco desuerte algo de lo que aprendió en la suscripción a las otras tiendas también se aplicará a latienda de Nook. Esta es su punto de partida:

https://nookdeveloper.barnesandnoble.com

Otras lecturasLos proveedores de SDK, Google y Apple, tienen páginas extensas de información sobre laconfiguración de sus entornos de desarrollo, la creación de certificados yaprovisionamiento de los archivos, y así sucesivamente. La información tiene que cubriruna gran cantidad de temas que no se aplican a LiveCode, así que no trate de perderse!Estos serían good páginas que empiezan por:

http://developer.android.com/

http://developer.apple.com/ios/

Page 104: Live code manual Español

[ 76 ]

Chapter 2

ResumenLa inscripción para los programas, archivo de la descarga, de comandos alineando sucamino por todo el lugar, y esperando pacientemente a que el emulador de Android paraponer en marcha, significa que podría tomar la mejor parte de un día a trabajar a través delo que hemos cubierto en este capítulo ! Afortunadamente, usted sólo tiene que ir a travésde él una vez.

Hicimos el trabajo a través de las tareas que tiene que hacer antes de poder crear unaaplicación móvil en LiveCode:

Descargar e instalar el SDK de Android

Regístrate como desarrollador de iOS

Descargar e instalar Xcode y el iOS SDK

Configurar dispositivos y simuladores

También cubre algunos temas que serán útiles una vez que esté listo para cargar una aplicación de acabado:

Registrarse en Android Market

Inscribirse en Amazon Appstore

Habrá cosas más mundanas que cubren cerca del final del libro, pero no por muchotiempo! El siguiente, vamos a empezar a jugar con algunas de las habilidades especiales delos dispositivos móviles.

Page 105: Live code manual Español

[ 77 ]

Getting Started with LiveCode Mobile

3La construcción de interfaces de

usuario

Así que muchas pantallas diferentes!Cuando se realizan aplicaciones de servicios públicos o juego para computadoras deescritorio que puedasa menudo llegar a tener una ventana de tamaño especial, por lo que usted puede hacergráficos personalizados que se ajustan exactamente. Con los dispositivos móviles que tieneque hacer frente a unaamplia gama de tamaños de pantalla, y relaciones de aspecto, y también tienen elementosde interfazque parecen correctos para el sistema operativo en el dispositivo del usuario.

LiveCode es capaz de publicar en Mac, Windows y Linux, y supone un avance hacia lasolución de la dificultad de buscar elementos de la interfaz adecuada para cada plataforma.El menú View tiene un aspecto y elemento de menú Feel donde se puede elegir entre eltema indígena, Mac OS Classic, Windows 95, y Motif. Lo mismo no puede decirse de lossistemas operativos móviles, todoscontroles parecen Motif. Usted todavía tiene dos opciones: puede crear gráficos que parecenque pertenecen en su sistema operativo de destino, o puede llamar a rutinas nativas con el finde que el sistema se presenta los controles adecuados que buscan.

En este capítulo vamos a:

Establecer un "banco de pruebas" de aplicaciones móviles

Abra el correo electrónico y las ventanas del navegador

Muestra un control de selector de fecha

Carga de imágenes de la biblioteca y la cámara

Hacer un botón de iOS buscando

Manual de diseñar una interfaz

Utilice el código para diseñar una interfaz

Mira a controles de la interfaz móvil de gran alcance add-on

Page 106: Live code manual Español

Building User Interfaces

[ 70 ]

La creación de un banco de pruebas de aplicacionesmóvilesComo un campo de pruebas para las cosas que vamos a intentar, vamos a configurar una solaaplicación móvil que cuenta con varias pantallas, una para cada una de las cosas quequeremos probar.

Lo que hay que llamar a la aplicación de banco de pruebas?Podríamos llamar a casi cualquier cosa, pero vamos a dejar que el iPhone ayuda atomar la decisión por nosotros. En el iPhone y el iPod touch, sólo hay una pequeñacantidad de espacio debajo de los iconos de la pantalla de inicio para que aparezcasu nombre. iOS sesu nombre nice app largo y se mostrará una versión abreviada del nombre,utilizando elipses para concatenar los extremos del nombre juntos. "Miaplicación duper super" aparecerá como "Mi sup ... app" - no es tan informativo!El número de letras que puede aparecer sin que se truncada variarádependiendo de la anchura de las letras utilizadas, pero típicamente es un límitede 11 cartas. Por lo tanto, vamos a llamar al banco de pruebas de aplicación "LCbanco de pruebas", que es exactamente 11 cartas!

Tiempo para la acción - lo que la pila de banco de pruebasAntes de crear el iOS y Android, tenemos que conseguir lo que queremos ir como una pilaLiveCode, y completamente a prueba en nuestras computadoras de escritorio. Estos pasosvan a asumir que usted sabe cómo hacer lo que se le pide en LiveCode, sin instruccionesprecisas.

1. LiveCode Abrir, crear un nuevo Mainstack y Guardar como LCTestBed.

2. Establezca el tamaño en 320x480. Sólo para asegurarse de que las cosas van aaparecer en la más pequeña de las pantallas. Las cosas que hacen que estará en lazona lateral superior izquierdo de pantallas más grandes.

3. Vamos a hacer un botón por cada carta en la pila. Comience por hacer una llamadaMenú.

4. Nombre de la primera tarjeta Menú.

Page 107: Live code manual Español

Chapter 3

[ 71 ]

5. Agrega botones para correo electrónico, navegador, DatePicker e Imagen.Asegúrese de que los botones son lo suficientemente grandes para tocar en susdispositivos. Usted debe tener algo como la siguiente captura de pantalla:

5. Cree cuatro nuevas cartas. Nombre cada uno de tal manera que coincidacon uno de los nombres de los botones.

6. Volviendo a la primera tarjeta, ajuste el guión de cada botón de manera que va ala tarjeta, con este script:en mouseUp

ir tarjeta el nombre corto

del mouseUp final me

7. En cada tarjeta, crear un botón para volver a la tarjeta de menú. Nombre del botónMenú.

Establezca su guión a los mismos que los otros botones.

8. Seleccione la opción Ejecutar (browse) de herramientas, y tratar de hacer clic enlos botones para saltar a cada una de las cuatro cartas y de vuelta a la tarjeta delmenú.

¿Qué ha pasado?Pues bien, nada demasiado emocionante! Pero ahora debe tener cinco cartas y la habilidad paramoverse entre la tarjeta del menú y los demás. Ahora vamos a agregar secuencias de comandos paracada tarjeta para ayudar a ilustrar las diversas características. El enfoque más eficaz consistiría enagregar todos los guiones y botones relacionados y campos, y luego probar la aplicación de pruebalecho final de una sola vez. Pero, ¿dónde está la diversión en eso? Por lo tanto, vamos a crear unafunción a la vez.

Page 108: Live code manual Español

Building User Interfaces

[ 72 ]

Invocando el escritorio aplicación de correo electrónicoHay muchos casos en que es posible que desee saber de los usuarios de sus aplicaciones. Talvez usted quiere que correo electrónico mejoras sugeridas, o dejar que te hagan preguntas.Desde aquí se puede poner en marcha su programa de correo electrónico, y luego se van adecidir quéescribir. Si lo prefiere, puede configurar automáticamente la dirección "A", el tema, eincluso algunos del cuerpo del mensaje. Por lo menos que podría hacer su vida más fácil, yaque puede filtrar los correos entrantes basado en algo que le coloca en el campo de asunto.

Tiempo de acción - pidiendo que el nativo de aplicación de correoelectrónico

Vamos a hacer algunos campos y un botón para probar el envío de una función de correo electrónico.

1. Ir a la tarjeta e-mail y crear cuatro campos. Nómbrelos Desde, CC,Asunto, y Cuerpo.

2. Hacer un botón denominado Test.

3. En el botón de prueba, escriba el siguiente guión:en mouseUp

poner el campo "Para"

poner en ToText campo "CC"

en ccText

poner el campo "Asunto" en

subjectText poner campo "Cuerpo" en

bodyText

revMail ToText, ccText, subjectText,

bodyText final mouseup

4. Seleccione la herramienta de ejecución y la información de ejemplo tipo en cada uno delos campos.

5. Haga clic en el botón Probar.

¿Qué ha pasado?Una cosa aseada sobre sintaxis LiveCode es que el código de las aplicaciones móvilestambién funciona para las aplicaciones de escritorio, y viceversa. Si todo va bien, cuando sehace clic en el botón Probar te encontraras en tu correo electrónico predeterminadoaplicación, lista para enviar el mensaje de que había entrado en el campo LiveCode pila.

Instalación del correo electrónico de prueba en los dispositivos

Page 109: Live code manual Español

Chapter 3

[ 73 ]

No es ninguna sorpresa que la prueba funcionó escritorio, la posibilidad de abrir otrasaplicaciones es una característica básica de LiveCode. Aún así, es estupendo para poderestablecer un texto inicial para el nuevo mensaje de su uso. A continuación se debe versi esto puede funcionar en dispositivos también.

Page 110: Live code manual Español

Building User Interfaces

[ 74 ]

Tiempo de acción - stack tratando de banco de pruebas en losdispositivos

Conecta tu Android y / o dispositivo iOS al ordenador mediante USB. Estas instrucciones soncasi los mismos que en el capítulo anterior, donde hemos probado un Hello World pila, ydespués de este punto cualquier dirección será más breve, basado en el supuesto de que ustedsabe los pasos necesarios para probar una aplicación en su dispositivo. Capítulo 7,Implementación en el dispositivo, se describentodas las opciones del cuadro de diálogo Configuración de aplicaciones independientes,pero por el momento sólo vamos a rellenar algunos detalles, así que aquí vamos a versólo una parte del diálogo, a partir de la configuración de Android.

1. Asegúrese de que Android está activada en la configuración de aplicación independienteCuadro de diálogo.

2. En el campo de identificador, el tipo de un identificador que será único.com.yourname. lctestbed iba a hacer.

3. Obtenga su dispositivo a su pantalla de inicio, más allá de la pantalla de bloqueo inicial, sies que existe.

4. En LiveCode, elija Desarrollo / Target Test y seleccione su dispositivo Android. Sellamará Androide seguido de un número largo.

5. Elige Desarrollo / Test.

6. Después de haber sido compilados, la pila debe ejecutarse en su dispositivoAndroid, y usted debería ser capaz de tocar el botón Correo electrónico y crear unmensaje de prueba que utilizará el Android aplicación de correo electrónico.

Page 111: Live code manual Español

Chapter 3

[ 75 ]

7. Pasando a iOS, si no lo ha hecho, lea el Capítulo 7, Implementación en el dispositivo, oleer por lo menos aquellas partes que muestran cómo instalar los certificados paradesarrolladores iOS y archivos de aprovisionamiento. Al igual que con Android, sólovamos a cambiar un par de elementos en el cuadro de diálogo Configuración de laaplicación independiente. Esta es el área que vamos a estar cambiando:

8. Cambiar la configuración de aplicación independiente para iOS.

9. Bajo la aplicación básica sección Configuración de los ajustes de iOS es un perfilen el menú desplegable de los archivos de aprovisionamiento que ha instalado.Elija uno que está configurado para el dispositivo que se va a probar en.

10. En el campo de aplicación interna en un ID único de identificación. Al igual que conAndroid, com.yourname. lctestbed iba a hacer. sunombre Por supuesto,sería su nombre, o el nombre de su empresa.

11. Si está probando el iPad, seleccione la opción iPod, iPhone y iPad de laDispositivos compatibles en el menú desplegable.

12. Cierre el cuadro de diálogo y selecciona Guardar como aplicación autónoma ... en elExpediente menú.

13. Cuando el proceso de almacenamiento se haya completado puede ver unmensaje de advertencia, informándole sobre pantallas de inicio y los iconosque faltan. No haga caso de estos por ahora.

14. En Finder, busque la carpeta que acaba de crear, y lo abre para revelar laApp propio archivo.

15. Abra Xcode y seleccione Organizador en el menú Ventana y, a continuación, seleccioneDispositivos, si no está ya seleccionado.

Page 112: Live code manual Español

Building User Interfaces

[ 76 ]

16. Debe aparecer en la lista. Selecciónelo, y si ves un botón etiquetado para usoDesarrollo, haga clic en ese botón.

17. Arrastre el archivo de aplicación directamente desde la ventana del Finder para sudispositivo en el Organizador

ventana.

18. El pequeño círculo de color junto al dispositivo se volverá naranja por un momento,y luego de vuelta a verde.

19. Ahora puede abrir la aplicación y probar el botón Enviar para crear un mensaje de prueba, que utilizarála aplicación estándar de iOS correo.

¿Qué ha pasado?Hemos pasado a través de los pasos necesarios para instalar la aplicación banco de pruebas tanto enlos dispositivos Android y iOS. También tuvimos que cambiar un par de cosas en el cuadro de diálogoConfiguración de la aplicación independiente. Como has visto, hay un buen montón de ajustes allí.Usted puede esperar a conocer a todos en el Capítulo 7, Implementación en tu equipo

Apertura de una página webOtra de las necesidades de su aplicación ha de ser capaz de presentar información adicionalen línea. Usted quiere que el usuario haga clic en un enlace, o el tacto como el caso puedeser, y será llevado a una página que enumera todas las otras aplicaciones que puedencomprar a usted!

Tiempo de acción - pidiendo la aplicación del navegador nativoEsta próxima prueba será mucho más rápida. O al menos, las instrucciones serán másbreves, como vamos a condensar algunos de los pasos en direcciones más concisas.

1. Copie el botón de prueba en la tarjeta de E-mail, y pegarlo en la tarjeta delnavegador, sólo para ahorrar algo de tiempo para hacer el botón de un aspectoagradable.

2. Edite el script de botón de prueba, y el cambio a lo siguiente:en mouseUp

lanzar url "http://www.runrev.com/"

final mouseUp

3. Elija la herramienta Ejecutar y haga clic en el botón Test. Debería ver la página deinicio RunRev en su navegador predeterminado.

Page 113: Live code manual Español

Chapter 3

[ 77 ]

Tratar la aplicación en dispositivos es exactamente lo mismo que con las pruebas de la función de correoelectrónico. Para Android:

1. Seleccione Android en el cuadro de diálogo Configuración de la aplicación independiente.

2. Selecciona tu dispositivo Android como el blanco de prueba en el menú deDesarrollo (muy probablemente ya se habrá seleccionado de la prueba anterior).

3. Seleccione Prueba en el menú Desarrollo.

4. La prueba anterior de la aplicación se pueden sobrescribir, y la nueva versiónse iniciará automáticamente.

5. Pruebe el botón del navegador, y luego el botón de prueba que acaba de crear en elNavegador tarjeta. La página runrev.com debe ser

abierta.

ParaiOS:

1. Seleccione iOS en el cuadro de diálogo Configuración de la aplicación independiente.

2. Rehacer el Guardar como aplicación independiente, arrastre el archivo de aplicación en sudispositivo en el

Organizador ventana de Xcode, como lo hizo laprimera vez.

3. Prueba el navegador y botones de prueba, así que debería ver la página de inicio RunRevabierto dentro de Safari.

¿Qué ha pasado?Al igual que con el correo electrónico de prueba, añadiendo el código estándar para laapertura de una página web que funciona para Android y iOS, al igual que lo hace para unacomputadora de escritorio.

Si está probando tanto en Android y iOS, te darás cuenta de que el comportamiento esdiferente cuando regrese de mirar una página web. Con Android, puede pulsar el botón deflecha hacia atrásy todavía estar en la tarjeta del navegador de su pila. Con iOS la pila se reinicia cuandoregrese. Una solución a esto que vamos a examinar más tarde es para escribir datos en unarchivo externo, de modo que cuando la aplicación se vuelve a abrir podemos regresar alusuario a donde estaban antes de salir de la aplicación.

Mobile-only, selector de

Page 114: Live code manual Español

Building User Interfaces

[ 78 ]

fechaEl siguiente par de ejemplos vamos a tratar son los que sólo funcionan en los dispositivosmóviles, no en las computadoras de escritorio.

Page 115: Live code manual Español

Chapter 3

[ 79 ]

Tiempo de acción - que muestra un selector de fechaMuchas aplicaciones requieren que el usuario seleccione una fecha para un evento, y conlos dispositivos móviles hay una mirada especial a la "selector de fechas" que semuestran. LiveCode nos permite visualizar dicho control.

1. Copie el botón de prueba de la tarjeta de explorador y pegarlo en la tarjeta DatePicker.

2. Cambiar el guión a lo siguiente:en mouseUp

iphonePickDate

"fecha" mouseUp final

3. Seleccione la herramienta Ejecutar y probar el botón de prueba. Verás unerror, porque esta es una característica de sólo móvil.

4. Para variar, seleccione Simulador de iPhone o iPad a partir de la Meta de Desarrollo / Testmenú y, a continuación, elija Prueba en el menú Desarrollo.

5. Verá su stack abrir en el simulador de iOS, y puedes probar el DatePicker yPruebabotones, para ver el selector de fechas iOS se está visualizando.

6. Realice los mismos viejos Guardar Como e instalar siguiendo los pasos ventana delorganizador a fin de tratar el selector de fechas en su dispositivo iOS.

7. Pulse el botón DatePicker en la tarjeta del menú y el botón de prueba de la tarjeta datepicker.Un selector de fecha iOS nativo debe aparecer.

¿Qué ha pasado?Espero que estés cada vez más rápido en la construcción e instalación de aplicacionesmóviles por ahora! Además de probar de nuevo en un dispositivo, también probamos elsimulador. Generalmente hablando es el más rápido para poner a prueba lo que puedecon el simulador de iOS, y sólo en un dispositivo de prueba cuando se esté examinandocosas como multi-táctil, acelerómetro y soporte de la cámara.

Mobile-solamente, cuadros de cargaTal vez algún día será posible poner en imágenes desde la aplicación de escritorio ordenadordel usuario foto, o desde su cámara web, pero por ahora estas son características que sólofuncionan en dispositivos móviles.

Page 116: Live code manual Español

Building User Interfaces

[ 80 ]

Tiempo de acción - Fotos de cargaLiveCode puede recurrir a la biblioteca de fotos natal y aplicaciones de la cámara. Vamos aprobar ambos en Android y iOS, pero por supuesto sólo si el dispositivo tiene algunasimágenes guardadas, y una cámara. Para el Kindle Fire, que no tiene una cámara, asegúresede guardar algunas imágenes en la aplicación Galería, de modo que por lo menos podemosintentar cargar esos.

1. Copie el botón de prueba de la tarjeta DatePicker y pegarlo dos veces en las imágenestarjeta. Cambie el nombre de los botones para Prueba de la cámara y Prueba deBiblioteca.

2. Edite el guión de la Prueba de la cámara botón a lo siguiente:en mouseUp

mobilePickPhoto "cámara"

fin mouseup

3. Edite el guión de la Prueba Biblioteca botón a lo siguiente:en mouseUp

mobilePickPhoto

"biblioteca" fin mouseup

4. Al probar la carga de imágenes, la imagen que se carga cubrirá los botones deprueba, nos impide volver a la carta menú. Para resolver este problema, agregueesto a la escritura de la tarjeta:en mouseup

si la palabra 1 del objetivo es "imagen" a continuación,

elimine el objetivo final mouseup

5. Ir a Ajustes aplicación independiente, y seleccionar Android.

6. Tenemos que preguntarnos Android OS permiso para utilizar la cámara, y para almacenarla imagen, a fin de comprobar los requisitos para la cámara y escritura de almacenamientoexterno como se muestra en la siguiente captura de pantalla:

Page 117: Live code manual Español

Chapter 3

[ 81 ]

7. Repita los pasos habituales para las pruebas en su dispositivo Android, o instalaren su dispositivo iOS.

Page 118: Live code manual Español

Building User Interfaces

[ 82 ]

8. Una vez que la aplicación se está ejecutando en las fotografías toque el equipo, enla primera pantalla y, a continuación, Biblioteca Test. Usted debe ver a las típicas OSopciones específicas para la elección de una imagen de tu biblioteca o una galería.

9. La imagen que ha seleccionado se carga en la ventana de la tarjeta, y llenará lamayor parte de la pantalla, ocultando nuestra prueba y los botones del menú. Elguión tarjeta entramos significa que usted puede tocar la imagen para borrarla, yluego intente otra prueba.

10. Pruebe el botón de la cámara de prueba. Verá la aplicación de la cámara con sistema operativoespecífico, y cuando hayas tomado una foto y tocó el uso o el botón OK en la aplicación de lacámara, la imagen se coloca en la tarjeta Pictures.

¿Qué ha pasado?Estas secuencias de comandos simples ilustrar cómo LiveCode es capaz de llamar a lasaplicaciones de OS-específicas para hacer lo que de otra manera sería tomar un montón decodificación. Incluso mejor, ya que las versiones posteriores de iOS y sistemas operativosAndroid son liberados, las secuencias de comandos simples mismos activar las funcionesmás avanzadas que Apple y Google han puesto en práctica.

Pop Quiz - conseguir el cuadro grandeNos tomamos tanto por sentado lo que se refiere a las mejoras en la tecnología. Usted puedesentir duro hecho por si la cámara del teléfono es un mísero 2 megapíxeles, pero piensen encómo eran las cosas hace mucho tiempo, y lo grande que la imagen que estaban acostumbrados aver. En términos de lanúmero de píxeles, el número de pantallas originales de Macintosh pueden encajar en el áreaindicada por una sola8-megapixel foto?

una.

4

b. 15

c. 24

d. 45

Haciendo utilizar botones de estiloEs bueno que LiveCode puede recurrir a los controles del sistema operativo nativo, sinoque plantea un problema debido a que los estándares de estilo Motif-botones se veanmuy bien en comparación. Podemos arreglar que, o bien mediante el uso de algunascaracterísticas integradas de LiveCode, o con el uso de un producto de complemento.

Page 119: Live code manual Español

Chapter 3

[ 83 ]

El uso de mapas de bitsComo vimos en el Capítulo 1, Fundamentos LiveCode, puede utilizar mapas de bits diferentespara los estados del botón. Usted puede obtener este tipo de imágenes, tomando imágenesde los botones de su dispositivo móvilpor lo menos con iOS y OS Android v4 y más tarde, o usted puede ahorrar mucho tiempodescargando archivos que otros han hecho disponibles. Algunos de estos archivos sólo tienenlicencia para su uso en prototipos,pero vamos a echar un vistazo a uno que también tiene licencia para su uso en productoscomerciales.

Tiempo para la acción - el uso de Photoshop para preparar losestados botón

El archivo que se va a utilizar Photoshop tiene efectos de filtro que GIMP no puedemanejar, así que por desgracia se necesita Photoshop para seguir estos pasos, o por lomenos un amigo que tiene Photoshop!

1. Lea el artículo en el siguiente enlace:http://spin.atomicobject.com/2011/03/07/photoshop-template-for-iOS botones /

2. El artículo apunta a algunas otras fuentes de información, pero por ahora justdescargar este archivo:http://spin.atomicobject.com/assets/2011/3/7/iOS_Buttons.psd

3. Abra el archivo en Photoshop (puede abrir automáticamente).

4. En la paleta Capas ocultar las capas nombradas Antecedentes y Barra de Herramientas -Retina.

5. Expanda la capa denominada Button Bar - Retina, y ocultar la capa de la etiqueta delbotón.

6. Utilice la herramienta Marco para seleccionar un área alrededor del botón lateralsuperior derecho. Ahora debería tener el siguiente aspecto:

Page 120: Live code manual Español

Building User Interfaces

[ 84 ]

7. Elija Copiar combinado en el menú Editar.

8. Seleccione Nuevo en el menú Archivo, asegúrese de que el contenido de fondo seestablece en

Transparente, y aceptar el tamaño que le den.

9. Seleccione Pegar, será un ajuste exacto, y usted verá el estado de reposo para ese botón.

10. Seleccione Guardar para Web y dispositivos ... en el menú Archivo.

11. En el cuadro de diálogo Guardar, seleccione 24 bits PNG, y asegúrese de que lacasilla de Transparencia está seleccionada. Guarde el archivo PNG con un nombre

adecuado, por ejemplo bluebuttonup.png.

12. Volver al documento principal y activar la capa activa visible =.

13. Haga otra Copiar combinado, Nuevo, Pegar y Guardar para Web y dispositivos ....

14. Guarde el PNG como bluebuttondown.png.

15. Vuelve a LiveCode.

16. Vuelva a abrir la pila de banco de pruebas.

17. Utilice Archivo | Importar como Control | Archivo de Imagen ... para traer los dos archivosPNG en la pila.

18. Puede colocar las dos imágenes en cualquier lugar. Desactive la opción Visible en Propiedades

Page 121: Live code manual Español

Chapter 3

[ 85 ]

básicas para cada imagen.

19. Añadir un nuevo botón a la primera tarjeta, y le dan el nombre Ubicación.

Page 122: Live code manual Español

Building User Interfaces

[ 86 ]

20. Establecer la secuencia de comandos botón para:en iphoneStartTrackingLocation

mouseUp

poner iphoneCurrentLocation () en

theLocation theLocation respuesta

["latitud"]

final mouseUp

21. Seleccione la Ubicación botón, y en las propiedades básicas de la paletaInspector, desactivar el nombre de Show y opaco.

22. En Iconos y Fronteriza, apague Tres D, Border, y la frontera Hilite.

23. Haga clic en el botón varita mágica junto a la entrada del icono de la paleta Inspector.

24. Desde la biblioteca de imagen en el menú desplegable, seleccione Esta pila.

25. Haga clic en el encendedor de las dos imágenes azules.

26. Haga clic en el botón varita mágica junto a la entrada icono Hilite, acontinuación, haga clic en la más oscura de las dos imágenes.

27. Cambiar el tamaño del botón para ser lo suficientemente grande como paramostrar la imagen azul sin que se recorta.

28. Coloque un campo Etiqueta en la parte superior de la tecla.

29. En Propiedades Básicas, marque la casilla para discapacitados. Esto es paraasegurarse de que el campo no atrapar el clic que usted va a hacer. Queremosque el botón para obtener ese clic.

30. En Contenido, introduzca Ubicación.

31. En Formato de texto, establezca el campo para utilizar Helvetica Neue, 18 punto,Bold, y

centro alineados.

32. En colores & las gamas, ajuste el color del texto a ser blanco.

33. Alinear el campo y el botón de modo que los dos se centra en la otra.

34. Si ahora prueba con el simulador de iOS y haga clic en el Ubicación botón, ustedacaba de ver un cero, pero las pruebas en un dispositivo debe mostrar su latitud altocar el botón (se le tiene que dar permiso a la aplicación para saber su ubicaciónla primera vez que pulse el botón).

Page 123: Live code manual Español

Chapter 3

[ 87 ]

¿Qué ha pasado?Aunque el botón que hizo no puede ser el tamaño perfecto, ni siquiera tiene el aspectocorrecto para un botón independiente iOS, sí que fuimos a través de todos los pasos queusted necesita para hacer imágenes de los botones de estado. La colocación de un campoLiveCode sobre los botones de imagen no es necesariamente la mejor apariencia. En realidad,le tomaría más tiempo en Photoshop para hacer que el botón derecha para el ancho de laetiqueta que está usando, y también puede añadir el texto a la imagen en sí. Se vería mejor, yusted no tendrá que utilizar un campo para mostrar el nombre del botón en LiveCode.

LiveCode es capaz de utilizar código para crear las imágenes que necesitamos, mediante elestablecimiento de los puntos de un gráfico, así como su fillGradient. Pero una vez queusted tiene los componentes necesarios para simular un botón u otro tipo de control, aún serequerirá mucho más secuencias de comandos para administrar dichos elementos.

No hay una salida fácil, aunque, pero que le costará $ 50!

Pop quiz - el costo de las cosas en estos díasAl igual que con el aumento de sus expectativas para el tamaño de una foto digital,también espera obtener una mayor cantidad de su dinero en estos días. Mientras quesopesar las ventajas de gastar $ 50, ¿cuánto mejor valor crees que una memoria deordenador ahora en comparación con hace 25 años?

A.10 b veces mejor.

La mitad de bueno

C.100 veces mejor

d. 6.000 veces mejor!

MobGUI al rescate!RunRev tiene su sede en Edimburgo, Escocia, y ellos son un grupo talentoso! Pero ellos noson el pueblo escocés sólo talento, también hay John Craig. Ha desarrollado un poderosocomplemento para LiveCode que incluye una lista cada vez más larga de iOS y Android OSbuscando controles. Si usted fuera a comprar su producto que usted pagaría $ 50, para locual se obtiene la versión actual, además de los cambios que se liberan en los 12 mesessiguientes a la fecha de compra. Al tiempo que toma un vistazo aquí, podemos utilizar unaversión de prueba del producto.

Page 124: Live code manual Español

Building User Interfaces

[ 88 ]

Tiempo de acción - Conceptos básicos del MobGUIAl igual que con otros complementos para LiveCode, MobGUI tendrá que ser instalado en lacarpeta de plugins LiveCode. En Windows que serán Mis documentos / Mi LiveCode

/ Plugins. En Mac será ~ / Documentos / My LiveCode / Plugins.

1. Descargue la versión más reciente de MobGUI dehttp://mobgui.com/download. php.

2. El archivo comprimido se ampliará para convertirse en una pila LiveCode, llamadorevMobGUI.livecode.

3. Arrastre la pila en la plugins carpeta y volver a abrir LiveCode.

4. Hacer una nueva Maintstack.

5. En el menú Desarrollo, elige Plugins / revMobGUI. Esta ventana aparecerá:

Page 125: Live code manual Español

Chapter 3

[ 89 ]

6. El primero de los iconos es la pantalla de bienvenida, y los últimos cinco iconosson para cosas tales como el registro, soporte y actualizaciones recibiendo. Hagaclic en el segundo icono, el que se parece a un botón de reproducción. Verá esteacuerdo:

7. La ventana MobGUI se parece mucho a una combinación de la herramienta y LiveCodeInspector paletas.

8. Intenta arrastrar elementos diferentes en la tarjeta, y mirar las opciones para cada artículo.

9. Haga clic en la imagen iPhone, a ver que se puede cambiar entre losdiferentes conjuntos de controles.

10. Seleccione el iOS Controles 2 de la lista que aparece.

11. Arrastre un TabBar en la ventana de la tarjeta, tenga en cuenta la forma en que se ajustaa la parte inferior.

Page 126: Live code manual Español

Building User Interfaces

[ 90 ]

12. Haga clic en el control Button y seleccione 4 de la lista.

Page 127: Live code manual Español

Chapter 3

[ 91 ]

13. Verás que ahora puede arrastrar y crear cuatro botones de una sola vez.

14. Alt + doble clic en uno de los nuevos botones que acaba de hacer. Los botoneshacia fuera para llenar la anchura de la tarjeta.

¿Qué ha pasado?Algo muy importante de LiveCode es que las numerosas ventanas y paletas que se utilizanen el programa están a sólo pilas, y hemos comenzado a hacer uso de una pila especializadaque nos va a ahorrar un montón de tiempo, y nos dará una OS agradable interfaz específicabuscando.

Prueba de cama aplicación, la forma MobGUIVamos a hacer mucho la misma aplicación banco de pruebas, pero en este vamos a tratar de dar unamirada más a la aplicación de iOS.

Tiempo de acción - con MobGUI para hacer una aplicación de bancode pruebas

A medida que trabaja en LiveCode y empezar pilas nuevas, guardar y cerrar otras pilasabiertas previamente, ya que todavía puede ser la memoria de ocupación. A veces se puedeentrar en un estado de confusión en el que estamos haciendo una nueva pila sin título, sólopara encontrar que ya hay una pila sin título en el camino, que le pregunta si desea purgar.¿Por qué no disfrutar de un lanzamiento para dejar de fumar y fresca de LiveCode!

1. Crear un nuevo Mainstack. Establezca el nombre de MGTestBed, y guárdelo en algúnlugar se puede encontrar fácilmente. Tal vez en la carpeta con el LCTestBed pila, quese sentía sola!

2. Abra la ventana MobGUI, seleccionando el Desarrollo / Plugins / revMobGUI.

3. En la página de la ventana de controles MobGUI usted verá que usted puede elegirun tamaño de la pila. Seleccione el tamaño de iPhone, y la pila se convertirá en320x480.

Page 128: Live code manual Español

Building User Interfaces

[ 92 ]

4. Haga clic en el botón denominado código preOpenCard Añadir a la escritura de latarjeta. Se trata de introducir el código necesario para inicializar MobGUI.

5. Establezca el nombre de esta primera carta a Correo electrónico.

6. Recuerde que puede cambiar entre los diferentes conjuntos de controles con unclic derecho sobre la imagen del iPhone. A partir de ese menú, seleccione iOSControles 2.

7. Arrastre el control de BG en la tarjeta. Se va a crear una capa de fondo.

8. Arrastre una barra de pestañas en la ventana de la tarjeta. Se acoplará a la parteinferior de la ventana de la tarjeta, y también cambiar el tamaño de la anchura dela tarjeta.

9. Haga clic en el botón de control en la ventana MobGUI y seleccione 4.

10. Arrastre los botones en la ventana de la tarjeta, en la parte superior de labarra de pestañas. Cuatro botones serán añadidos.

11. Lo más probable los botones se fuera a la parte derecha de donde deben estar.Alt + doble clic en uno de los botones, para cambiar el tamaño y la propagación a travésdel ancho dela ventana de la tarjeta. Si es necesario, seleccione los botones y empujar hacia arriba ohacia abajo parahacer que ellos se sientan bien en contra de la barra de pestañas.

12. Seleccione cada botón y establecer los nombres y etiquetas a Correoelectrónico, Navegador, DatePicker, y Imagen.

13. Seleccione la Email botón y elegir objetos de secuencias de comandos en elmenú Objeto o haga clic en el botón y elija la opción Editar guión. Lasecuencia de comandos se verá así:

Page 129: Live code manual Español

Chapter 3

[ 93 ]

14. Usted puede agregar a la secuencia de comandos. Modifique laTouchstart controladorpara que se vea como el siguiente:en Touchstart PID

mobGUITouch el identificador

largo de mi tarjeta ir el nombre

corto de mí

final Touchstart

15. Puede copiar el guión completo del primer botón, y pegarlo en los otros tres botones.

16. Vamos a necesitar estos elementos en todas las cuatro cartas que vamos a hacer, así queseleccione todos y luego elegir grupo seleccionado en el menú Objeto.

17. Asegúrese de que el grupo es seleccionado y en la paleta Inspector LiveCodeperiódica, marque la casilla de comportarse como un fondo.

18. Hacer más tres cartas, y el nombre de ellos Navegador, DatePicker, y Imagen.

19. Desde el menú en el que elegimos iOS Controles 2, seleccione iOS Controles 1.

20. Arrastre el control NavBar en la ventana de la tarjeta para cada una de las cuatrocartas, y establecer el nombre coincide con el nombre de la tarjeta,

21. En Configuración de la aplicación autónoma, elegir iOS o Android, según eldispositivo que desea probar sucesivamente.

22. Establezca el ID de aplicación interna, o Identificador, para com.yourname.MGTestBed.

23. Si utilizas iOS, asegúrese de elegir un perfil en el perfil en el menú desplegable.

24. Ahora puede hacer una prueba en el menú Desarrollo, después de haber elegido cualquiersimulador de iPhone o tu dispositivo Android conectado.

¿Qué ha pasado?Parece que unos cuantos pasos, pero no debe tomar mucho tiempo, y ya tenemos lanavegación entre las cuatro cartas que parecen una auténtica interfaz de iOS.

Ahora vamos a obtener algunas de las características de la prueba en marcha, pero de una maneramás natural, de manera integrada que antes.

MobGUI controles nativosUna de las características de gran alcance de MobGUI es que puede usar los controlesordinarios LiveCode como marcadores de posición para lo que será controles nativoscuando se ejecuta la aplicación en un dispositivo. Esto es algo que puedes hacer por timismo con el código, pero ser capaz de mover los controles de marcador de posición

Page 130: Live code manual Español

Building User Interfaces

[ 94 ]

alrededor hasta que te gusta el diseño se ahorrará un montón de tiempo.

Page 131: Live code manual Español

Chapter 3

[ 95 ]

Tiempo de acción - con controles nativos de MobGUIHaga clic en la imagen pequeña del iPhone en la ventana MobGUI, y asegúrese de queusted está en el Native iOS controles establecidos.

1. Ir a la tarjeta E-mail y arrastre tres controles de texto y un control de texto delíneas múltiples de los controles nativos de iOS establecidos en la ventanaMobGUI.

2. Nombre de los controles de texto como Para, CC, y Asunto, y el control de texto delíneas múltiples como

Cuerpo. El tamaño de la Cuerpo debe hacerse lo suficientemente grande como paraentrar en unas pocas líneas de texto.

3. A medida que crea cada campo, tenga en cuenta que puede establecer el tipo deteclado. Ajústelo a Email para la A y CC campos.

4. De iOS Controles 1 establecer y arrastrar dos botones a la ventana de latarjeta. Nombre de un Hecho, y el otro Enviar. Usted debe tener algo que separece a la siguiente captura de pantalla:

Page 132: Live code manual Español

Building User Interfaces

[ 96 ]

5. Al probar la aplicación y toca uno de los campos, la lámina del teclado aparecerá.Usaremos elHecho botón como una manera para ocultar el teclado. Agregar una línea deatención altouchEnd manejador de la Hecho botón de secuencia de comandos:en touchEnd PID

mobGUIUntouch el id de largo

que me centre en nada

- End otras

líneas touchEnd

6. MobGUI puede recuperar propiedades de estos campos nativas, utilizando unmobFieldGet función. Cambie el botón Enviar touchEnd controlador a utilizaresa función para cada campo, y también para llamar la revMail función:en touchEnd PID

mobGUIUntouch el identificador largo de mí

poner mobFieldGet ("A", "texto") en

ToText poner mobFieldGet ("CC", "texto")

en cctext

poner mobFieldGet ("Subject", "texto") en

subjecttext poner mobFieldGet ("Cuerpo", "texto")

en BodyText revMail ToText, cctext, subjecttext,

BodyText

final touchEnd

7. Ir a la tarjeta Browser.

8. A partir de los controles nativos de iOS establecidos, arrastre un control de texto ala ventana de la tarjeta, y el nombre que URL.

9. Arrastre un control de explorador (el que muestra Google como su imagen) en laventana de la tarjeta, y el nombre Page.

10. Ajustar los tamaños de modo que el campo de texto llena el ancho de la tarjeta,y el control del explorador llena la zona entre el campo de texto y la barra depestañas en la parte inferior.

11. Seleccione el control del navegador, y en la ventana MobGUI introduzca un valorpara el URL. Esto hará que el control de la carga navegador la URL como suprimera página.

12. Edite el script del campo de texto URL, y añadir este controlador:en inputReturnKey

mobBrowserSet "Página", "url", mobFieldGet ("URL", "texto")

final inputReturnKey

Page 133: Live code manual Español

Chapter 3

[ 97 ]

13. Pruebe con otra prueba, e ir a las tarjetas de correo electrónico y el explorador para verlos en acción.

Page 134: Live code manual Español

Building User Interfaces

[ 98 ]

¿Qué ha pasado?Hemos recreado las dos primeras pruebas de nuestra aplicación a principios de banco de pruebas,pero ahora se ve mucho mejor! También hizo uso de la habilidad MobGUI para obtener y establecerdatos en controles nativos de iOS, en este caso mediante el uso de mobFieldGet ymobBrowserSet.

Tener un héroe go - otras pruebas y bonitos iconosSeguir adelante y añadir las otras dos pruebas a la pila.

Para el DatePicker ejemplo, añadir una OpenCard controlador para la tarjeta que incluye lalínea:iphonePickDate fecha.

Para la prueba de imagen, mira los cuatro pasos en la hora de la acción - Carga sección de loscuadros anteriormente en este capítulo. Sin embargo esta vez se le añade a los botones de laslíneas nativas, y la inserción de las líneas en la touchEnd en lugar de un controladormouseUp manejador.

Para obtener un bono, edite el grupo de barras y seleccione uno de los botones. En laventana MobGUI verá que puede establecer iconos personalizados para los estados Dim yactivo para cada botón.Si se realiza una búsqueda de imágenes en Google de Iconos gratis móviles,

usted debería ser capaz de encontrar un montón de ejemplos que se ven bien en loscuatro botones que hicimos.

Ajuste de las cosas para diferentes tamaños de pantallaHasta ahora sólo hemos comprobado con un tamaño de iPhone, y sólo la orientaciónvertical. Usted puede querer usar la misma pila para el iPhone y el iPad, o quizás iPad ytabletas Android, que tienen relaciones de aspecto bastante diferentes.

Incluso si nos atenemos sólo al iPhone, a pesar de ello quieren cuidar de Retrato y Paisajeorientaciones. Por lo tanto, tenemos que encontrar maneras de organizar los numerososcontroles de la tarjeta para lucir lo mejor posible para cada tamaño de pantalla y laorientación.

Hay varias maneras de lograr esto. En primer lugar vamos a ver en el uso de un controlador decambio de tamaño.

Layout utilizando un controlador de cambio de tamañoCuando se cambia una pila de tamaño de la ventana, envía un LiveCode resizeStackmensaje de que pueden atrapar, con el fin de reorganizar los controles para la nueva

Page 135: Live code manual Español

Chapter 3

[ 99 ]

anchura y altura.

Page 136: Live code manual Español

Building User Interfaces

[ 100]

Tiempo para la acción - ejemplo sencillo diseño de códigoPodría llegar a ser muy complicado si se puso un vistazo a todos los controles de la tarjetacon código, así que sólo vamos a construir un caso sencillo, para mostrar la técnica. Puedemejorar esta tarde para los casos más complejos.

1. Crear un nuevo Mainstack.

2. Añadir cuatro botones través de la anchura de la tarjeta.

3. Pon este controlador en el guión de la tarjeta:en resizeStack newWidth,

newHeight

poner la anchura del botón 1 en buttonWidth

put (newWidth - 4 * buttonWidth) / 5 en

brecha de poner la parte superior del botón

1 en repetición buttonTop con a = 1 a 4

fijar la parte superior de un botón para buttonTop

establecer la izquierda del botón una brecha a + (a-1) * (brecha+ buttonWidth)

Fin de repetición

pasar

resizeStack

resizeStack final

4. Cambiar el tamaño de la ventana de la tarjeta. Los botones deben extenderse uniformementea través de la tarjeta.

5. Vaya a Ajustes aplicación independiente y seleccione la opción iOS.

6. Asegúrese de que los dispositivos compatibles incluyen los iPad.

7. Establezca las opciones de orientación para incluir las cuatro orientaciones.

8. En el menú de Desarrollo estableció el objetivo de prueba para ser elsimulador de iPad, y hacer una prueba.

9. En el simulador, elija Rotar a la izquierda o Girar a la derecha, en el menú Hardware.

10. Los botones deben propagarse por toda la pantalla, tanto en orientación verticaly paisaje.

¿Qué ha pasado?Además de hacer un ejemplo sencillo de cómo la resizeStack controlador puede serusado, también hemos visto que los cambios de orientación enviar el resizeStackmensaje.

Page 137: Live code manual Español

Chapter 3

[ 101 ]

Layout usando el Administrador de Geometría LiveCodeMientras se selecciona un control en la tarjeta, la paleta Inspector tiene una entradadenominada geometría. Es una interfaz un tanto extraño! Vamos a echar un vistazo.

Las barras horizontales y verticales tenues se utilizan para seleccionar si desea que elcontrol que reducirse o colocado en una cantidad fija o un familiar. Es decir, si un botón esde 100 píxeles desde la parte derecha de la ventana de la tarjeta, y se selecciona laposición de ser una distancia fija, como cambiar el tamaño de la ventana de la tarjeta delbotón permanecerá 100 píxeles por el lado de la derecha borde de la ventana. Si, por elcontrario, se utiliza el valor relativo, y el botón es de 80 por ciento a través de la ventanade la tarjeta, todavía será del 80 por ciento a través de la ventana después de haberlocambiado de tamaño.

Page 138: Live code manual Español

Building User Interfaces

[ 102]

El primer clic en una de esas barras hará que sea de color rojo sólido de color, lo que indicaque es una distancia fija desde el borde de la tarjeta. Si hace clic de nuevo se convierte enuna forma de onda de color rojo, lo que indica que va a ser relativo.

En la captura de pantalla anterior se puede ver que el botón seleccionado se ajusta paraque sea una distancia fija desde la parte inferior de la tarjeta, y una distancia relativa desdeel lado derecho de la tarjeta. La imagen también muestra los ajustes de escala para elcontrol.

Tiempo para la acción - con el Administrador de Geometría en laposiciónbotones

Ahora vamos a añadir algunos botones a la pila que hemos marcha. Una cosa a saber:las características de diseño de MobGUI (que veremos a continuación) están encompetencia con el Administrador de la geometría, así que si usted todavía tiene quese abren desde antes, haga clic en la casilla de verificación que dice "Desactivar lageometría auto.

1. Tomar los primeros cuatro botones y duplicar ellos, por poner otro juego de cuatro por debajo de losprimeros.

2. Seleccione el primero de los nuevos botones y en la sección Geometría de lapaleta Inspector, haga clic una vez sobre la barra vertical, y dos veces en la barrahorizontal, que termina con el estado que se muestra en la imagen.

3. Haga lo mismo con los otros tres botones.

4. Trate de cambiar el tamaño de la ventana de la tarjeta.

¿Qué ha pasado?Ese fue un gran test rápido, y si todo ha ido bien, verá que cambiar el tamaño de la ventanade la tarjeta es el posicionamiento de los cuatro primeros botones usando el resizeStackmanejador hemos añadido, y posicionar el segundo conjunto de cuatro botones con elGestor de geometría. Con la configuración que hemos utilizado, los resultados deberían serlo mismo, excepto que el segundo conjunto de cuatro botones se mantendrá una distanciafija desde la parte inferior de la ventana de la tarjeta.

Hay una gran cantidad de energía en el Administrador de Geometría, y usted debe echar unvistazo a las otras habilidades que tiene desde el enlace de referencia que aparece al final deeste capítulo. Pero no resulta ser la mejor manera de lidiar con tamaños de pantalla móviles.Una vez más, MobGUI al rescate!

Page 139: Live code manual Español

Chapter 3

[ 103 ]

Layout usandoMobGUIEl enfoque de diseño utilizado por el Administrador de Geometría está orientada a lasaplicaciones de escritorio, donde el usuario es muy probable que cambiar el tamaño de laventana a una cantidad desconocida. Con móvilaplicaciones, la disposición sólo cambia una vez que se carga la aplicación y luego cadavez que cambia la orientación. Cuando lo hace cambiar lo va a cambiar entre solo dostamaños diferentes. Es una situación mucho más sencillo que cambiar el tamaño deventana de una aplicación de escritorio a un tamaño arbitrario.

MobGUI utiliza un enfoque diferente para resolver el problema general, que tieneventajas cuando se trata de aplicaciones móviles.

Tiempo de acción - con MobGUI recordar diseños paranosotros

Si has estado siguiendo a lo largo de allí, y marcó la casilla para desactivar ventanaMobGUI geometría auto, desactive de nuevo. Vamos a necesitar!

1. Crear un nuevo Mainstack.

2. Uso de la ventana MobGUI, establezca la ventana de la tarjeta para iPhone de tamaño yPaisaje.

3. Arrastre un control NavBar en la tarjeta.

4. Arrastre un TabBar en la tarjeta.

5. Haga clic en el botón de control MobGUI y seleccione 4, a continuación, arrastre loscuatro botones en la barra de pestañas que acaba de agregar.

6. Alt + doble clic en uno de esos botones para extenderse, y también ellos semueven verticalmente a ser muy bien posicionado en contra de la barra depestañas.

7. Haga clic en la imagen en la ventana de iPhone MobGUI, y cambiar la orientaciónde ser Retrato.

8. Seleccione la barra de pestañas y sus botones, y moverlos a la parte inferior dela ventana de la tarjeta vertical.

9. Utilice las teclas Alt + doble clic truco para hacer que la barra de pestañas, labarra de navegación, y los botones, se extendieron por todo el ancho de laventana de la tarjeta vertical.

Page 140: Live code manual Español

Building User Interfaces

[ 104]

10. Trate de hacer clic en el Retrato y Paisaje botones. El diseño debe cambiar a lo que habíacreado cuidadosamente.

Page 141: Live code manual Español

Chapter 3

[ 105 ]

¿Qué ha pasado?Este enfoque de MobGUI, donde se acuerda el diseño de cada uno de los tamaños depantalla y orientaciones posibles, sólo parece tener más sentido para el uso móvil. ElAdministrador de Geometría es ciertamente más potente y flexible, pero en realidadquiere cuidadosamente disposición los arreglos diferentes para estar lo mejor posible parauna pantalla de tamaño dado, en lugar de depender de la aritmética para reposicionartodo para usted.

Tener un héroe go - otros tamañosAcabamos de hacer la propia tarjeta trazar muy bien para iPhone retrato y los modos de paisaje.Ahora haga lo mismo otra vez, para el retrato iPad y modos de paisaje, y también para un tamaño depantalla de costumbre800x480, tanto vertical como horizontal.

Un consejo ahorro de tiempo es que usted puede seleccionartodos los controles antes de hacer la Alt + doble clic. Esto haráque la barra de navegación, TabBar y botones, que se extiende deuna sola vez.

Otras lecturasComo se mencionó anteriormente, el Gerente de Geometría tiene un montón decaracterísticas de gran alcance. Vamos a estar pegado con el enfoque MobGUI, pero siusted también está interesado en las aplicaciones de escritorio, eche un vistazo a la lecciónen esta página:

http://lessons.runrev.com/s/lessons/m/4067/l/19026-Geometry-Manager

Page 142: Live code manual Español

Building User Interfaces

[ 106]

ResumenEl truco con herramientas fáciles de usar, tales como LiveCode, es crear aplicacionesmóviles que los usuarios piensan fueron creados con la más difícil de usar herramientasnativas, como Xcode. Usted puede lograr que debido a la capacidad LiveCode para llamara funciones nativas, y porque se puede hacer que las interfaces que parecen correctas.

En este capítulo hemos cubierto varias maneras de lograr ese objetivo:

Llamar a funciones nativas del sistema operativo, con comandos simples LiveCode

Preparación de imágenes que se utilizarán para los estados botón

Haciendo OS botones específicos que buscan mediante la adición de esas imágenes

Creación de iOS controles nativos buscan con MobGUI

Trazado de la interfaz con el código, el Administrador de Geometría y MobGUI

Hasta ahora, estos han sido pequeñas pilas de prueba, para que nos calienta! Lo siguienteque vamos a ver la estructura de aplicación general, y hacer una aplicación de utilidad depleno derecho.

Page 143: Live code manual Español
Page 144: Live code manual Español

4Uso de datos remotos y medios de

comunicación

Los datos tienen que salir más!Las solicitudes pueden presentarse en la que todos los datos de apoyo estádentro de la aplicación, pero muy a menudo queremos mostrar los datos queestán en el mundo real en alguna parte, y también para guardar información(una lista de puntajes altos tal vez) a archivos externos a la aplicación.

Al crear una aplicación LiveCode tenemos que pensar acerca de la estructura de la pila, sucódigo, y los datos que utiliza.

En este capítulo vamos a:

Mira las diversas formas que puede esperarse una pila estructurados

Piensa que el código debe ir

Escribir y leer archivos de texto externos

Crear una aplicación de bloc de notas-como para recordar interesantes archivos de losmedios de comunicación basados en Internet

No te olvides de descargar los archivos de ejemplo!Hay una gran cantidad de líneas de código de este capítulo. El código semuestra junto con explicaciones acerca de cada función, y se podía construiralgo que hacía juego con el archivo de muestra correspondiente. Pero sería muyfácil cometer un error al transcribir los guiones, tanto en términos de lo que elguión dice, ydonde el script debe ser colocado. Puede ser más seguro para estudiar losarchivos de ejemplo y para leer la descripción general aquí. Puede descargar elcódigo desde el sitio Packt.

Page 145: Live code manual Español
Page 146: Live code manual Español

Using Remote Data and Media

[ 100 ]

Pila estructuraHay dos aspectos en la forma de una pila puede ser estructurada. Uno tiene que ver concómo los elementos de interfaz de usuario se organizan, y el otro es en qué lugar de lajerarquía de una pila se debe colocar el código.

Código impulsado y creado manualmente diseñosSi usted se imagina cómo una aplicación móvil típica aparece, podría ser algo comolo siguiente:

A veces las aplicaciones son totalmente claves determinadas, donde cada pantalla se puedever que se crea utilizando el código en el momento que se necesite. O tal vez ya estaríaexpuesto los elementos quese guardan como recursos, y entonces el código de carga esos recursos. En cualquiercaso, la aplicación en su conjunto podría tener lugar en el equivalente de una tarjetaLiveCode.

Otra posibilidad sería diseñar todas las combinaciones posibles de pantalla como tarjetasdiferentes, o incluso las pilas, e ir a la carta o grupo que se parece a la aplicación debería enese momento.

Page 147: Live code manual Español

Chapter 4

[ 101 ]

En el primer caso se necesitaría para ejecutar la aplicación y pasar por las acciones de losusuarios con el fin de ver si el diseño es correcto, después volver atrás y cambiar el códigoo los recursos, y vuelva a intentarlo. En el segundo caso, es posible que se enfrentan auna gran cantidad de combinaciones de diseño.

A medida que comenzamos a hacer que las aplicaciones aquí, vamos a tratar de encontrarun punto medio, donde vamos a utilizar tarjetas para configurar las pantallas principales quevamos a necesitar, y luego utilizar el código para mostrar y ocultar otros elementos. Elobjetivo es tratar de ser eficiente, y no crear código complejo para la colocación de loselementos que se pueden hacer rápidamente con la mano, o usar un montón de imágenescuando una pequeña cantidad de código podría obtener los mismos resultados.

Ubicaciones para el códigoLiveCode es extremadamente flexible en términos de cómo estructurar las cosas que sehacen con ella. Además de una docena de tipos diferentes de control que podrían contenercódigo, puede tener scripts delanteros, los grupos, la tarjeta actual, un mainstack, pilas en eluso de secuencias de comandos, la espalda, y LiveCode sí mismo. Este diagrama muestrasólo unos pocos ejemplos de los controles, pero te da la sensación de cuántos niveles hay ala jerarquía en LiveCode:

También puede hacer que las pilas de subprocesos, que a menudo se utilizan para mostrar ventanas dediálogo, la capacidad de agregar delantero y scripts de espalda, y se puede poner las pilas dentro y fuera deuso. En general, puede llegar a ser muy confuso!

Page 148: Live code manual Español

Using Remote Data and Media

[ 102 ]

Es en gran parte un asunto de estilo personal en cuanto a donde poner los scripts, y muchasveces usted puede tener un argumento razonable de por qué lo hiciste una determinadamanera. Se podría argumentar que toda la acción que se llevará a cabo debe estar en laescritura del botón que has seleccionado. Sería más fácil de editar todos los controladoresimplicados, y si usted necesita las mismas características en otra pila que sólo tienes quecopiar el botón de ancho. Sin embargo, si usted tenía un número de esos botones en lapantalla, y era necesario hacer cambios, habría que hacerlo para todos ellos.

Otro argumento sería válido decir que todos los controladores estaría en el nivel de lapila. Usted tendría entonces un lugar central para hacer cambios, pero usted tendría quehacer un montón de "if" para comprobar que el control había sido operado.

Es posible que desee volver a utilizar las rutinas que se han desarrollado con el tiempo, y que tienen unconjunto de pilas que se pone en servicio, cada uno manejando pila sólo un aspecto particular de la tarea encuestión. En el mundo de la Programación Orientada a Objetos (OOP) es muy común para extender esteenfoque a un grado loco, con cientos, o incluso miles, de pequeños archivos que manejan cada una ínfimaparte de la aplicación en general.

No vamos a ir a cualquiera de estos dos extremos. En su lugar vamos a tratar de poner el código en el nivelmás bajoque tiene que ser sin tener que duplicar el código, ya que hacer controles adicionales queNecesita mismo Código. Para ello vamos a tratar de pensar en el futuro y tratar de detectareficiencias queque podemos utilizar. Veamos un ejemplo ...

Suponga que tiene un botón de menú principal, y su función es la de llevar al usuario a latarjeta de llamada principal. Teniendo esto como guión del botón parece tener sentido:

en mouseUp

ir tarjeta

"principal"

mouseUp final

Parece ser el nivel más bajo que el código puede ser, y no vamos a ser lo duplicar, hay sóloun botón del menú principal. Pero, supongamos que desea realizar un seguimiento delprogreso del usuario,el botón de menú principal no se sabe nada de eso. Por lo tanto, podríamos hacer esto en sulugar:

en mouseUp

navTo

"principal" fin

mouseUp

En el guión tarjeta no habría este controlador:

en navTo Acard

Page 149: Live code manual Español

Chapter 4

[ 103 ]

Acard

saveNavState

go tarjeta

final navTo

Page 150: Live code manual Español

Using Remote Data and Media

[ 104 ]

saveNavState sería una función en algún lugar que es el que salva de estado del usuario.El único problema es que cada una de las tarjetas que hacen que incluye el botón Menú principaltiene que tener esta navTo manejador en sus guiones. Por lo tanto, vamos a poner elcontrolador en elmainstack guión pila. Con ella a ese nivel que puede manejar las llamadas de cualquier botón encualquier tarjeta.El guión del botón de ayuda podrían ser:

en mouseUp

navTo

"ayuda" fin

mouseUp

Ir a la tarjeta de ayuda también guardar el estado del usuario. Más adelante se podría añadirun efecto visual como saltar de un lugar a otro, y puede hacer que el cambio en navTo, enlugar de tener que ir a todos los distintos botones que hacen uso de la navTo manejador.

Pop quiz - nombre que la estructura1.There es un término común usado para describir la jerarquía LiveCode que ayuda a

transmitir cómo la información se transmite hacia arriba y hacia abajo en lajerarquía. ¿Cuál es ese término?

una. El b Event

Horizon. C La ruta del

mensaje. La pila de

llamadas

d. La pila de Inicio

Cargar y guardar datos externosEn muchas aplicaciones se desea realizar un seguimiento de los cambios que el usuario hahecho. Hay varias maneras de hacerlo que con LiveCode, incluyendo la consulta de unaURL, leer y escribir en un archivo de texto y guardar los datos dentro de una pila.

Consultar un URLMuy a menudo aplicaciones basadas en web que cargar y guardar datos de secuencias decomandos del servidor. Eso se puede hacer con las aplicaciones LiveCode también. He aquíun ejemplo, cuando queremos saber cuál es el precio de cierre fue para Google ayer:

poner url "http://quote.yahoo.com/d/quotes.csv?s=GOOG&f=p"

Page 151: Live code manual Español

Chapter 4

[ 105 ]

En el momento en que la línea se puso a prueba, 609,46 apareció en el cuadro de mensaje:

¿Quién sabe lo que va a encontrar cuando lo intento!

Al igual que con cualquier tipo de llamadas a un servicio en línea que hay una posibilidad deque puede tomar algún tiempo para devolver el valor, y en el LiveCode ejemplo anteriorpuede ser bloqueado de hacer cualquier otra cosa hasta que los datos fue devuelto. Unenfoque alternativo sería cargar la URL con el fin de almacenar en caché, y luego mostrar losresultados cuando se almacena en caché. LiveCode sería capaz de hacer otras accionesmientras los datos están siendo devueltos. Un script de botón se vería así:

en mouseUp

descargar url "http://quote.yahoo.com/d/quotes.csv?s=GOOG&f=p"

Dirección URL de carga

"Http://quote.yahoo.com/d/quotes.csv?s=GOOG&f=p" conmensaje "gotit"

final mouseUp

en gotit addr, estado

si el estado es "caché" o el estado es

"descargado" y conteste url addr

más

responder

estado final si

terminar gotit

La gotit controlador también comprueba para ver si la llamada trabajado, y si no semostrará lo que el error era. La descargar línea es asegurarse de que usted no estáleyendo el valor previamente almacenado en caché. Si se trata de un valor que sólo secambian con poca frecuencia, como con el precio de cierre de una acción,que generalmente se desactive sólo la versión en caché cuando es probable que hayancambiado. Al día siguiente mercado financiero en este caso.

Page 152: Live code manual Español

Using Remote Data and Media

[ 106 ]

Publicación de datos puede trabajar de la misma manera. Un juego que envía tu puntuación alservidor podría hacerlo de esta manera:

el nombre de usuario sendscore, la puntuación

poner url "http://www.mysite.com/hiscores/savescore.php?user = " Ynombre de usuario y "& valor =" &

partitura en errar si se equivocan

no es "ok" y luego responder a

errar

terminar sendscore

Si el nombre de usuario o cualquier otra parte que los datos sean enviados contieneespacios en blanco que usted quiere URLEncode la primera ubicación. Si lo hace,convertir los espacios y otros caracteres especiales en los códigos que seguramentellegarán a la URL de destino. Esta sería una variante más segura:

el nombre de usuario sendscore, la puntuación

poner "http://www.mysite.com/hiscores/savescore.php?user = "&nombre de usuario y "& valor =" & partitura en

tPostAddress poner URLEncode url

(tPostAddress) a errar

si se equivocan no es "ok" y

conteste errar sendscore final

Leer y escribir en un archivo de textoEn los días de HyperCard la única opción real para guardar y cargar datos externos eraescribir un archivo de texto. LiveCode puede, por supuesto, lo que también, y en algunoscasos puede ser la solución más sencilla. Los archivos de configuración y las preferencias sonun par de buenos ejemplos donde puede ser un pequeño archivo de texto se utilizan paraconfigurar la aplicación en la forma en que el usuario desea que sea.

A modo de ejemplo, digamos que tenemos los archivos de configuración de texto,llamado englishstrings.txt y frenchstrings.txt, que se incluyeron en la listaCopiar archivos de la aplicación autónoma de diálogo Configuración, y que van a utilizarpara establecer si los nombres de los botones están en Inglés o Francés en la aplicación.También querrá escribir un archivo de preferencias de recordar la elección del usuario.Cuando la aplicación se abre nos echaría un vistazo para ver lo que el archivo depreferencias dice, y luego cargar el archivo de cadenas apropiado.

Con los sistemas operativos móviles iOS, y, en particular, hayreglas estrictas acerca de dónde se le permite guardar losdatos. A medida que avanzamos vamos a utilizar ubicacionesque están aprobados para tal uso por parte de Apple y Google.

Page 153: Live code manual Español

Chapter 4

[ 107 ]

Los archivos de texto que se incluyen en una aplicación móvil estará en la misma ubicación que la aplicación en sí, y losarchivos de texto que desea escribir debe estar en eldocumentos carpeta de su aplicación. Debido a que loscaminos pueden parecer muy diferentes en iOS y Android, debemos utilizar los LiveCodespecialFolderPath función para localizar estas carpetas. Así es como un OpenStackmanejador echaría un vistazo para ver si las preferencias se han fijado, y si no, llevar al usuarioa una pantalla de idioma de elección inicial:

en OpenStack

langstrings globales

poner "file:" & specialFolderPath ("documentos") & "/ prefs.txt"en prefsfile

poner prefsfile url en prefstext

prefstext si está vacío,

- Prefs nunca se han establecido, por lo que ir a la opción de

idioma tarjeta go "elección de la lengua" tarjeta

más

- Lenguaje ya ha sido elegido, por lo que cargar hasta el derechoexpediente

poner "file:" & specialFolderPath ("motor") & prefstext y

"Strings.txt" en langfile

poner fin a langfile url

langstrings si

final OpenStack

La ruta de motor carpeta especial es la misma ubicación que el archivo de laaplicación, así como los archivos de soporte que ha incluido en la sección Copiararchivos de la aplicación autónoma de diálogo Configuración (según se describe en eltema Copiar archivos en el capítulo 7), al guardar el autónomo aplicación. En elejemplo anterior habría archivos denominados englishstrings.txt,frenchstrings.txt, spanishstrings.txt, y así sucesivamente. Esta línea:

poner "file:" & specialFolderPath ("motor") & prefstext &"strings.txt" en langfile

se concatena la ruta donde los archivos incluidos se encuentran, el idioma que desea utilizar(almacenado en la variable prefstext), y el final de los nombres de archivo. Esto le darála ruta completa al archivo de idioma cadenas de texto que coincida con el idiomaseleccionado.

Page 154: Live code manual Español

Using Remote Data and Media

[ 108 ]

Usando otra pila para almacenar datosLo ideal sería que usted acaba de guardarse los cambios en la pila que se encuentre en esemomento, salvo que iOSno permite guardar en el directorio de la aplicación. Tenemos que evitar que, porguardar una pila en la carpeta de documentos. La pila para salvar o bien puede ser el que esnuestropila de aplicaciones, o simplemente podría ser utilizado exclusivamente para el almacenamientode datos. Guardar datos en una pilapuede ser más conveniente que guardar en archivos de texto. Por ejemplo, usted puede tener variastextocampos que están allí sólo para almacenar bits de información que serán necesarias la próximavez que elaplicación se ejecuta. Si estaba utilizando archivos de texto que o bien se necesita un montón deellos, o usted tendrá queprocesar el texto de un archivo único con el fin de extraer los bits individuales de información.

Es posible probar los datos de ahorro en pilas sin hacer una aplicación móvil, para ver sifunciona la técnica de base, y luego después probarlo en un dispositivo real. Una ventajapara probarlo en el primer equipo es que se puede navegar a la carpeta de documentos, conel fin de ver la magia que sucede!

Tiempo de acción - la creación de una base de datos guardar pilaVamos a estar haciendo una copia de una pila, pero sólo si una copia de la pila no existe ya.LiveCode tiene un buen "si hay una ..." función, que fue hecho para momentos como este!

En primer lugar vamos a crear las pilas de datos que necesitamos.

1. Iniciar un nuevo Mainstack, con un nombre de LaunchStack. Guárdelo en unlugar distinto carpeta de su ordenador documentos.

2. Inicie otra Mainstack nuevo, con un nombre de AppStack. Guárdelo juntoa la primera pila.

3. Coloca algo en la tarjeta de cada pila, por lo que es fácil reconocer cuando estás enesa pila. Por ejemplo, arrastre un botón en la tarjeta de la LaunchStack y elnombre de pila de una manera que hace que sea muy fácil saber dónde seencuentra. Hacer lo mismo para la AppStack apilar.

4. Ponga esta OpenStack controlador en el guión de pila LaunchStack:en OpenStack

establecer el defaultFolder a specialFolderPath("Documentos")

si no hay un archivo "AppStack.livecode" luego

Page 155: Live code manual Español

Chapter 4

[ 109 ]

poner el nombre de esta pila en el archivo

maestro establecido itemdelimiter a "/"

poner "AppStack.livecode" en el último elemento de masterfile

- Poner specialFolderPath ("motor") & "AppStack.livecode/" en masterfile

poner specialFolderPath ("Documentos") & "/AppStack.livecode" en appfile

Page 156: Live code manual Español

Using Remote Data and Media

[ 110 ]

poner URL ("binfile:" & masterfile) en la dirección URL("binfile:" &

appfile)

End If

ir apilar specialFolderPath ("Documentos") & "/

AppStack.livecode" responder el nombre de esta pila

final OpenStack

5. Guarde ambos pilas y dejar de LiveCode.

Antes de tratar las pilas en un dispositivo o en el simulador, los vamos a tratar como pilas deescritorio.

1. Busque en su Documentos carpeta, y no debería ser una AppStack.livecodepresentar en el momento.

2. Inicie LiveCode haciendo doble clic en el LaunchStack.livecode archivo. Siusted encuentra que LiveCode no se inicia este camino, asegúrese de que haasociado . Livecode documentos para ser abierto por LiveCode.

3. Busque en su Documentos carpeta, y ahora debería ser una AppStack.livecodearchivo, con un tiempo de creación que coincide con la hora actual.

4. También debe ver que el camino hacia la AppStack es precisamente en suDocumentos carpeta.

Ahora a probarlo en un dispositivo móvil, o utilizando el simulador de iOS.

1. Cierre la pila AppStack y descomentar la línea specialFolderPath poner ... a partirde la secuencia de comandos de pila LaunchStack que ha introducido en el paso4.

2. Ir a Ajustes aplicación independiente, y elija la sección Copiar archivos.

3. Haga clic en Agregar archivo ... y localizar y añadir el original AppStack.livecodepila (no el que se creó con la prueba anterior).

4. Elija la sección Android o iOS de los ajustes de aplicación independiente, ymarque la casilla para crear la aplicación para esa plataforma.

5. En el menú Desarrollo, seleccione su destino de la prueba. Eso sería ser uno de lossimuladores de iOS si elige iOS, o un dispositivo conectado Android.

Page 157: Live code manual Español

Chapter 4

[ 111 ]

6. Seleccione Prueba en el menú Desarrollo. Usted debe terminar con su actuaciónAppStack, y un diálogo de alerta que muestra la ruta de acceso a la pila. La capturade pantalla siguiente muestra el cuadro de diálogo resultante en la ventanaSimulador de iOS y Android en una tableta 4:

¿Qué ha pasado?Hemos creado nuestra aplicación para copiar la pila principal de la aplicación en el área dedocumentos en el dispositivo, por lo que vamos a ser capaces de hacer cambios y guardar aquelloséxito. Si le pasó a probar en iOS y Android habrán visto que buscan caminos muy diferentes para lapila. LiveCode se encarga de encontrar las carpetas especiales para nosotros.

Pop quiz - otros lugares especiales1.See si usted acaba de saber esto, o utilizar esta cuestión como una excusa para leer el

notas de la versión y el diccionario! ¿Cuál de estos NO es unspecialFolderPath tipo?

a.Users b.

Casa

c.Desktop d.

0x000e

Page 158: Live code manual Español

Using Remote Data and Media

[ 112 ]

Creación de una web "raspador" de la aplicaciónComo excusa para probar varios controles móviles nativas, vamos a hacer una aplicación quepueda leer las páginas web y extraer enlaces a los distintos medios de comunicación en lapágina. La aplicación tendrá una tarjeta que muestra un navegador web, tarjetas paramostrar los enlaces, texto y multimedia desde la página web, y un juego de tarjetas pararecordar los elementos seleccionados.

Tiempo de acción - la creación de navegación por pestañasAntes de entrar en la fabricación de la tarjeta del navegador, es necesario establecer loselementos que se comparten entre todas las cartas en la aplicación.

1. Crear un nuevo Mainstack, establezca su nombre por el de WebScraper, y guardarlo enalgún lugar.

2. Usaremos MobGUI de nuevo, para hacer la vida más fácil. Seleccione revMobGUI de laDesarrollo / Plugins submenú.

3. En estas instrucciones usaremos iPhone, retrato, pero no dude en utilizar el iPad oAndroid para un tamaño de la tarjeta. Seleccione iPhone y Retrato en la ventanaMobGUI, o sus opciones preferidas.

4. Desactive la casilla de la barra de estado.

5. Al igual que hizo en el momento de actuar - utilizando MobGUI recordar diseñospara nosotros desde el capítulo 3, la creación de interfaces de usuario Utilice lasherramientas MobGUI agregar una barra de navegación (que se ajusta a la partesuperior de la ventana de la tarjeta), un BG para establecer el buen patrón defondo y una TabBar, que se ajustará a la parte inferior de la ventana de la tarjeta.

6. Haga clic en el botón de control de ficha en la ventana MobGUI y seleccione 5 en elmenú desplegable. Arrastre los cinco botones en la tarjeta.

7. Opción / Alt + doble clic en uno de los cinco botones para hacer que se extendió através de la ventana de la tarjeta, y empujar hacia arriba o hacia abajo paradescansar centrado en la barra de pestañas.

8. Dar los cinco botones de los nombres BrowserButton, Links,Texto, Medios de comunicación, y Keepers.

8. Edite el script de cada botón, y en el Touchstart controlador, agregue unpasar Touchstart línea, para dejar el controlador con este aspecto:en Touchstart PID

mobGUITouch el identificador

largo de pasarme Touchstart

Page 159: Live code manual Español

Chapter 4

[ 113 ]

final Touchstart

9. Establezca el nombre de la barra de navegación a NavBar.

Page 160: Live code manual Español

Using Remote Data and Media

[ 114 ]

10. En el menú Edición, Seleccionar todo, y el grupo seleccionado en el menú Objeto.

11. Edite el script del grupo que acaba de formarse y entrar en este script:en Touchstart

poner el uTabText de mí en tTabText

establecer el utext del grupo "NavBar" para

ir tTabText tarjeta tTabText

init

final Touchstart

12. Seleccione el grupo y en el Inspector LiveCode objeto regular los ajustes básicosdarle un nombre al grupo de Común, y comprobar el comporta como un botónde fondo.

13. Establezca el nombre de la tarjeta para el explorador.

14. En la ventana MobGUI, haga clic en el código preOpenCard botón Añadir a tarjeta guión.

15. Hacer una nueva tarjeta, el nombre Links, y haga clic en el botón Añadir preOpenCardnuevo.

16. Haga lo mismo con otras tres cartas, para ser nombrado Texto, Medios de

comunicación, y Keepers.

17. Ir a Ajustes aplicación independiente, elegir iOS o Android como la plataformaque desee utilizar, seleccione el destino adecuado en el menú Desarrollo,y hacer una prueba.

18. Haga clic o toque en los botones de ficha cinco, y usted debería ver el nombre delcambio NavBar, y el botón de pestaña seleccionada debe ser el que hasseleccionado.

¿Qué ha pasado?En el nombramiento de los botones y las tarjetas de la misma, hemos sido capaces de ir a lascinco cartas utilizando el script asociado al grupo. Además, se emplearon el MobGUIuTabText y utext propiedades para establecer el nombre de la barra de navegación paraque coincida con el nombre de la tarjeta que había saltado al. La init línea entrará en supropio momento de escribir los guiones de la tarjeta.

Page 161: Live code manual Español

Chapter 4

[ 115 ]

La tarjeta BrowserAhora vamos a añadir algunos controles y secuencias de comandos a la primera tarjeta, para creareste navegador web mini:

LiveCode ha, en el momento de la escritura, ha actualizado para quelas características de Android acuerdo con las características de iOS.Desafortunadamente, MobGUI no ha sido actualizado en la mismaforma. El control del navegador nativo sólo funciona en iOS. Es deesperar que MobGUI se actualizará pronto!

El control del navegador nativo tiene muchas propiedades, acciones y mensajes asociadoscon ella, y usted debe leer las últimas notas del lanzamiento para ver la lista completa.Puede abrir tanto las notas de la versión para iOS y Android de las Notas de la versión enel menú Ayuda LiveCode. Para nuestra aplicación, sin embargo, sólo necesitaremos unospocos de sus habilidades.

Page 162: Live code manual Español

Using Remote Data and Media

[ 116 ]

Tiempo para la acción - añadiendo el navegador controlaVolver a la primera carta de la pila, y encontrar el camino a la parte control nativo de laMobGUI ventana.

1. Arrastre el control de explorador en la ventana de la tarjeta. Es el que tiene laimagen que muestra la página de búsqueda de Google.

2. Cambiar el tamaño del control para completar la anchura de la tarjeta, y su altura paraencajar entre la barra de pestañas y un poco por debajo de la barra de navegación.Dale el nombre Browser.

3. Con el control del navegador seleccionado, marque la casilla en la ventana tituladaMobGUI

Auto destruir en closeCard. Esto ayudará a reducir el uso de memoria de la aplicaciónfinal,durante las horas que no están en la tarjeta navegador.

4. Arrastre un control de texto nativo en el espacio entre el control del navegador y la barrade navegación.

Nombre que url, y cambiar su tamaño para ser casi tan ancho como la tarjeta, dejandoespacio para un Gobotón de la derecha.

5. Arrastre un control Button en ese espacio, establezca su etiqueta Ve, y cambiar sutamaño para verte bien.

Puede Opción / Alt + doble clic para que él mismo espacio una distancia estándar de laderecha de la ventana de la tarjeta.

6. Edite el script del botón Go (que, como usted puede notar es en realidad un grupo), yañadir un par de líneas antes del final de la Touchstart controlador, así:- Las demás líneas están aquí

establecer el uURL de grupo "Browser" para el grupo de

utext "url" se centran en nada

final touchEnd

7. Más adelante les estaremos enviando un init mensaje a las tarjetas. Para latarjeta Browser podemos usar eso como una manera de restaurar la página webpreviamente elegido:en init

mundial gPageURL

gPageURL si no está vacío,

establecer el uURL de grupo "Browser" paragPageURL

más

Page 163: Live code manual Español

Chapter 4

[ 117 ]

establecer el uURL de grupo "Browser" a

"http://www.google.com/" End If

terminar init

8. Edite la secuencia de comandos de control del explorador. Vamos autilizar el browserFinishedLoading mensaje para saber cuándohay que actualizar algunas variables y texto URL.

Page 164: Live code manual Español

Using Remote Data and Media

[ 118 ]

9. Añadir este controlador a la base de la escritura del control del navegador:en browserFinishedLoading puntilla,

pType mundial gPageURL, gPageHTML

poner la puntilla en gPageURL

poner la puntilla url en gPageHTML

establecer el utext de grupo "url" para PURL

terminar browserFinishedLoading

10. ¿Es un ahorro, y otro ensayo, para ver la tarjeta de navegador en acción.

¿Qué ha pasado?Ajuste de la uURL del control del explorador a la utext del control de texto fuesuficiente para que la función de navegador, pero algunos de lo que se hizo fuesimplemente en preparación para lo quevamos a necesitar en las otras tarjetas. En particular, se utilizó el LiveCode ordinario ponerurl comando para guardar una copia de la página web código HTML en una variable global, yque será necesaria cuando empezamos a extraer enlaces y multimedia de la página.

La tarjeta de EnlacesLos enlaces, texto y tarjetas de medios se va a tomar la fuente de la página que sealmacena en la variable global gPageHTML, y extraer los fragmentos de interés de lamisma. ¿Cómo va a hacer eso?

Un enfoque común al extraer un patrón conocido de texto es utilizar expresionesregulares, a menudo referido como regex o regexp. En su forma más simple, es fácil deentender, pero puede llegar a ser muy compleja. Lea el artículo de Wikipedia si quierescomprendy en profundidad:

http://en.wikipedia.org/wiki/Regular_expression

Otra fuente útil de información es este artículo en el correo ordinario PacktXpressions:

http://www.packtpub.com/article/regular-expressions-python-26-text-

transformación

Un problema sin embargo es que el uso de expresiones regulares para analizar elcontenido HTML está mal visto. Hay decenas de artículos en línea que le dice francamenteno para analizar HTML con expresiones regulares! Aquí está un ejemplo conciso:

http://boingboing.net/2011/11/24/why-you-shouldnt-parse-html.html

Ahora, el análisis de código fuente HTML es exactamente lo que quiero hacer aquí, y unasolución al problema consiste en mezclar y combinar, mediante otro texto LiveCode dejuego y capacidades de filtrado que hacer la mayoría del trabajo. Aunque no es

Page 165: Live code manual Español

Chapter 4

[ 119 ]

exactamente regexp, LiveCode puede utilizar expresiones regulares en parte de su juego yfunciones de filtrado, y son un poco más fácil de entender que toda regla regexp. Por lotanto, vamos a empezar con los ...

Page 166: Live code manual Español

Using Remote Data and Media

[ 120 ]

En la búsqueda de vínculos haremos la suposición de que el enlace está dentro de un a

href etiqueta, pero aún así hay una gran cantidad de variaciones de la forma en que puedenaparecer. La estructura general de una etiqueta href es la siguiente:

<a Enlace href="http://www.runrev.com/support/forum/"> texto que elusuario verá </ a>

En el texto de la página web será el texto Vínculo frase que el usuario verá. Si el usuariocoloca el cursor sobre el texto, el cursor cambiará a un cursor dedo señalador. Cuando eltexto se hace clic en el vínculo, la página volverá a cargar con la URL que aparece en la hrefparte de la etiqueta.

El ejemplo anterior muestra la ruta completa al foro de soporte. Estas son algunas de lasformas en que la localización de la tela misma podría ser written un enlace en la página:

http://www.runrev.com/support/forum/

/ Support / forum /

support / forum /

.. / Support / forum /

El primero te lleva allí no importa donde se encuentre en ese momento. El segundo te llevaallí si estás en algún otro lugar en el sitio runrev.com. El tercero será correcto mientras seencuentra en el nivel raíz de runrev.com, y el último ejemplo sería trabajar desde dentro deuno de los directorios de nivel de otros tubérculos en el sitio.

Con regex puede crear una expresión extravagante que se ocupa de todas las variacionesposibles de cómo los vínculos se encuentran en el origen de la página, pero aún así no nosdaría las rutas completas que necesitamos.

Toma las cosas con calma, podemos reducir la fuente de la página entera a un conjunto de líneas deahref entradas, y se extrae el URL de cada línea, y finalmente tomar las variacionesanteriores y convertirlos en direcciones URL de ruta completo.

Tiempo para la acción - hacer una función de extracción de enlacesA veces es muy útil para crear pruebas en una pila por separado, y luego copiar lafunción que usted ha hecho en su pila de aplicaciones.

1. Crear un nuevo Mainstack. Guárdalo, sólo para estar seguro!

2. Añade un par de campos y un botón.

Page 167: Live code manual Español

Chapter 4

[ 121 ]

3. Establecer guión del botón a la siguiente:en mouseUp

poner url "http://www.runrev.com/" en el

campo 1 getLinks put (campo 1) en el campo 2

final mouseUp

4. Edite el script de pila, y crear una función para getLinks. Comience con lo queacaban de volver lo que se enviarán:función getLinks pPageSource

retorno pPageSource

getLinks finales

5. Si se va a tratar de hacer clic en el botón en este punto, verá que la fuente detoda la página aparece en el campo 2.

6. Vamos a utilizar la función de filtro, y eso necesita que el texto sea en líneas separadas.Así que queremos que cada eslabón de estar en una línea propia. La función replacepuede hacer esomuy bien. Añadir estas dos líneas al script (antes de la volver línea, por supuesto):

sustituir "/ a>" por "/> A" y de retorno en pPageSource

reemplazar "<a" con retorno & "<a" en pPageSource

7. Intente hacer clic en el botón. Los dos campos se verá mucho el mismo, pero las líneas que tienenun vínculo en ellos estarán en una línea propia.

8. Añada una línea para filtrar la lista tal como está, para reducirlo a sólo losque tienen vínculos en ellos:

filtro pPageSource con "* a href * / a>"

9. El "*" caracteres son caracteres comodín, por lo que la lista se reducen a líneas quecontienen tanto a href y / A>. Pruebe el botón de nuevo.

10. Ahora verás que hay líneas sólo con los enlaces en ellos, pero todavía incluyen labasura a ambos lados del mismo enlace. Lo que necesitamos es entre las comillasprimero y segundo, y el uso de la itemdelimiter podemos llegar a esa parte. Añadalas siguientes líneas:establecer el itemdelimiter citar

repetir con a = 1 para el número de líneas en

pPageSource ponen elemento 2 de línea de una de

pPageSource en línea de unpPageSource

Fin de repetición

11. Si ahora hace clic en el botón que debe obtener una lista de sólo la parte URL de

Page 168: Live code manual Español

Using Remote Data and Media

[ 122 ]

cada línea. Pero nótese que la mayor parte de los enlaces de comenzar con /, y nohttp.

Page 169: Live code manual Español

Chapter 4

[ 123 ]

12. Realizar una nueva función en el script de pila que va a cambiar los enlaces para ser laruta completa:

función getPath pPageURL, pLinkURL

final getPath

13. Ahora añadir el código necesario para hacer frente a las variaciones de URL,comenzando con el caso en que se trata de una ruta completa:

si pLinkURL contiene ":/ /" y

luego volver pLinkURL

End If

14. Si usted recuerda, antes nos salvó la URL de la página principal en unavariable global, gPageURL. Para el caso en que el vínculo es relativo root(que comienza con "/") queremos combinar la ubicación de host y la URLdel enlace:

establecer el itemdelimiter a "/"

si char 1 de pLinkURL es "/" y luego

volver temas de 1 a 3 de pPageURL y pLinkURL

más

15. Cuando ese primer carácter no es "/", puede comenzar con ".. /" para aumentar unnivel en la estructura de directorios. Borrado de la última parte de la URL de lapágina que nos dará lo que necesitamos para combinar con la URL del enlace:si char 1 a 3 de pLinkURL es ".. /" y

luego borrar el último elemento de

pPageURL borrar el último elemento

de pPageURL delete char 1 a 2 de

retorno pLinkURL pPageURL y

pLinkURL

más

16. En los demás casos se combina la URL de la página y la URL del enlace:eliminar el último elemento de pPageURL

volver pPageURL & "/" & pLinkURL

End If

End If

17. Por último, si todos esos cheques no nos devolverá una cadena vacía, por lo queesta dirección URL extraño vínculo estructurado no se enciende para confundirnosmás tarde:

volver ""

getPath

final

Page 170: Live code manual Español

Using Remote Data and Media

[ 124 ]

18. Para obtener elgetLinks funcionar para utilizar el getPath función quenecesitamos para realizar un cambio en la secuencia de comandos se muestraen el paso 10:repetir con a = 1 para el número de líneas en pPageSource

poner getPath (gPageURL, punto 2 de la línea A depPageSource) en una línea de pPageSource

Fin de repetición

¿Qué ha pasado?En las etapas que hemos desarrollado una función que puede encontrar los enlacesen el texto fuente de una página web, terminando con un conjunto de direccionesURL de ruta completo que podemos presentar al usuario.

Los eslabones perdidosLa pieza que faltaba en la pila de prueba es la variable global que almacena laURL de la página. En el caso de la pila de aplicación, ese valor es proporcionadopor el navegador del control de browserFinishedLoading función, peroaquí tenemos que enchufar un valor para fines de prueba.

Coloque una línea de declaración mundial en el guión botón y en el guión de la pila. En elguión botón, llene la variable con valor nuestro caso de prueba. La secuencia de comandosse verá así:

mundial gPageURL

en mouseUp

poner "http://www.runrev.com/" en gPageURL

poner gPageURL URL en el campo 1

poner getLinks (campo 1) en la

final mouseUp campo 2

Si trata del botón, verá una lista de 12 URLs ruta completa en el segundo campo. Sifunciona correctamente, copie las dos funciones de la pila y la línea de declaración global,y pegarlas en el script de pila de la pila WebScraper.

Una cosa más ...La secuencia de comandos barra de pestañas incluyó una línea init. Que se ponen en lasecuencia de comandos de tarjeta, en este caso, laEnlaces escritura de la tarjeta. Pero eso todavía no existe! Vamos a hacer.

Tiempo de acción - la adición de la tarjeta de Enlaces "init" handlerAntes de continuar, asegúrese de que está satisfecho con las funciones de la pila de

Page 171: Live code manual Español

Chapter 4

[ 125 ]

prueba, y que los has copiado en el guión pila WebScraper.

1. Ir a la tarjeta de la pila Links WebScraper.

Page 172: Live code manual Español

Using Remote Data and Media

[ 126 ]

2. En la ventana MobGUI, haga clic en el botón Añadir preOpenCard guión.

3. Edite el script tarjeta y añadir estas variables globales y init función:gPageHTML mundial, gLinks

en initsi la plataforma es "iphone" o es la plataforma "android" y

luego poner getLinks (gPageHTML) en gLinkssi el número de líneas en gLinks = 0,

entonces contesta "No hay enlaces en estapágina!"

másmobilePick gLinks, 0si el resultado> 0 entonces

poner el resultado en tLinkLineponer línea tLinkLine de gLinks enTLINK tarjeta go "Browser"establecer el utext de grupo "url" para TLINKestablecer el utext del grupo "NavBar" a "Browser"establecer el uURL de grupo "Browser" para el grupo deutext

"Url"mobGUITouch el identificador largo de grupo

"BrowserButton" end ifEnd If

End IfEnd init

4. ¿Es una prueba de la aplicación.

5. En el simulador de iPhone o dispositivo Android, si eso es lo que está utilizando, Cambiarel

URL a http://www.runrev.com/, y seleccione el botón Go.

6. Cuando se carga la página, seleccione el botón ficha Vínculos.

7. Ahora debería estar buscando en la lista de 12 enlaces, sólo que esta vez se presentan en una listaselector nativo.

8. Seleccione el enlace de tercero en la lista y, a continuación, Hecho.

9. Usted debe ser llevado de vuelta a la tarjeta del navegador, con la página de Facebook de RunRev cargado.

¿Qué ha pasado?El guión tarjeta entramos hace el mismo trabajo que el botón de la pila de prueba, ya que lasllamadas a las funciones de la pila para obtener una lista de enlaces. En lugar de poner la listaen un campo llano, se utilizó LiveCode capacidad de abrir un control de selector nativo,

Page 173: Live code manual Español

Chapter 4

[ 127 ]

mediante el uso de la línea:

mobilePick gLinks, 0

Page 174: Live code manual Español

Using Remote Data and Media

[ 128 ]

Los parámetros necesarios de esa función es una lista de elementos que mostrar, y laposición de índice de la de seleccionar. Al participar en 0 no está en efecto no hay ningúnelemento seleccionado. El resultado que regresa del selector es la posición de índice delelemento seleccionado, y podemos usarlo para buscar la línea correspondiente en lavariable gLinks.

Las líneas restantes nos llevará de vuelta a la tarjeta del navegador, establecer ladirección URL a cargar, y también asegurarse de que el botón de tabulaciónBrowserButton está resaltado.

La tarjeta de TextoHacer el trabajo de la tarjeta texto será mucho más sencillo, pero incluirá una línearegular expresión increíblemente complejo, que figura en esta página web:

http://stackoverflow.com/questions/3951485/regex-extracting-readable-no-código-texto-y-urls-de-html-documentos

Tiempo de acción - la creación de la tarjeta de TextoComience en la pila de prueba que ha realizado, para que podamos tener la función detrabajar allí antes de añadir a la pila WebScraper.

1. Duplicar el botón que hizo al extraer enlaces. Cambiar la llamada a la funcióngetLinks decir getText - De lo contrario la secuencia de comandos puede seguirsiendo el mismo.

2. Edite el script de la pila de prueba y agregar esta función:función getText pPageSource

poner replaceText (pPageSource "(: <(P <tag> guión | estilo)[\ s \ S] * </ (P = tag)>) | (:?????! <- [\ s \ ? S] * ->) | (:?<[\ s \ S] *>) "," ") en pPageSource

Si reemplazar con "" en pPageSource

reemplazar con la ficha "" en

pPageSource retorno pPageSource

final getText

3. Intente hacer clic en el botón que acaba de hacer. Usted debe ver a su segundo campo llenansólo las partes del texto de la página web.

4. Copie la función y volver a la secuencia de comandos de pilaWebScraper. Pegue la función allí.

5. Ir a la tarjeta de texto de la pila, y desde la ventana MobGUI arrastrar un texto de líneasmúltiples

Page 175: Live code manual Español

Chapter 4

[ 129 ]

controlar en la tarjeta. Establezca su nombre por el de PageText.

6. Cambiar el tamaño del control para rellenar el área entre la barra de navegación y el TabBar.

Page 176: Live code manual Español

[ 130 ]

Chapter 4

7. En las propiedades de la ventana MobGUI para el control, desactive la casilla editable.

8. Edite el script de tarjetas, y añade este init función:mundial gPageHTML

en init

si la plataforma es "iphone" o la plataforma es "android",

entonces mobFieldSet "PageText", "texto", getText

(gPageHTML)

End If

End init

9. Intente una prueba de la aplicación.

10. En la tarjeta del navegador, cambiar la dirección URL de google.com para runrev.com ypulse Go.

11. Pulse el botón de tabulación del texto en la parte inferior.

12. Ahora debería estar en la tarjeta de texto, y viendo los elementos de texto de la página Web quese muestra en un campo de texto desplazable nativo.

¿Qué ha pasado?Esa expresión regular enormemente larga corriendo a través de la fuente de la página weby eliminar cualquier cosa que fuera guión, el estilo, o simplemente información de laetiqueta, dejando solo las partes del texto. Pero eso lo deja con un montón de personajesde repuesto de salto de línea y caracteres de tabulación, que nos fuimos a eliminar con lafunción replace LiveCode. El texto final no sea perfecto, pero puede utilizar las funcionesestándar de texto para móviles para copiar partes de él para su uso en otras aplicaciones.

La tarjeta de los medios de comunicaciónLa tarjeta de los medios de comunicación va a empezar muy parecido a la tarjeta de Links,con un "init" en función de la secuencia de comandos de tarjetas, y una función de pilascript para extraer los enlaces de medios de la página.

Tiempo para la acción - la extracción de una lista de enlaces demedios

Probablemente es una expresión regular que permita, mediante todos los "src" enlaces deuna página, pero estamos sólo interesados en cosas que sabemos LiveCode es capaz demostrar o jugar. Así que esta vez vamos a utilizar un camino más tortuoso para extraersólo los vínculos que pueden manejar.

Page 177: Live code manual Español

[ 131 ]

Using Remote Data and Media

1. Usted puede también dirigirse a la pila de prueba!

2. Hacer un tercer botón mediante la duplicación de una de las otras dos, y cambiar elgetLinks

o getText parte en el guión botón para llamar getMedia en su lugar.

Page 178: Live code manual Español

[ 132 ]

Chapter 4

3. En el guión de pila, escriba todo esto:mundialgPageURL

función getMedia pPageSource

poner ". jpg,. gif,. gif,. jpeg,. mov,. mp4, m4v,. mp3" en la

repetición tExtensions con a = 1 y el número de elementos en

tExtensions

poner un punto de tExtensions en tExtension

reemplazar tExtension con tExtension & "*" & retornoen pPageSource

Fin de repetición

repetir con a = el número de líneas en pPageSource hasta la

línea de Poner 1 a pPageSource en TLINE

si el último carácter del TLINE es

"*" y luego borrar el último

carácter del TLINE

poner removeLeaders (gPageURL, TLINE) en unalínea de pPageSource

más

eliminar una línea de final

si pPageSource

Fin de repetición

volver pPageSource

final getMedia

función removeLeaders pPageURL, pLinkURL

poner quote & "'()" en tDelimiters

repetir con a = 1 hasta el número de caracteres en

tDelimiters char a poner de tDelimiters en

tDelimiter

establecer el itemdelimiter a tDelimiter

poner el último elemento de pLinkURL en pLinkURL

Fin de repetición

volver getPath (pPageURL, pLinkURL)

removeLeadersfinales

4. Haga clic en el botón, y usted debería ver una lista de las rutas completas a lasdiversas imágenes de la página web.

¿Qué ha pasado?El enfoque tortuoso consistía en encontrar en cualquier lugar que cualquier medio decomunicación de interés fue mencionado y añadiendo un asterisco y carácter de retorno con

Page 179: Live code manual Español

[ 133 ]

Using Remote Data and Mediael fin de asegurarse de que el enlace se puede identificar fácilmente, y al final de una líneaúnica. Entonces cada una de estas líneas se envió a otra función, removeLeaders, paraeliminar cualquier otro texto que fue anteriormente en la línea de que el inicio del enlace.Finalmente, el mismo getPath función que usamos cuando los enlaces de extracción seutilizó para darnos rutas completas de los archivos multimedia.

Page 180: Live code manual Español

[ 134 ]

Chapter 4

Ahora que tenemos una lista de enlaces a medios tendremos que agregar los controladoresde nivel de tarjeta necesarios para presentar la lista al usuario, y para cargar su elementomultimedia seleccionado en la ventana de la tarjeta.

Tiempo de acción - la creación de los scripts de tarjetasmultimedia

Copie las funciones que demostraron a trabajar en el guión de pila de prueba, y pegarlos enWebScraper guión pila. Entonces ...

1. Ir a la tarjeta multimedia. Al igual que con la tarjeta de Enlaces no vamos a agregarcualquier control a la tarjeta, lo haremos con la escritura. Por lo tanto, modificar lasecuencia de comandos de la tarjeta.

2. Aquí está la carta Media init función, y se necesitan variables globales:gPageHTML mundial, gMediaList

en init

si la plataforma es "iphone" o es la plataforma "android" y

luego poner getMedia (gPageHTML) en gMediaList

si el número de líneas en gMediaList = 0,

entonces contesta "No hay ningún medio en

esta página!"

más

establecer el itemdelimiter

a "/" puesto vacío en

tMediaNames

repetir con a = 1 para el número de líneas en gMediaList

poner el último elemento de una línea de gMediaList

en línea de unde tMediaNames

Fin de repetición

mobilePick tMediaNames,

1 si el resultado> 0

entonces

poner el resultado en tMediaLine

showMedia línea tMediaLine de final si

gMediaList

End If

End If

terminar init

3. A diferencia de los enlaces, construimos una lista de sólo la parte del nombre dearchivo de la URL, para mostrar en un selector natural, y cuando se ha

Page 181: Live code manual Español

[ 135 ]

Using Remote Data and Mediaseleccionado algo que llamamos un showMedia función del guión pila.

4. Edite el script de pila.

Page 182: Live code manual Español

[ 136 ]

Chapter 4

5. Cree el showMedia función:en showMedia pMediaFile

si hay una imagen "mediaImage" y luego borrar la imagen"MediaImage"

establecer el itemdelimiter a "."

switch (el último elemento de pMediaFile)

caso "png"

caso "gif"

caso "jpg"

caso "jpeg"

nueva imagen

establecer el nombre de la imagen del número de imágenes que"MediaImage"

establecer el nombre del archivo de imagen

"mediaImage" para pMediaFile descanso

caso "mp4"

caso "m4v"

caso "mov"

caso "mp3"

establecer el showController del templatePlayer a

pMediaFile verdadero video del juego

rompe

r el

interruptor

final

final showMedia

6. Pruebala aplicación.

7. Usted puede comenzar con la página google.com, pulse el botón ficha Medios para ver una lista delas imágenes utilizadas en esa página.

8. Seleccione una imagen de la lista y pulse Hecho.

9. La imagen debe aparecer en la tarjeta.

10. Volver a la tarjeta del navegador, y Change la URL http://www.apple.com/.

11. Apple normalmente incluye algunos enlaces miniaturas de vídeo en la páginaprincipal. Pulse sobre uno de ellos, para que pueda ver el reproductor de vídeo degran tamaño. Pero no se juega!

Page 183: Live code manual Español

[ 137 ]

Using Remote Data and Media

12. Pulse el botón ficha Medios, para ver una lista de todos los medios de comunicación enesa página.

13. Desplácese hacia abajo en la lista, en busca de uno de los temas másmencionados, que parece que podría ser ese video.

14. Seleccione esa opción y pulse Hecho. El video debe cargar y reproducir en la tarjeta.

15. Utilice el botón Hecho el controlador de vídeo cuando haya terminado de ver elvideo, para volver a la tarjeta de memoria.

16. Puede presionar el botón de ficha Medios de nuevo para que vuelva a aparecer selector.

17. Volver a la tarjeta del navegador, e introduzca una URL que contiene ejemplos de MP3archivos.

http://www.ntonyx.com/mp3_songs.htm es un ejemplo deello.

18. Pulse el botón ficha Soportes para volver a la tarjeta de memoria, con la lista detodos los medios de comunicación en esa página, que en este caso seráprincipalmente archivos MP3.

19. Seleccione uno de los archivos MP3 de la lista, y pulse Hecho. El MP3 deben jugaren el mismo jugador que el vídeo que se reproduce in

¿Qué ha pasado?En este ejemplo hemos hecho uso de tanto un control LiveCode estándar, la imagen, ytambién un control nativo, el reproductor de vídeo. LiveCode se encarga de la puesta enmarcha del jugador, y conla muy sencillo jugar videoname vídeo sintaxis, hemos sido capaces de invocar eljugador nativo. Era capaz de reproducir tanto archivos de vídeo y audio.

Los encargados de la tarjetaEn realidad, va a ser las tarjetas Keepers. Se trata de ser un lugar que puede esconder losmedios de comunicación que le han resultado interesantes. Por razones de tamaño dearchivo que en realidad estamos sólo va a almacenar la URL a los medios de comunicación -después de todo, un vídeo de pronto usaría el almacenamiento de su dispositivo!

Page 184: Live code manual Español

[ 138 ]

Chapter 4

Time for Action - la creación de la tarjeta KeepersComo la tarjeta Keepers está en el extremo de la pila, puede llegar a ella, ya sea con Ver repetido/ IrPróximo acciones, o sólo una única vista / Ir última acción.

1. Ir a la tarjeta de Guardianes, y crear un botón para MobGUI Anterior,Siguiente y Play Media. Hacer que un campo LiveCode, y el nombremediaURL. Ahora debería tener algo parecido a esto:

2. Agregue estas líneas a la Touchstart manejador del botón Prev:si el nombre de esta tarjeta no es

"Guardianes" y luego ir anterior

End If

Page 185: Live code manual Español

[ 139 ]

Using Remote Data and Media

3. Agregue estas líneas a la Touchstart manejador del botón Siguiente:si el número de esta tarjeta <el número de tarjetas y

luego ir próximo

End If

4. Añada esta línea al diabólico botón Multimedia Touchstart handler:campo showMedia "mediaURL"

5. Seleccione los cuatro controles y agruparlos. Marque la casilla que dice comportarsecomo un

fondo. Asigne un nombre al grupo como keeperbuttons.

6. Edite el script del nuevo grupo. Añadir esta refrescar handler:el refresco

establecer el itemdelimiter a "."

si char 1 del último elemento de campo "mediaURL" es "m" y

luego muestra colectiva "Media Play"

más

esconder grupo "Media

Play" showMedia campo

"mediaURL"

End If

End

actualizaci

ón

7. Ahora tenemos que volver atrás y añadir algunas cosas a la tarjeta de memoria.

8. Vaya a la tarjeta de memoria, y agregue un botón MobGUI. Establezca elnombre y la etiqueta al Mantenga Media.

9. Un truco es que los medios de comunicación jugarán pantalla completa en pantallasmás pequeñas, y por el momento se ve la Torre del Homenaje botón Media el videoya ha desaparecido. Podemos resolver esto de guardar la URL de la última partidaque figure medios de comunicación en una variable global.

10. En el guión de tarjetas multimedia, modifique el init función para que las líneasposteriores leer:

si el resultado> 0 entonces

poner el resultado entMediaLine

poner tMediaLine línea de gMediaList en

gLastMedia showMedia gLastMedia

End If

Page 186: Live code manual Español

[ 140 ]

Chapter 4

11. Cambie la línea global de declaración de variables para incluir la gLastMedia variable.

Page 187: Live code manual Español

[ 141 ]

Using Remote Data and Media

12. Ajuste el Touchstart manejador de la Torre del Homenaje botón Multimedia para ser:en Touchstart PID

mundial

gLastMedia

mobGUITouch el identificador

largo de la última carta que

me vaya

si el campo "mediaURL" no está vacío,

la nueva tarjeta

End If

gLastMedia poner en el campo

"mediaURL" ahorrar pila

"WebScraper"

enviar "refresh" para agrupar

Touchstart fin "keeperbuttons"

13. Pruebala aplicación. Utilice la tarjeta de explorador para cargar una página con unmontón de imágenes, vídeos o sonidos en él, y vaya a la tarjeta de memoria paraver los listados.

14. Seleccione cualquier elemento, seguido de Hecho.

15. Si te gusta la imagen, sonido o video, use el botón Mantener Media para ir al finalde la URL de la pila para los medios de comunicación para ser salvos.

16. Elegir más bits de los medios de comunicación, y mantenerlos.

17. Vaya a la sección Keepers y utilizar los botones Siguiente y Anterior para navegar através de los elementos que mantienen.

18. Las imágenes deben aparecer de forma automática, y el vídeo y el audio sepuede iniciar con el botón de reproducción de medios.

¿Qué ha pasado?Hemos añadido la última característica de nuestra aplicación, un juego de cartas donde se puede ir aver los trozos de papel que se optó por conservar.

Tener un héroe go - agregar algunos lugares preestablecidosSi usted hace la aplicación WebScraper, y empezar a ser útil, es muy probable que habrá unconjunto de páginas web que se remontan a una y otra. Tener que escribir la dirección URLcada vez sería tedioso. Así que, ¿por qué no hacer un campo oculto en la tarjeta delnavegador, y escribauna lista de tus páginas favoritas. Agregar un botón a la tarjeta también, que se abrirá una

Page 188: Live code manual Español

[ 142 ]

Chapter 4lista de las páginas para que usted pueda elegir. El que usted elija puede cargar el controlde explorador con la página deseada. Todos los pasos para hacer esto se trata en lasección de tarjetas enlace de arriba.

Page 189: Live code manual Español

[ 143 ]

Using Remote Data and Media

¿Y ahora qué?Es muy cierto que si usted sigue cuidadosamente todos los pasos de este capítulo, y enefecto, que todos los pasos eran perfectos, todavía no se tiene una aplicación lista para serpresentada a las tiendas de aplicaciones! Debe haber una pantalla de bienvenida, menúprincipal y los iconos de los botones de ficha. Un poco de amor de un diseñador gráfico!Característica en cuanto a que sería bueno que las imágenes que mantienen podría hacerzoom y panorámicas.

ResumenAlgo de lo que hemos cubierto aquí es menos glamorosa, sobre todo acerca delprocesamiento de texto HTML, pero sí que también utilizan una serie de característicasmóviles, incluyendo:

Realización y control de un navegador web

El uso de un selector nativo para presentar listas

Creación de un campo de desplazamiento nativo, que tiene todas las capacidadesnormales del sistema operativo específicos

Reproducción de vídeo y audio con el reproductor multimedia nativo

El siguiente capítulo es casi en su totalidad sobre cómo tratar con los gráficos, así que nosaseguraremos de utilizar alguna imagen manipulando los gestos, y se podía volver a laaplicación WebScraper más tarde para agregar las mismas características que las tarjetasde Guardianes.

Page 190: Live code manual Español

[ 144 ]

Chapter 4

Page 191: Live code manual Español

5Realización de una aplicaciónJigsaw Puzzle

Imagínese esto ...Hasta ahora hemos estado tratando con una gran cantidad de texto o llamara funciones del sistema operativo móvil. Esas son cosas interesantes, pero noson tan visual. Si estaba deseando perder el tiempo con imágenes y datos deimagen, ha llegado tu hora!

LiveCode no es, naturalmente, una potencia de gráficos, y su modo de manejo de datos deimagen (a menudo denominado como "datos de mapa de bits" por otras herramientas) es algoinusual, en que se almacena con eficacia los píxeles de una imagen como una serie decaracteres de un solo byte para representar los valores de rojo, verde y azul de cada píxel. Lamanipulación de una imagen final es bastante flexible, pero con el fin de crear algo en la líneade un rompecabezas que tenemos que entender el formato de datos de imágenes.

En este capítulo se incluirán los siguientes puntos:

Examinar la forma en que almacena los datos de mapa de bits LiveCode en un objeto deimagen

Encontrar una manera de utilizar un único mapa de bits en lugar de 50 botones

Hacer un mapa de detección de colisiones

Crear una aplicación de rompecabezas que se aprovecha de algunas funciones deldispositivo móvil

Page 192: Live code manual Español

Making a Jigsaw Puzzle Application

[ 132 ]

Datos Formato de la imagenEn otras herramientas de autoría, como Adobe Director y Flash de Adobe, los datos de mapa debits se almacena como una matriz de 24 - o los valores de 32-bit. Si quieres saber el color delpíxel 20 desde el borde de la izquierda, en la fila 15a de la parte superior de la imagen, se utilizaun getPixel función con esos números enchufado En Flash, que utiliza un punto cero departida de todos sus tipos de variables, se podría decir:

pixelcolor bitmapvariable.getPixel = (19,14);

Se podría, de hecho, comenzar esa línea convar pixelcolor: uint, pero aquí estamos viendolas principales diferencias, y no las rarezas de tener un lenguaje de programaciónfuertemente tipado! En Director, que, al igual LiveCode, utiliza variables basadas en 1, debedecir:

pixelcolor imagevariable.getPixel = (20,15)

Una vez más no hay necesidad de escribir variable, o incluso un punto y coma al final de lalínea. A pesar de que una digresión, Flash también no necesita el punto y coma al final, por lomenos, usted no tiene que escribirla usted mismo. Flash sabía lo que quería decir! Volviendoal punto ...

En LiveCode cada píxel de una imagen es representada por cuatro bytes, que tiene accesocomo si fueran un solo byte. El rango de valores de un byte es de 0-255, y almacenar dichosvalores, especialmente el valor "0", en variables de carácter no funciona bien. Por lo tanto,es necesario convertir el valor de carácter en un valor numérico antes de hacer uso de ella.El problema básico es que aunque el valor numérico se almacena en una variable, cuandose llega a hacer cálculos sobre el mismo LiveCode querrá trabajar en aritmética de base 10,y no en la forma binaria dentro de la variable. Usted tiene que convertir la variable en algoque se puede procesar, mediante el charToNum función.

Así que ¿por qué no una variable de caracteres como ceros, usted pregunta!Pues bien, en los primeros días de las computadoras personales del lenguajede programación predominante fue Pascal. En Pascal una variable quecontiene una cadena literal necesitaba tener una manera de saber cuántotiempo la cadena era. El primer byte de una cadena Pascal almacena lalongitud de la cadena, que estaba bien, hasta 255 caracteres, y en esos díasSe creía más probable de como tanto como cualquiera necesitaría siempre!En la vida real, sin embargo, las cadenas pueden ser de más de 255caracteres. Este apartado sólo es más de 900 caracteres de longitud. Parasolucionar este problema el lenguaje de programación C utiliza un cero paraindicar el final de una cadena. Usted podría tener un millón de caracteres enuna fila, sin embargo, sólo el último sería un cero. Valores RGB no sepreocupan por las limitaciones de cadenas de C, y hay ceros en todo el lugar,que es por eso que lo convierte en un valor numérico, tan pronto como nossea posible.

Page 193: Live code manual Español

Chapter 5

[ 133 ]

Además de la singularidad de cada píxel se almacena como cuatro bytes de información,tampoco hay sentido de filas y columnas. Todos los píxeles de una imagen tiene su fin cuatrobytes para terminar, hay que hacer un cálculo para saber en qué parte de los datos del píxelque está buscando se encuentra. Si se tiene en cuenta cómo se trabaja en un editor de mapade bits, por ejemplo Photoshop o Gimp, selecciona las cosas basado en un X y un valor Y, loque corresponde a la columna y la fila donde se encuentra el píxel de la imagen. LiveCode nole permite acceder a mapas de bits en esa forma. De ahí la necesidad de hacer un cálculo.

Así es como el píxel ejemplo anterior puede ser recuperada en LiveCode, si lo quería comoun 24 - bit de valor:

poner getPixel ("imagen de prueba", 20,15) en pixelcolor

función getPixel PImage, px, py

poner la imagen de imageData del PImage en

tImageData poner el ancho de la imagen en PImage

tWidth

poner ((pY-1) * tWidth + (pX-1)) * 4 en tStartChar

poner charToNum (char tStartChar 2 de tImageData) en

charToNum Tred poner (char 3 tStartChar de tImageData) en

tGreen poner charToNum (char tStartChar 4 de tImageData)

en cambio tBlue Tred * 65536 + tGreen * 256 + tBlue

final getPixel

En la cara de ella, éste es uno de los pocos casos en que el camino se hace en LiveCode esconsiderablemente más largo que en otros idiomas. Sin embargo, muy a menudo querealmente necesita los valores de rojo, verde y azul del pixel, y en los demás idiomas queusted tiene que tomar medidas adicionales para extraer esos valores.

Los pasos adicionales necesarios para que el número devuelto es un valor de 24-bit RGB noson gran cosa, ya que LiveCode se extiende fácilmente por sus propias funciones. Si ustednecesita el valor de 24 bits, utilice la función anterior y se le ha añadido un getPixel

funcionar a la lengua LiveCode. Usted todavía tiene que hacer los cálculos para obtener sóloel valor de rojo. Tal vez algún día LiveCode han construido en getPixel función quefunciona más rápido que su propia función. El número de 24-bit regresó aquí es en realidadrepresentan con tres cifras decimales, no como un24-bit valor binario, pero todavía se conoce generalmente como "bit 24".

Misterio byte ...El primer carácter de los cuatro, que representa un píxel, no se utiliza. RunRev.com tienetutoriales sobre cómo usar imageData del, y hay que byte se conoce como Alpha. Eso tienesentido, incluso las otras herramientas que le puede dar un número de 32 bits tendrá elvalor dividen en alfa, rojo, verde y azul. ¿Por qué ese byte, que se llama Alfa RunRev,contiene el valor alfa? ¡Quién sabe!

Page 194: Live code manual Español

Making a Jigsaw Puzzle Application

[ 134 ]

Una posibilidad es que el valor no sirven bien a su propósito suficiente. Cuando se habla detransparencia alfa a veces significa que sea transparente, como podría ser el caso en unaimagen GIF. Otras veces puede significar translúcido, donde es parcialmente transparente.

Para resolver la ambigüedad de este problema, LiveCode tiene otras dos propiedades de una imagen,maskData y alphaData:

poner el maskData de "imagen de prueba" de la imagen en

tMaskData poner el alphaData de imagen "la imagen de

prueba" en tAlphaData

Estas propiedades de la imagen todavía tiene toda la final filas a fin, y usted todavía tieneque hacer el cálculo para encontrar donde el valor de un píxel dado alfa se almacena.

Con maskData se obtiene un conjunto de valores para cada uno de los píxeles. Para cualquiervalor distinto de 0, el píxel es visible.

Con alphaData se obtiene un conjunto de valores que representan la opacidad de lospíxeles. 0 sería totalmente transparente, 255 sería totalmente opaco, y los valoresintermedios será translúcido. 128 sería de 50% de opacidad.

Más adelante en este capítulo vamos a estar haciendo uso tanto de maskData yalphaData, y nos referiremos a la 0-255 alphaData valor como su transparencia, y el ceroo distinto de cero maskData valor como su máscara.

El mal uso imageData del!Los temas de los tutoriales en línea LiveCode implican la manipulación de la imageData del,por ejemplo, convertir una imagen en color en una escala de grises de una. (Este ejemploen particular se encuentra en:http://lessons.runrev.com/s/lessons/m/4071/l/25371-vision-how-do- i-

convertir-a-color-imagen a escala de grises.) No vamos a hacer eso aquí. Ensu lugar,usaremos los valores de la imagen, la máscara, y alfa, para lograr algunas cosas interesantesque no cambian la imagen en absoluto. De hecho, en algunos casos, ni siquiera se ve laimagen!

Tiempo para la acción - probando una función getPixelAntes de llegar a ejemplos útiles, vamos a hacer un getPixel función, y un caso de pruebarápida.

1. Hacer una Mainstack nuevo. Guárdelo como ImageDataTests.

Page 195: Live code manual Español

Chapter 5

[ 135 ]

Usaremos la misma pila para ilustrar varias cosas, y al final podemosatrevernos a probar en un dispositivo móvil!

Page 196: Live code manual Español

Making a Jigsaw Puzzle Application

[ 136 ]

2. Hacer la pila del tamaño de su dispositivo más grande prueba. O simplementetratar de 1024x768 si vamos a usar el simulador de iPad.

3. En el menú Archivo, seleccione Importar como Control / Image y seleccionarcualquier archivo de imagen pequeña que tiene, para colocarlo en la esquina dellado superior izquierdo de la ventana de la tarjeta. El ejemplo que se muestra acontinuación utiliza una imagen de logotipo LiveCode.

4. Coloque un objeto gráfico nuevo al lado de la imagen. Va a estar mostrando un solocolor, por lo que sólo hacen lo suficientemente grande para ver fácilmente el color.Nombre que muestra.

5. Gráficos tienen un valor por defecto configurado para mostrar un cuadro vacío, porlo que escribir esto en el cuadro de mensaje para que se llenará en:establecer el relleno de un gráfico en true

6. Edite el script de la imagen, y escriba las siguienteslíneas:

en mouseMove PMX, PMY

- Poner getPixel (el nombre corto de mí, PMX - la izquierda demí, PMY - la parte superior de mi) en tPixelColor

- Establecer el gráfico de backgroundColor "muestra" para

mouseMove final tPixelColor

7. Tenga en cuenta que las dos líneas están comentadas. LiveCode sólo se quejaría siseguimos pidiendo getPixel, antes de haber creado esa función!

8. Edite el script de pila. Añadir la getPixel función, que es muy parecido al que semuestra en la sección de formato de datos de imagen al principio de estecapítulo:función getPixel PImage, px, py

poner la imagen de imageData del PImage en

tImageData poner el ancho de la imagen en PImage

tWidth

poner ((pY-1) * tWidth + (pX-1)) * 4 en tStartChar

poner charToNum (char tStartChar 2 de tImageData) en

charToNum Tred poner (char 3 tStartChar de tImageData) en

tGreen poner charToNum (char tStartChar 4 de tImageData)

en cambio tBlue Tred, tGreen, tBlue

final getPixel

9. De vuelta en el guión de imágenes, elimine las dos líneas. Empiece apuntando a laimagen, y usted debería ver la muestra de color para que coincida con el cambiográfico del píxel bajo el cursor

Page 197: Live code manual Español

Chapter 5

[ 137 ]

¿Qué ha pasado?Hicimos un caso ejemplo muy simple de utilizar el color de un píxel en una imagen, en este caso paracolorear una muestra. Como configurar elbackgroundColor de un gráfico requiereredvalue, greenvalue, bluevalue, no lo necesitamos para convertir los valores de laimagen a un número de 24-bit, y el getPixel función podría devolver Tred, tGreen,tBlue.

Ahora, no hay realmente ninguna ventaja a la forma en que lo hicimos en comparación con elconstruido en elmouseColor función. Pero por lo menos nos dio la getPixel funcionar una prueba!

Pop-Quiz - ¿cuántos bits en un byte?"Bytes" fue mencionado un par de veces, y usted bien sabe acerca de "la profundidad debits" cuando se habla de fotografías digitales. ¿Cuántos bits hay en un byte?

una.

32. b.

24. c. 8.

d. Depende de cuánta hambretengamos.

Simulación de un montón y un montón de botonesEn algunas aplicaciones es necesario saber exactamente qué área de la imagen que elusuario está señalando. Por ejemplo, cuando hay un mapa y donde quieras mostrarinformación relativa a la región que el usuario ha hecho clic. Esto podría hacerse utilizandouna gran cantidad de botones rectangulares, ya que podría romper las regiones hasta en losgráficos y el uso de un MouseEnter controlador para detectar qué región está. O ustedpodría utilizar en lugar de una sola imagen para representar a todas las regiones.

Tiempo de acción - hacer un mapa de los Estados UnidosHay muchos lugares en línea para obtener imágenes de dominio público para su uso en lasaplicaciones. Búsqueda de "imágenes de dominio público", y verás enlaces a artículos deWikipedia, los sitios del gobierno y otros sitios dedicados a la descarga de free-to-useimages. El mapa que se muestra aquí vino de este archivo:

http://upload.wikimedia.org/wikipedia/commons/3/32/Blank_US_Map.svg

1. Hacer un nuevo campo llamado estados. Encuentra una lista alfabética de los50 estados de EE.UU. para pegar en el campo. O bien, escriba en ellos!

Page 198: Live code manual Español

Making a Jigsaw Puzzle Application

[ 138 ]

2. Hacer otro campo, ajuste el tamaño del texto a ser 24, y el tamaño del campo paraser lo suficientemente amplia como para "New Hampshire" para encajar (sólo laspalabras, no en todo el estado!). Nombre del campo como Estado.

Page 199: Live code manual Español

Chapter 5

[ 139 ]

3. Si usted tiene Adobe Illustrator, abra el archivo SVG. Si no es así, abrirlo con GIMP.

4. En orden alfabético, llene en cada estado con un color donde los valores de rojo,verde y azul que coincida con el número de línea de ese estado + 100. Estamosañadiendo 100 para que los tonos de gris que veremos no es tan negro.

5. Continúe a través de todos los estados. Así es como va a empezar a mirar en Illustrator,donde

Idaho está a punto de ser de color 112.112.112:

6. Cambiar el tamaño del mapa de manera que se llene un tercio de la ventana de lapila y elija Exportar.

Page 200: Live code manual Español

Making a Jigsaw Puzzle Application

[ 140 ]

Los ajustes de color del perfilLiveCode trata a los mapas de bits de un modo que ignora la informaciónde perfiles de color en la imagen, y eso arruinaría lo que estamos tratandode hacer. Al exportar una imagen ver si hay una opción para configurar elperfil de color para genericRGB. Si no la hay, a continuación, utilizaruna utilidad como Sync Color para aplicar el genericRGB perfil de color.Una vez que la imagen se guarde hay algo que usted puede hacer paraasegurarse de que se importan en LiveCode: antes de realizar la importación,el tipo establecer el screengamma a 2,23 en el cuadro demensaje y pulse Intro. Esto establecerá LiveCode a la configuración correctapara asegurarse de que elvalores de color vienen en forma correcta.

7. Si está utilizando Illustrator, establecer el fondo para ser el blanco, y el ser anti-aliasingpara

Ninguno. Con GIMP, asegúrese de que el PNG se guarda sin un canal alfa.

8. Escriba la línea seguida por la tecla Enter en el cuadro de mensaje:establecer el screengamma a 2,23

9. Importe el PNG en su ImageDataTests apilar.

10. Establecer escritura de la imagen a la siguiente:en mouseMove PMX, PMY

poner getPixel (el nombre corto de mí, PMX - la izquierda demí, PMY - la parte superior de mi) en tStateColor

establecer el itemdelimiter a coma

poner el tema 1 de tStateColor - 100 en TLINE

poner TLINE línea del campo "estados" en el campo

de mouseMove "estado" final

11. Apunte a los diferentes estados, por lo menos los que han coloreado pulg El nombre del estadodebe aparecer en laestado campo.

¿Qué ha pasado?Para este caso sólo hay que fijarse en el valor del canal rojo para el píxel bajo el cursor.(Los valores de verde y azul son los mismos, ya que se utilizó un valor de color gris.) En vezde escribir otra función para obtener sólo la parte roja de los datos, se reutiliza laexistente getPixel función, pero sólo entonces se dio cuenta del primer elemento dela función devuelta. Ese número, después de restar los 100 que hemos añadido parahacer las sombrasNo seas tan negro, se utilizó como valor de búsqueda para obtener el nombre del estadocorrespondiente.

Page 201: Live code manual Español

Chapter 5

[ 141 ]

Pop-Quiz - conseguir el cuadro grandeLa imagen del mapa ejemplo es un archivo SVG. Hacer un poco de investigación Wikipedia, ydecidir si un SVGarchivo es más pequeño que un archivo PNG para una imagen determinada?

R. Sí. b.

No.

c.Depends sobre la naturaleza de la imagen.

Uso de maskData para la detección de colisionesEn los antiguos juegos 2D laberinto de aventura tu personaje se mueva en distintaspartes, y cuando la comprobación para ver si había una pared o en un hueco, el programatenía que ver sólo relativamente pocos lugares. Los puntos ocupados podrían seralmacenados en una matriz, teniendo poca memoria.

Con los juegos de laberinto otros, como esas tablas inclinadas mármol laberinto, hay que detectarlas colisionesen un grado mucho más fina. Un motor de física en toda regla podría hacerse cargo del problema,pero esposible obtener algunos resultados interesantes almacenando el laberinto como una imagen, y elcontrol de lapíxeles que están delante de su personaje, o de mármol como el caso puede ser.

En un juego con todas las funciones que sería mejor utilizar el imageData del, o tal vez elalphaData, de modo que usted pueda saber cuándo se va a golpear algo, y del valor quelee usted también puede decir qué es lo que han pasado. Por ejemplo, en el juego dellaberinto de mármol que usted necesita saber cuando usted ha pasado más de un agujero.

Para esta prueba siguiente, sin embargo, sólo tendremos que utilizar maskData, y ver quépodemos hacer al respecto no golpear a lo que está delante de nosotros.

Tiempo de acción - haciendo un hipódromoVamos a hacer una pista de carreras de coches pequeños para moverse. Lo haremos de la pila quehemos construido! En primer lugar tenemos que convertir lo que está en la tarjeta en una imagenque representa paredes y espacios.

1. Utilizando las herramientas LiveCode dibujar, añadir un montón de objetospara la ImageDataTest

apilar. Estos van a ser los obstáculos en la pista decarreras.

Page 202: Live code manual Español

Making a Jigsaw Puzzle Application

[ 142 ]

2. Para crear la imagen que vamos a necesitar, escriba lo siguiente en el cuadro de mensaje:Importar resumen de la rect rect de esta pila

3. El comando anterior se llevará una captura de pantalla de la ventana de la tarjeta, ylo colocamos en la tarjeta como un control de imagen nuevo.

Page 203: Live code manual Español

Chapter 5

[ 143 ]

4. Haga clic en la imagen que se ha creado y seleccione Editor de. Esto abrirá laimagen en el editor de mapa de bits que ha configurado en Preferencias |General.

5. En la ventana de su editor de imágenes de Capas, duplicar la capa inicial.

6. Hacer una nueva capa transparente, bajo la capa de la imagen duplicada.

7. Eliminar la capa original.

8. Use Varita mágica del editor para seleccionar el espacio en blanco de la imagen de lacarta en la capa con la imagen en el mismo (no de la capa transparente). Borrar elárea seleccionada, para revelar la capa transparente.

9. Invertir la selección, y la rellenamos con un color oscuro (el color no importa, essólo para que podamos ver dónde están los agujeros son).

10. Tómese su tiempo para llenar los vacíos pequeños. Además, colocar un borde grueso alrededor delexterior de la imagen. La siguiente captura de pantalla muestra cómo se ve la tarjeta, y cómo laimagen de la instantánea debe ser por ahora:

11. Combinar las capas del documento y, a continuación, seleccione Guardar.

12. Volver a LiveCode, haga clic en el botón Actualizar, y la imagen de la instantánea seactualizará para reflejar los cambios realizados.

13. Nombre de la imagen como telón de fondo. Más adelante vamos a configurar laimagen de estar detrás de otros objetos, pero por ahora vamos a dejarlo encima detodo lo demás.

Page 204: Live code manual Español
Page 205: Live code manual Español

Chapter 5

[ 141 ]

¿Qué ha pasado?Acabamos de hacer un hipódromo muy extraño mirando! En un juego de carreras real de arriba haciaabajo con cuidado diseñaría un hipódromo bonita, y hacer un duplicado de la imagen que deseautilizar para la detección de colisiones. En el duplicado que borraría las partes de la imagen querepresenta el que los coches se les permite conducir, y luego llenar el resto de la imagen con un colorplano. Los jugadores verían el hipódromo bonita, y debajo sería la versión duplicada de color planoque se utiliza para la detección de colisiones.

Ahora tenemos un coche que se conduce por el campo que hemos hecho.

Tiempo para la acción - lo que un coche de carrerasTómese todo el tiempo que quisiera crear una imagen del coche. Hacerlo de modo que está mirando a laderecha. A continuación, una vez que esté en la pila vamos a empezar a añadir las funciones necesarias para suguión. Un tamaño de aproximadamente 40 píxeles a través de debe ser aproximadamente correcto. He aquí unprimer plano la imagen de lo que estamos hablando, como se ve en Photoshop:

Page 206: Live code manual Español

Making a Jigsaw Puzzle Application

[ 142 ]

Tuyo puede ser incluso mejor que eso, si te gusta! Guárdelo como un archivo PNG de 24-bit que tiene latransparencia. Ok, enciendan sus motores ...

1. Importe la imagen como un control, y colocarlo en algún lugar de la zona blanca de laImageDataTests apilar. Nombre que car1.

2. Duplicar la imagen tantas veces como quieras (el script de abajo puede manejar hasta100 coches), y el nombre de cada uno en la secuencia siguiente, car2, car3, y asísucesivamente.

3. Podría decirse que el camino correcto orientado objeto de proceder sería colocaralgunas funciones en las imágenes, y algunos en el guión carta o grupo, pero porrazones de rendimiento que vamos a poner todo en el guión de la pila. Abra elscript pila.

4. Añada una línea para las variables globales que vamos a necesitar:gBackdropMaskData mundial, gMaskWidth, gSpeeds, gMovingCars,gMaskWidth

5. Vamos a añadir un botón arrancar / parar pronto, lo que se llama a una función paraalternar si los vehículos están en movimiento o no. Agregue la función de palanca en laescritura de pila:en startStopCars

gMovingCars si es cierto,

entonces poner en falso

gMovingCars

más

poner el maskData de imagen "telón de fondo" en

gBackdropMaskData poner el ancho de la imagen de "telón de

fondo" en gMaskWidth

setSpeeds

poner en verdadero gMovingCars

enviar moveCars a esta tarjeta en dos

finales garrapatas si

startStopCars finales

6. La setSpeeds controlador, que es llamado por startStopCars, inicializará elgSpeeds variable con una velocidad aleatoria para cada una de las imágenes delcoche. También se fijará la dirección inicial a cero, así como la colocación del vehículoen una ubicación conocida en el área blanca (200.200 en este caso). Añadir lasetSpeeds controlador a la secuencia de comandos de pila, por debajo de lastartStopCars handler:en setSpeeds

puesto vacío en la

repetición gSpeeds con

Page 207: Live code manual Español

Chapter 5

[ 143 ]

100 = 1 a

poner "car" y en un carname

si hay una imagen carname luego

poner (al azar (10) +10) / 10 En el punto 1 de la línea

de un gSpeeds poner 0 en el punto 2 de la línea de un

gSpeeds

establecer la locomotora de carname

imagen a 200.200 más

Page 208: Live code manual Español

Making a Jigsaw Puzzle Application

[ 144 ]

la salida

final de la

repetición si

terminar

setSpeeds

final de

repetición

7. En una moveCars controlador, que se muestra en el paso 8, vamos a mirar elgBackdropMaskData variable para ver si el coche se va a ejecutar en algo sólido.Añadir esta hitBarrier función:función hitBarrier px, py

poner (PY-1) * gMaskWidth + pX en tStartChar

poner charToNum (char tStartChar de gBackdropMaskData)en tMaskValue

si tMaskValue = 255 entonces return

true else return false

final hitBarrier

8. La moveCars controlador se llamó inicialmente por la startStopCars

controlador, y luego se llamará cada 2 ticks hasta que el gMovingCars variable seestablece en falso. Escriba lo largo moveCars manejador en el guión de pila:en moveCars

poner la pantalla

de tiempo largo

mechón

repetir con un 100 = 1 a

poner "car" y en un 0,1

carname poner en

anglechange

si hay un carname imagen a

continuación, poner 0 en

mostrador

repetir mientras contador

<20 agregar 1 para

contrarrestar

poner punto 1 de la línea de un gSpeeds en tCarSpeed

poner punto 2 de la línea de un gSpeeds en

tCarDirection poner el punto 1 de la locomotora de

carname imagen en tCarX poner punto 2 de la

locomotora de carname imagen en tCarY

poner la ronda de ((cos (tCarDirection) * tCarSpeed) * 20+

tCarX) en tLookAheadX

poner la ronda de ((sin (tCarDirection) * tCarSpeed) * 20

Page 209: Live code manual Español

Chapter 5

[ 145 ]

+tCarY) en tLookAheadY

si hitBarrier (tLookAheadX, tLookAheadY) luego

poner tCarDirection + anglechange en el punto 2 dela línea A de gSpeeds

poner anglechange * -1 * ((20 - random (10)) / 10)en anglechange

poner max (1, tCarSpeed - .1) En el punto 1 de lalínea de un gSpeeds

Page 210: Live code manual Español

Making a Jigsaw Puzzle Application

[ 146 ]

más

poner min (3, tCarSpeed + .05) en el punto 1 de lalínea de un gSpeeds

la salida

final de la

repetición si

Fin derepetición

establecer la locomotora de carname imagen con el punto1 de la locomotora de carname imagen + (tLookAheadX-ítem 1 de la locomotora de la imagencarname) / 10, artículo 2 de la locomotora decarname imagen + (tLookAheadY-tema 2 de lalocomotora de carname imagen) / 10

establecer el ángulo de carname imagen a 360 - punto 2de la línea de un gSpeeds / PI * 180

más

la salida

final de la

repetición si

poner fin a

la repetición

de desbloqueo

de pantalla

gMovingCars si es verdad entonces enviar moveCars a estatarjeta en 2 ticks

moveCars finales

AnticolisiónTómese un momento para mirar a lamoveCars manejador. ¿Qué está haciendo?Usted sin duda ha oído hablar de la detección de colisiones, aquí es dondeusted tiene el código que reconoce cuando un objeto ha colisionado con otroobjeto, o en la pared, tal vez. Usted podría desencadenar una explosión,colisión o el sonido cuando eso sucede. Para nuestro ejemplo, a pesar de queen realidad no quieren que las cosas chocan entre sí, queremos que los autosa su vez antes de que hubiera chocado. Para cada vehículo, hasta 100 deellos, miramos hacia el futuro del coche para ver si se puede chocar con losbordes de la asignatura. Si se va a hacer, así que cambiar la dirección en laque el coche se dirige, en repetidas ocasiones, hasta que un fuerte sentido deavance se encuentra.

9. Agregue un botón de Start / Stop Coches a la ventana de la tarjeta, y establecer susecuencia de comandos a ser:

en startStopCars

mouseUp

Page 211: Live code manual Español

Chapter 5

[ 147 ]

final mouseUp

10. Seleccione la imagen de fondo y elija Enviar al fondo del menú Objeto.

11. Podría ser una buena idea hacer clic en Save!

Page 212: Live code manual Español

Making a Jigsaw Puzzle Application

[ 148 ]

12. Haga clic en la opción Ejecutar / Examinar herramienta, y luego en el botón Start /Stop Cars, para ver la unidad de coches alrededor de la interfaz. La siguientecaptura de pantalla muestra cómo se ve cuando20 coches se están moviendo sobre:

13. Tenga en cuenta que usted puede seguir para apuntar a partes de la imagen quese carga por primera vez (el logo LiveCode en el ejemplo anterior), para ver lamuestra para el cambio de color de la derecha. Además, apunta a los diferentesestados de los EE.UU. debe cambiar el texto en el estado campo que hacreado.

¿Qué ha pasado?Después de haber utilizado imageData del para implementar un selector de color, y paraactuar como botón varias áreas, se procedió a utilizar la maskData de la imagen como unmapa de colisión. Hay una granpoco de aritmética detrás de hacer que los coches se mueven de manera inteligente, y sepodía ir a cambiar algunos de los números para obtener un comportamiento diferente. Ousted podría tomar un descanso, y prepárate para hacer un rompecabezas!

Page 213: Live code manual Español

Chapter 5

[ 149 ]

Pop-Quiz - calcular esto!Para el mapa de los EE.UU. sólo necesitábamos para simular 50 botones. Si usted hizo uso delrojo, verde y azul, ¿cuántos botones podría simular?

a.One botón enorme. b.

65.536 botones.

c.16, 777.216 botones.

Cómo hacer un rompecabezasLas cosas que hemos probado hasta ahora en este capítulo utilizan técnicas que podrían ser útilesen cualquierAplicación LiveCode, no específicamente con las aplicaciones móviles. Usted puede tratar de lapila quehan construido, sino que va a funcionar bien en un dispositivo móvil, incluso con el selector decolor, los estados mapa,20 coches y conducir alrededor de la pantalla! Sin embargo, esas pruebas no realmente hacer usode cualquier móvilcaracterísticas. El resto del capítulo se basará en la información acerca imageData del, yTambién se aprovechará de una serie de características de dispositivos móviles pocos.

Ir a pedazos ...La técnica general que vamos a utilizar es tomar un conjunto de archivos PNG que tienen uncanal alfa agradable en ellos (que crea los bordes de la pieza del rompecabezas), y luegovuelva a colocar los datos de píxeles reales con una imagen de nosotros mismos. Lo primeroque necesitamos es, pues, algunos archivos PNG.

Si usted hace una aplicación móvil comercial, ya sea crear sus propias formas de puzzle ocomprar una imagen libre de derechos. Para los prototipos se pudiera tomar cualquierimagen de la web, y obtener las bases que van y vuelva a colocar las imágenes con más dealta calidad que le hahe comprado. Aquí estamos utilizando una imagen de vista previa dehttp://depositphotos.com/ que también vende versiones más altas de calidad.

Cuando usted tiene versiones de alta calidad que usted puede desear para crear cadapieza del rompecabezas, hasta que toquen entre sí perfectamente. Aquí estamos usandouna imagen de vista previa, y se seleccionará la parte interior de cada pieza, y crear losarchivos PNG de aquellos. Habrá pequeños espacios entre las piezas, pero por lo menoses muy rápido de preparar las imágenes que va a necesitar.

Tiempo de acción - la creación de las piezas y la elección de una

Page 214: Live code manual Español

Making a Jigsaw Puzzle Application

[ 150 ]

imagenSi desea seguir con exactamente la misma imagen que se muestra aquí, wtomadas de laparte superior izquierda de este archivo:

http://static3.depositphotos.com/1004551/191/v/950/depositphotos_1914748-rompecabezas-puzzle-blank-templates.jpg

Page 215: Live code manual Español

Chapter 5

[ 151 ]

1. Hacer una Mainstack nuevo a 1024x768 (o el tamaño de su dispositivo detableta). Nombre de la pila rompecabezas, y establecer el título a JigsawPuzzle. Hacer un Guardar.

2. Abra la imagen del rompecabezas entero en su editor de imágenes.

3. Utilice la herramienta Varita mágica para recoger la parte interior de la pieza lateralsuperior izquierdo del rompecabezas.

4. Rellene que con un color que hace que sea fácil de detectar posibles lagunas restantes.

5. Copiar y pegar en un documento nuevo (con un fondo transparente) que es eltamaño de la pieza que ha copiado.

6. Repare las lagunas, con la herramienta pincel establece en el mismo color de relleno.

7. Guardar como PNG (con Photoshop que se Guardar para Web y dispositivos, 24bits, con transparencia). Utilice un esquema de nombres que le ayudarán aidentificar fácilmente las imágenes. Por ejemplo, tlcorner.png, p1.png,trcorner.png, y así sucesivamente.

8. Proceder a través de todas las áreas de diferente forma. En la imagen de ejemploque será tan pocos como 14 formas únicas. No hay necesidad de salvar otraspiezas que tienen la misma forma como los que ya tiene.

Page 216: Live code manual Español

Making a Jigsaw Puzzle Application

[ 152 ]

9. El conjunto de imágenes se verá así:

10. En la pila rompecabezas, vaya a Archivo | Importar como Control | Imagen, e importartodas las 14 imágenes.

Page 217: Live code manual Español

Chapter 5

[ 153 ]

11. Coloque un rompecabezas que cubre la mayor parte de la ventana de la tarjeta. Enlas pantallas que se muestran debajo del rompecabezas era 900x622. Realizarduplicados de las imágenes de media pieza para llenar todo el rompecabezas.

12. Nombra las imágenes en una cuadrícula como la moda. La parte superior izquierda de lapieza de mano se denominaría p

1 1, la parte superior derecha pieza de borde lateral se denominaría p 11 1 (Había11x8piezas en la zona de 900x662), y la parte inferior derecha de la pieza lateral tendría unnombre de p 11 8.

13. Seleccione todas las piezas y agruparlas. Asigne un nombre al grupo como piezas.

14. Hacer un botón, con el nombre de fromcamera y una etiqueta de Tomar unafoto. Establecer las secuencias de comandos de botones en el siguiente:en mouseUp

LoadImage "cámara"

fin mouseUp

15. Hacer otro botón, denominado fromlibrary y etiquetados Cargar unaimagen, con este script:en mouseUp

LoadImage

Page 218: Live code manual Español

Making a Jigsaw Puzzle Application

[ 154 ]

"biblioteca" fin

mouseUp

Page 219: Live code manual Español

Chapter 5

[ 155 ]

16. Edite el script de la tarjeta y añadir estas variables y funciones globales, que seinicializan los valores que serán necesarios por las otras funciones que vamos a hacer:originalimage mundial, puzzlewidth, puzzleheight,snapdistance, hcount, vcount

en SetValues

OpenCard

final OpenCard

en SetValues

puesto 900 en puzzlewidth

puesto 662 en

puzzleheight puesto 50 en

snapdistance puesto 11 en

hcount

puesto 8 en

SetValues finales

vcount

17. Ahora agregue el loadImage controlador, que los dos botones a llamar paraobtener una imagen de la cámara del usuario o álbum de fotos:en loadImage cameratype

puzzlewidth si está vacía, entonces SetValues

si hay una imagen "original" y luego borrar la imagen

"original" mobilePickPhoto cameratype, puzzlewidth,

puzzleheight

si el resultado está vacía, entonces

bloquear la pantalla

establecer el nombre de la imagen del número de imágenes

que "original" establecer el ancho de la imagen

"original" para puzzlewidth

ajustar la altura de la imagen "original" para puzzleheight

poner la imagen de imageData del "original" en

originalImage imagen delete "original"

- Makepuzzle

- Dispersión

de desbloqueo

de pantalla

más

contestar el

resultado final si

final loadImage

Page 220: Live code manual Español

Making a Jigsaw Puzzle Application

[ 156 ]

18. La makepuzzle y dispersión líneas están comentadas por el momento, demodo que usted puede probar las funciones creadas hasta el momento.

19. Ajuste los botones para tener una sombra, utilizando las opciones en el panel deefectos gráficos de la paleta Inspector.

Page 221: Live code manual Español

Chapter 5

[ 151 ]

¿Qué ha pasado?Las piezas del rompecabezas están en su lugar, y nombrado de manera que podamosaprovechar al manipularlos. Si usted ve a Ajustes aplicación independiente y seleccionariOS o Android, puede dar a la aplicación un intento.

La creación de algunas imágenes de prueba.Si utiliza el simulador de iPad que no será capaz de probar la obtenciónde una imagen de la cámara, y al principio no tiene ninguna imagen enla fotobiblioteca. Para resolver esto, arrastrar imágenes desde el Finder hasta laventana del simulador, y la imagen se mostrará en una ventana de Safari. Acontinuación, puede hacer clic y mantenga presionado en la imagen yselecciona Guardar. De esa manera usted puede agregar algunas imágenesa la biblioteca con el fin de seleccionar uno de ellos como imagen para elpuzzle.

Cuando se LiveCode una imagen desde el dispositivo móvil, ya sea desde la cámara odesde la biblioteca o álbum de fotos, coloca la imagen como un control de imagen que esel objeto superior de la tarjeta. No necesitamos la imagen en sí, sólo su imageData del,

y así en la loadImage controlador de la imagen se hace del mismo tamaño que el grupode piezas de puzzle, el imageData del se almacena en la variable globaloriginalImage, y la propia imagen es eliminada.

A continuación, vamos a transferir la imagen elegida en las piezas del rompecabezas.

Tiempo de acción - la transferencia de imageData delAl establecer la imagen elegida para ser la misma anchura y altura que el grupo que contienelas piezas del rompecabezas (que es donde los 900 y 662 números de vino), se hace posibletransferir el rectángulo correspondiente de los datos de la imagen completa de la pieza depuzzle en cuestión.

1. Abra el script de nuevo la tarjeta. Agregue el controlador makepuzzle:en resetpuzzle

makepuzzle

que el número de imágenes en el grupo "piezas" en la

repetición imagecount con a = 1 a imagecount

makepiece el nombre corto de la imagen de un grupo de

"trozos" de final de repetición

final makepuzzle

2. El manejador makepuzzle pasará por cada una de las piezas del rompecabezas y

Page 222: Live code manual Español

Making a Jigsaw Puzzle Application

[ 152 ]

llamar a otro controlador para hacer la transferencia de los datos para esa pieza.Aquí está el gestor makepiece:en piecename makepiece

poner el ancho de la imagen en piecename

piecewidth poner la altura de piecename imagen en

pieceheight

Page 223: Live code manual Español

Chapter 5

[ 153 ]

puesto vacío en TempImage

poner a la izquierda de la imagen piecename - la izquierdadel grupo de "piezas" en dx

poner la parte superior de la imagen piecename - la cima delgrupo "piezas" en dy

repetir con y = 1 a pieceheight

poner ((y + dy-1) * puzzlewidth + dx) * 4 sourcestart

poner en caracteres sourcestart +1 a + sourcestart

piecewidth * 4 deoriginalimage después TempImage

Fin de repetición

establecer el imageData del piecename de imagen

para makepiece final TempImage

3. En el anterior imageData del pruebas de que sólo estábamos interesados en unpíxel a la vez, pero aquí queremos un montón de filas de datos. La aritmética, ((Y+ dy-1) * puzzlewidth+ Dx) * 4 en sourcestart, rápidamente saca toda una fila de píxeles a la vez.Las filas se formó una nueva variable, TempImage, que finalmente se transfiere a lapieza del rompecabezas real.

4. Después de que las piezas tienen su rectángulo de la imageData del, Entoncesnecesitamos para mover las piezas en lugares al azar, listo para el usuario parajugar el juego. Esto se hace con un dispersión handler:en dispersión

repetir con a = 1 para el número de imágenes en el grupo de"piezas", coloque el myloc imagen de un grupo de"piezas" de la locomotora de

la imagen de un grupo de "piezas"poner el nombre corto de la imagen de un grupo de"piezas" en n si edgepiece (n) a continuación,

establecer la locomotora de la imagen de un grupo de "piezas"a 40 +

aleatorio (400), 300 + aleatorio (400)más

establecer la locomotora de la imagen de un grupo de "piezas"a 500 +

aleatorio (500), 300 + aleatorio (400)End If

final delarepetición

fin dispersión

5. La primera cosa que la mayoría de los jugadores de rompecabezas hacer esseparar las piezas de bordes rectos. Podemos codificar las cosas de un modo queles permite ahorrar un poco de tiempo, mediante el empleo de una función que

Page 224: Live code manual Español

Making a Jigsaw Puzzle Application

[ 154 ]

coloca las piezas de borde alejado de las piezas de borde no. La edgepiecefunción (que se llama desde el dispersión controlador mencionadoanteriormente) es la siguiente:función pName edgepiece

devolver la palabra 2 de pName = 1 ó 3 palabras de pName = 1 ola palabra 2 de pName = hcount o palabra 3 de pName = vcount

final edgepiece

Page 225: Live code manual Español

Chapter 5

[ 155 ]

6. El nombre que hemos cuidadosamente establecido para cada pieza se compruebapara ver si esa pieza se encuentra en los márgenes izquierdo, derecho, superior oinferior del puzzle. En otras palabras, se trata de una pieza desde el borde exteriordel rompecabezas. Scatter coloca las piezas de bordes rectos en la mitad izquierdade la pantalla, y los otros en la mitad derecha de la pantalla.

7. El inicio de la makepuzzle controlador llama a un resetpuzzle manejador. Que seutiliza

para asegurarse de que las piezas están de vuelta al punto de partida, listo para una nuevaimagen para sercargado. Eso se logra mediante el uso de una variable de la propiedad en cada pieza,llamada myloc,que registra la ubicación inicial. Aquí está la resetpuzzle handler:en resetpuzzle

repetir con a = 1 para el número de imágenes en el grupo de"piezas"

si el myloc de la imagen de un grupo de "piezas" no está

vacío a continuación, establezca la locomotora de la

imagen de un grupo de "piezas" para la myloc dela imagen de un grupo de "piezas"

más

establecer el myloc de la imagen de un grupo de "piezas"a la locomotora de la imagen de un grupo de "piezas"

End If

final de

la

Page 226: Live code manual Español

Making a Jigsaw Puzzle Application

[ 156 ]

repetición

final resetpuzzle

8. Se puede ver que simyloc si no ya se ha establecido, la pieza debe estar ensu posición de inicio, y por lo que el resetpuzzle manejador sigue adelante y losregistros queubicación en el myloc propiedad.

Page 227: Live code manual Español

Chapter 5

[ 157 ]

9. Elimine el comentario de las líneas en el paso 17 de Time for Action - la creación delas piezas y la elección de una imagen (la makepuzzle y dispersión líneas), yotra prueba de la aplicación. Ahora debería ser capaz de elegir una imagen y verlacomo hacia fuera las piezas del rompecabezas. Esperamos que pueda ver algo comola siguiente captura de pantalla:

¿Qué ha pasado?Como se mencionó anteriormente, el aritmético a la derecha hacía relativamente fácilde extraer un rectángulo deseado de imageData del a partir de una imagen másgrande, y para almacenarlo en una imagen más pequeña el tamañodel rectángulo. Pero hay un poco de magia que no se señaló, el rompecabezas mantenido suforma! ¿Cómo sucedió eso, ya que hemos reemplazado completamente el imageData delpara la imagen? Ajuste de la imageData del no interfiere con la alphaData de la imagen.Los PNGs importados que mantiene su canal alfa original, por lo que todavía se veía lamisma forma, sólo con una imagen diferente.

Adición de interactividadEl rompecabezas está listo para enviar! Bueno, aparte de no existir interactividad enabsoluto! Vamos a añadir algo.

Page 228: Live code manual Español

Making a Jigsaw Puzzle Application

[ 158 ]

Tiempo de acción - la creación deeventos de toque

Los controladores hasta ahora han sido en la secuencia de comandos de tarjetas, el plande ser a tener diferentes tarjetas con diferentes tipos de rompecabezas. Loscontroladores de interactividad puede ser colocado en la pila de secuencia de comandos,disponible para todas las tarjetas.

1. Abra el script pila. Sólo hay una variable global que también necesitamos en laapilar guión, pero hay un par de elementos a inicializar cubrir. Inicie el script pilacon estas líneas:snapdistance mundial

en preopenstack

si la plataforma contiene "iphone"entonces iphoneUseDeviceResolutionverdadero

final preopenstack

en OpenStack

establecer el compositorType de esta pila para

OpenStack final "Static OpenGL"

2. La preopenstack handler chequea si la aplicación está en el iPhone, y pide quela resolución original del dispositivo utilizado. Esto se asegurará de que laspantallas Retina mostrar la mejor calidad. La compositorType se establece enStatic OpenGL ayudará a rendimiento.

3. La interactividad usaremos hará uso de eventos de toque. Cada toque viene con unvalor de ID asociado. Aquí está el controlador que detecta el inicio de un evento decontacto:en Touchstart touchid

poner el nombre corto de la meta en n

si la palabra 1 de n es "p" y luego

establecer la imagen de dropShadow n al dropShadow de botón"Fromlibrary"

establecer los relayerGroupedControls en true

establecer la capa del blanco con el número de imágenes en elgrupo"Piezas"

end if

final Touchstart

4. El proceso de registro del nombre de destino es una forma rápida de asegurarse de

Page 229: Live code manual Español

Chapter 5

[ 159 ]

que no se arrastren nada alrededor excepto para las piezas del rompecabezas.Cuando una pieza es tocado usamos el relayerGroupedControls y capafunciones que hacen que la pieza aparecen por encima de las otras piezas.

Page 230: Live code manual Español

Making a Jigsaw Puzzle Application

[ 160 ]

5. ¿Te acuerdas de cómo hemos añadido un Sombra a los dos botones? Aparte dehacer que se vean más bonitas, podemos hacer uso de ella aquí también. Mediantela adición de la misma dropShadow a la pieza del rompecabezas que crean lailusión de que la pieza está flotando por encima de la pantalla.

6. Lo siguiente a tener en cuenta es el movimiento, que podemos hacer con eltouchMove evento:

en touchMove touchid, touchx, susceptible

poner el nombre corto de la meta en n

si la palabra 1 de n es "p" y luego

establecer la locomotora de la meta a

touchx, extremo delicado si

final touchMove

7. Una vez más hay una doble comprobación rápida para asegurarse de que es unapieza del rompecabezas, si no es un simple caso de establecer la ubicación de lapieza a la posición de los dedos del usuario.

8. Cuando el usuario suelta la pieza, comprobamos para ver si está cerca de su lugarde partida, y si es entonces que mover la pieza en su lugar y retire el dropShadowefecto:en touchEnd touchid

poner el nombre corto de la meta en n

si la palabra 1 de n es "p" y luego

checkdistance el nombre corto de la meta

de establecer el dropShadow de la meta de

vaciar checkfinished

End If

final touchEnd

9. Este es el checkdistance controlador y un distancia funcionar lo llama:en checkdistance dt

snapdistance si está vacío, poner el 100 en snapdistance

poner distancia (artículo 1 de la locomotora de imagen dt -Artículo 1 de la myloc dt de la imagen, el punto 2 de lalocomotora de imagen dt - punto 2 delmyloc de la imagen dt) en d

si d <snapdistance entonces

poner max (.1, min (.2, d/200)) en t

dt mover la imagen a la myloc de dt imagen en

segundos t Ajuste el relayerGroupedControls en true

establecer la capa de dt

imagen a 2 final si

final checkdistance

Page 231: Live code manual Español

Chapter 5

[ 161 ]

función de la distancia dx,

dy sqrt retorno (dx * dx

+ dy * dy)

final distancia

Page 232: Live code manual Español

Making a Jigsaw Puzzle Application

[ 162 ]

10. La distancia función utiliza la fórmula de Pitágoras, devolviendo el número depíxeles entre la pieza del rompecabezas y su original myloc valor. snapdistancees la variable global que se utiliza para determinar si la pieza es lo suficientementecerca de su lugar de partida para ser considerado en el blanco.

11. La mover línea utiliza LiveCode de mover función, que animará la piezaen su lugar.

12. Una última cosa, vamos a ver si el puzzle se completa. Añadir estecontrolador para el guión de pila:en checkfinished

repetir con a = 1 para el número de imágenes en el grupo de

"piezas" si el myloc de la imagen de un grupo de

"piezas" <> de la Línea de Controlla imagen de un grupo de "piezas" y salga checkfinished

Fin derepetición

responde "Lo has hecho!"

terminar checkfinished

¿Qué ha pasado?El rompecabezas completo debería funcionar ahora. Algo que no es fácil adivinar por lasfunciones táctiles que hemos añadido es el hecho de que trabaja con multi-touch. Puedearrastrar en un máximo de 10 unidades a la vez (o lo que sea el límite de multi-touch es parasu dispositivo), y cada uno va a mostraruna sombra, y se animará a su sitio cuando dejarlos ir.

Tener un héroe go - una para los niñosFunciones que se relacionan con el mismo rompecabezas están en la secuencia de comandosde tarjeta. Trate de hacer una nueva tarjeta que tiene grandes piezas del rompecabezas y unvalor más alto para snapdistance (Cuanto mayor sea el valor, más fácilque es conseguir una pieza en su lugar). Se podría hacer una tarjeta de apertura para la pilaque tiene un conjunto de botones de nivel de dificultad, uno de los cuales podría saltar alpuzzle más fácil. Eso sería lo ideal para los jugadores más jóvenes.

Agregando algunos gráficos de guía ayudará a los jugadores saber dónde están losbordes del rompecabezas terminado son, y para los niveles de dificultad mássencillos que incluso podría incluir los contornos de las piezas del rompecabezasindividuales.

Page 233: Live code manual Español

Chapter 5

[ 163 ]

ResumenExisten muchas otras posibilidades a la hora de hacer uso de imageData del; enprogramas de pintura, aplicaciones de procesamiento de imágenes, y así sucesivamente.Tratar con el imageData del es todavía el mismo que en los ejemplos anteriores, en laque se pasaron la siguiente:

Comprender el formato de imageData del, alphaData, y maskData

Copia de las áreas de imageData del de una imagen a otra

Lectura de los píxeles individuales de una imagen, y encontrar nuevos usos para los que elvalor

También vimos cómo utilizar interactividad multi-táctil para que esos trozos deimageData del a la vida, en forma de un rompecabezas

Trabajar con gráficos puede ser muy divertido, espero que esto será sólo el comienzo de lo que va acrear. Sin embargo, en el siguiente capítulo nos pondremos en contacto para hacer una aplicación deutilidad. (Sigh!)

Page 234: Live code manual Español

6Realización de una aplicación

Reminder

Nota mental...

Para listas de tareas, alarmas, recordatorios de cumpleaños, notas, listas de compras, y la listasigue. Debe haber una aplicación para mantener una lista de aplicaciones diferentes quemantienen las listas! En el momento de escribir esto, ya había más de 2.000 aplicaciones de iPadque están listas, los planificadores, o alarmas. Tal vez hay lugar para uno más ...

Se necesitaría una gran cantidad de investigación y dinero para explorar todas lasaplicaciones recordatorios que están ahí fuera. La mayoría de las aplicaciones tendrá unmontón de características que nunca uso, y por lo menos una característica vital que falta. Sitienes suerte, alguna combinación de aplicaciones puede hacer todas las cosas que quieres.Pero no se olvide, mediante el uso de LiveCode, usted puede hacer su propia aplicaciónrecordatorios!

En este capítulo vamos a:

Hable de lo que se entiende por un "recordatorio"

Crear varias funciones de utilidad de medición de tiempo

Definir una estructura de datos para almacenar información acerca de un evento

Hacer uso de dispositivos móviles "notificaciones"

Crear una aplicación de recordatorios flexibles

¿Qué es un "recordatorio"?Aquí está una lista de algunas cosas que podríamos llamar un "recordatorio":

Lista de compras

Regalo de Navidad lista

Page 235: Live code manual Español
Page 236: Live code manual Español

Making a Reminder Application

[ 160 ]

Lista de tareas

Despertador

Egg Timer

Cumpleaños recordatorio

Ahora, ¿hay una sola manera de describir todas esas cosas? Bueno, puede obtenermuchas palabras, sino un recordatorio podría ser descrito como:

Un mensaje de notificación o el sonido, que aparece automáticamente o muestra cuando semira por él, que se utiliza para hacerle saber que un cierto tiempo haya pasado, unmomento ha llegado, o que una tarea pendiente no se ha completado.

Véase, bastante prolijo. Descomponiéndola como que ayuda a ver lo que ofrece unaaplicación de recordatorios tendrá que tener. Antes de llegar a eso, vamos a probar ladefinición con los ejemplos de aquí

Lista de la compra: En este caso, usted va a buscar el recordatorio, aunquepodríamos configurarlo para que muestre automáticamente cuando su ubicación pasaa ser cerca de la tienda! Aparte de eso caso, este es efectivamente una tarea que nose ha completado.

Regalo de Navidad lista: Casi lo mismo que una lista de compras, pero podríautilizar un mensaje temporizado que le permiten saber hacer de unos días decompras están a la izquierda.

To-do list: De nuevo, es simplemente una lista de las tareas que no hayan finalizado.

Alarma: Esta es una notificación de que un momento en el tiempo ha sido alcanzado.

Egg timer: Esta es una notificación de que una cierta cantidad de tiempo hapasado, lo que podría ser utilizado en una secuencia de tales eventos quepodrían ser utilizados en una aplicación de cocina-buddy.

Cumpleaños recordatorio: Esta muestra si un determinado momento se haalcanzado. Realmente sin embargo, que desea establecer el aviso para que lenotifique antes del evento real.

Por lo menos, como punto de partida, podemos utilizar la definición que nos guíe comopodemos definir las capacidades de la aplicación se necesita tener.

¿Cuándo?Las comunicaciones móviles que se pueden crear con LiveCode se enviará al segundomás cercano a cuando se pide que se envíe. Extrañamente, sin embargo, el valor se basaen el número de segundos desde la medianoche el 1 de enero de 1970, en concreto enuna parte de Londres! Bueno, es el nombre de una zona de Londres, llamadoGreenwich.

Page 237: Live code manual Español

Chapter 6

[ 161 ]

"Greenwich Mean Time", a menudo referido como "GMT", se ha utilizado como elestándar para especificar el tiempo. Ahora es algo superado por UTC (Tiempo UniversalCoordinado), pero en cualquier caso, representa la hora actual exacta, al menos para lospaíses que están dentro de la misma zona horaria de Greenwich. El resto de nosotrossumar o restar una cierta cantidad de tiempo o a partir de ese valor.

Con el fin de adaptarse al hecho de que la Tierra no gira alrededor del Sol en unnúmero exacto de días, o incluso un número exacto de días trimestre, loscalendarios son ajustados porun día cada cuatro años, aunque no en 100 años las fronteras, salvo por cada 400 años(2000 fue un año bisiesto, por ejemplo). Esos ajustes son aún insuficientes paramantener los relojes a tiempo! Los relojes están fuera de tiempo por aproximadamente0,6 segundos al año, por lo que hay "segundos intercalares añadido a" compensar eso.En teoría, los segundos intercalares se podría utilizar para restar un segundo, pero hastaahora esto no ha sido necesario, sino que sólo se han utilizado para agregar un segundo.

Nada de esto afecta el número de segundos transcurridos desde la medianoche01/01/1970, pero sí quiere decir que la conversión del segundo LiveCode en la fecha y horautilizando su propia aritmética no le dará el tiempo correcto. Y sin embargo, todavía seutiliza como base para las notificaciones. Este valor se conoce normalmente como eltiempo Unix.

No debería importar mucho si al final enviar a alguien un mensaje de feliz cumpleaños 25segundos antes! Pero no te preocupes, la forma en que vamos a calcular el tiempo denotificación se hará cargo de la rareza.

Fecha y hora recolectoresComo se mencionó anteriormente, las notificaciones móviles utilizan el número de segundostranscurridos desde la medianoche del01/01/1970, y no agregan a los 25 o menos segundos intercalares que se han producido desdeentonces. ¿Cuándose presentan los selectores de fecha y hora para el usuario, las selecciones que realice el usuariovendráatrás como el tiempo real actual o futuro. Vamos a ajustar para eso después.

Tiempo para la acción - la creación de selectores de fecha y horaRealizar una nueva pila de prueba-rig, que usaremos para probar algunas selectores de fecha yhora.

1. Crear un nuevo Mainstack, que sea ReminderFunctions, y guardar la pila.

2. Agregue dos campos y dos botones.

Page 238: Live code manual Español

Making a Reminder Application

[ 162 ]

3. Nombre un campo dateinseconds y el otro tiempoEnSegundos.

4. Nombre de los botones Elija la fecha y Elige Time.

5. Establecer el guión de la Elija la fecha botón a lo siguiente:en mouseUp

mobilePickDate "fecha"

poner el resultado en

tDate tDate convertir a

segundos

tDate poner en el campo de mouseUp

fin "dateinseconds"

6. Ajuste el Elige Tiempo botón de secuencia de comandos para esto:en mouseUp

mobilePickDate "tiempo"

poner el resultado en

TTIME TTIME convertir a

segundos

TTIME poner en el campo

"tiempoEnSegundos" mouseUp final

7. Ajuste de la configuración de aplicación independiente, de modo que usted puede probaren iOS o Android.

8. Elija su destino de prueba (en este caso, se puede ver que iPhone Simulator fueelegido como el destino), y hacer una prueba.

9. Haga clic en el botón de fecha Selección.

10. Seleccione 25 de diciembre 2012, y haga clic en Hecho.

11. El número de segundos desde la medianoche hasta la medianoche del 01/01/1970el día de Navidad de 2012 se muestra en el primer campo que ha creado.

Page 239: Live code manual Español

Chapter 6

[ 163 ]

12. Haga clic en el botón de la hora pico, y ajustar la hora a la 1 am. Esta imagenmuestra cómo el selector se ve diferente en iOS y Android (Kindle Fire en estecaso):

13. Haga clic en Hecho, y usted verá el número de segundos desde la medianoche hasta01/01/1970

01 a.m. del día en que haga esta prueba se muestra en el campo de la derecha.

Page 240: Live code manual Español

Making a Reminder Application

[ 164 ]

¿Qué ha pasado?Acabamos de hacer dos scripts sencillos que llaman a la fecha o la hora natal recogedor, transformaestos datos en segundos, para luego mostrar en un campo. Lo que es interesante observar es que parael caso de horarios de pick no devuelve el número de segundos en el día de hoy, todo es de lossegundos desde la medianoche del 01/01/1970. Con el fin de establecer un tiempo de notificaciónpara un momento particular de un determinadofecha, tenemos que hacer un poco de aritmética. Vamos a entrar en eso un poco mástarde, cuando hacemos la aplicación real de recordatorio, en el. Haciendo la secciónrecordatorios aplicación de este capítulo

Pop-Quiz - AO (Siglas extraño!)1.You puede haber notado que el acrónimo de "Tiempo Universal Coordinado" es hora

UTC y la CUT no. ¿Por qué es eso?

a.CUT es muy común una palabra

b. Para no molestar a los franceses

C. Los miembros del comité siglas eran disléxicos

¿Dónde?Hay algo que podemos hacer en una aplicación de recordatorios móvil que no volvería atrabajar en una versión de lápiz y papel, podemos presentar la lista de recordatorios funciónde dónde se encuentren en el momento que compruebe! Para hacer uso del lugar, lo quenecesita saber donde se encuentra ahora, y hasta qué punto esto es, del lugar asociado conel recordatorio.

En el momento de escribir esto, no hay capacidad en LiveCode para tirar en un mapa para que ustedelegir lugares que no sean la que están en estos momentos. Por lo tanto, vamos a trabajar dentro deeselimitación, ya que no hay otra opción!

La técnica general al leer sensores de dispositivos móviles es para iniciar el seguimiento deun sensor determinado, detectar cuándo los cambios ocurren, y para interrumpir elseguimiento del sensor. Se puede tomar una lectura del sensor en cualquier momento entreel comienzo y parada de seguimiento. También puede especificar el nivel de detalle de uninforme que desea, y si desea una lectura precisa. La precisión de localización GPS se dictansi se utiliza o no. La ventaja de utilizar GPS es que se obtiene una mayor precisión(asumiendo que hay una señal clara en ese momento), las desventajas son queque consume más energía de la batería y los dispositivos que no tienen GPS no podríautilizar esa característica. Cuando se utiliza la ubicación como parte de un recordatorio,estamos principalmente interesados en saber si usted está en casa o la oficina, o tal vez elsupermercado. Así que vamos a utilizar la lectura menos precisos, como el GPS pueden ser

Page 241: Live code manual Español

Chapter 6

[ 165 ]

excesivos.

Page 242: Live code manual Español

Making a Reminder Application

[ 166 ]

Tiempo para la acción - probando el seguimientode localización nativa

Más adelante vamos a añadir una característica para permitir que el usuario de laaplicación para agregar a un conjunto de ubicaciones favoritas. Por el momento, sólotendremos que probar las funciones básicas. La ubicación no está disponible en lossimuladores, usted tendrá que probar esto en un dispositivo real.

1. Utilice la pila de prueba-rig desde arriba, y añadir un botón Ubicación Get y unubicación campo. Asegúrese de que el ubicación campo es tan ancha comola ventana de la tarjeta, sino que se muestra tres números largos.

2. Establecer la secuencia de comandos del botón a lo siguiente:en mouseUp

mobileStartTrackingSensor "ubicación", true

poner mobileSensorReading ("localización", false) en el campo"Ubicación"

mobileStopTrackingSensor

"ubicación" final mouseUp

3. La verdadero en la segunda línea es la que define a un "suelto" de valor, yestamos diciendo que no necesitamos la precisión del GPS. La falso en la terceralínea está diciendo queno necesitamos información detallada a devolver.

4. Vaya a Ajustes aplicación independiente, elegir el dispositivo de destino: iOS o Android.

5. Para iOS, ajuste Display Name, ID App interna y Perfil. Elige tu dispositivo, la versióndel SDK, y si se trata de ser una aplicación universal (ARMv6 es para los dispositivosmás antiguos y ARMv7 es para los nuevos dispositivos. ¿Para qué vale la pena,Apple se han reducido el apoyo a ARMv6).

Page 243: Live code manual Español

Chapter 6

[ 167 ]

6. Para Android, sistema de etiquetas, identificador y Mínimo versión de Android.

7. Además, en la parte Permisos de Aplicación de la configuración de Android,asegúrese de que usted ha pedido permiso para obtener la ubicación Grueso:

8. Seleccione Guardar aplicación autónoma e instalar la aplicación en sudispositivo. Siga la descripción en el Capítulo 2, Primeros pasos con LiveCodeMobile, si necesita un recordatorio de cómo hacer eso!

9. En la aplicación, pruebe la fecha de recogida y Pick tiempo botones para ver cómocriar a los controles nativos, a continuación, pulse el botón Ubicación Get. Tresnúmeros largos deben aparecer en el ubicación campo:

Page 244: Live code manual Español

Making a Reminder Application

[ 168 ]

¿Qué ha pasado?Como usted puede ver, hay muy poco código necesario para leer una ubicación! Si se tratabade una aplicación de seguimiento, entonces usted necesita para mantener el seguimientoabierto y tienen funciones para responder al cambio de mensajes de ubicación. Pero, paranuestra aplicación, sólo tenemos que saber dónde se encuentra en el momento de echar unvistazo a la lista de recordatorios.

Los números que se muestran en el campo de ubicación son la latitud, longitud y altitudde la posición del dispositivo. Pero ¿cómo vamos a usar esos números ...

Cálculo de la distancia entre dos puntos sobre la TierraEl plan consiste en ser capaz de ordenar la lista de recordatorios en orden de distanciadesde donde estás ahora mismo. Digamos que usted realmente utilizar esta aplicaciónmucho y tener docenas de recordatorios. El recordatorio que ha creado en comprar un pocode pan puede estar en la parte inferior de la lista, pero si ha asignado la ubicación delsupermercado para ese recordatorio, a continuación, ordenar la lista mientras usted estáfuera del supermercado deben traer los elementos de la lista de compras para el partesuperior.

Cuando nos enfrentamos a un problema como éste - cómo encontrar la distancia entre dospuntos en la Tierra - Google es un buen punto de partida! Se necesita muy poco paradorarching tiempo para encontrar esta página:

Page 245: Live code manual Español

Chapter 6

[ 169 ]

http://www.movable-type.co.uk/scripts/latlong.html

Page 246: Live code manual Español

Making a Reminder Application

[ 170 ]

El artículo se discute la fórmula original para hacer este cálculo, a continuación, se muestrauna función Javascript. Si le resulta difícil convertir la ecuación en manipuladores LiveCode,entonces usted debería ser capaz de convertir el Javascript, línea por línea, en elequivalente LiveCode.

No hay necesidad de escribir esto en apenas todavía, vamos a integrar más tarde. Perosi usted quiere tener un juego, pon estas líneas en el guión de pila:

función distancia lat1, lon1, lat2,

6371 Lon2 poner en r

poner toRad ((lat2-lat1)) en

dLat poner toRad ((Lon2-lon1))

en dLon poner toRad (lat1) en

lat1

poner toRad (lat2) enlat2

poner el pecado (dLat.2) * sin (dLat / 2) + sen (dLon /2) * sin (dLon / 2) *

cos (lat1) * cos (lat2) en un

poner 2 * atan2 (sqrt (a), sqrt (1-

a)) en c, introduzca r * c a d

volver

distancia

final d

función de retorno

Pangle toRad

pAngle/180 * PI

final toRad

Pruebe esto en el cuadro demensaje:

poner distancia (40, -74,51,0)

Como se muestra, debería ver un valor de 5645,48065. Los dos lugares están en algún lugar

Page 247: Live code manual Español

Chapter 6

[ 171 ]

cerca de Nueva York y Londres, y ese valor sería la distancia en kilómetros entre los dos,viajando a lo largo de la superficie de la Tierra.

Page 248: Live code manual Español

Making a Reminder Application

[ 172 ]

Pop Quiz - ¿Qué piso es mi apartamento?1.Examine la captura de pantalla anterior (el programado a las 6:53 PM), y teniendo en

cuenta la idea de que el edificio en el que vivimos no es tanto sobre el nivel delmar, lo que planta puedo vivir?

piso a.40th

b. 73 pisos por debajo de la

planta baja c.11th

d. Yo no tengo hogar

¿Qué?Estamos en el buen camino para saber cómo configurar la hora y fecha de la notificación derecordatorio a ocurrir, y será capaz de ordenar los recuerdos basados en la distancia de donde nosencontramos. Pero, ¿qué es la información exacta que necesitamos tener en el propio recuerdo?

Si esto fuera una aplicación de recordatorio de cumpleaños, entonces usted tendría quepreguntar por el nombre de la persona y la fecha de su cumpleaños. Si se tratara de unaaplicación de lista de la compra, entonces se necesita el nombre del tema y tal vez unacantidad. Para un contador de tiempo, usted tendría que hacer lo que el evento fue llamadoy un tiempo para el evento.

Aquí, sin embargo, estamos tratando de hacer una aplicación de recordatorio completamenteflexible, sino que sería hastapara el usuario para describir el artículo a su gusto. Así que sólo voy a pedir un título y una breveDescripción. También tendrá que ofrecer la opción de establecer una fecha, una hora, unasociadoubicación, y si un sonido de alerta se debe jugar o no.

Otra cosa a considerar es donde vamos a almacenar la información de la lista derecordatorios? Al hacer la aplicación WebScraper, se optó por duplicar la pila principal de laaplicación en el documentos carpeta, y para saltar entonces en esa copia de la pila. Estopermitió la posibilidad de guardar los cambios a la pila. La aplicación de recordatorios es un casosencillo; sólo estamos tratando de almacenar unas cuantas cadenas de texto para definir cadarecordatorio, y que sería más sencillo que escribir un archivo de texto.

Queremos permitir al usuario hacer una lista de lugares, de modo que un recordatorio puede serasociado con esa ubicación. En lugar de escribir un archivo de texto diferente, vamos a hacer laprimera pieza de información en cada entrada de la función de esa entrada. En estos momentos, lasúnicas dos funciones sonubicación y recordatorio. He aquí un ejemplo de lo que elarchivo de texto podría ser:

Ubicación Home40.692636 -73,978376

Page 249: Live code manual Español

Chapter 6

[ 173 ]

Ubicación Oficina 40.745194 -73,985199

Recordatorio

Packt Pida más tiempo! 1334548800 Casa falso

ReminderBossBuy lunch1334592000Office verdadero

Page 250: Live code manual Español

Making a Reminder Application

[ 174 ]

Entre cada elemento en una línea es un carácter de tabulación, que se utiliza para separarlas partes de la entrada. La estructura para una ubicación es como sigue:

Función - "Location"

Lugar de título

Latitud

Longitud

Para recordar, es el siguiente:

Función - "Recordatorio"

Título

Breve descripción

Notificación tiempo, en segundos desde la medianoche 01/01/1970

A Ubicación asociado con este recordatorio

Ya sea para jugar un sonido de alerta ("true" o "false")

Haciendo la aplicación recordatoriosOk, base suficiente! Vamos a empezar a hacer que la aplicación recordatorios. En lugar deagregar una característica a la vez junto con las secuencias de comandos, vamos a hacer lasdiferentes tarjetas que serán necesarios para crearInterfaz de la aplicación de usuario gráfica (GUI) primero, y después volver atrás y añadir losscripts.

Colocación de las tarjetasVamos a hacer la primera carta de la pila de ser un lugar donde se pueden ver los avisos actuales,ordenarlos por hora o el lugar, y añadir nuevos recordatorios y lugares. Entonces, vamos a hacer unasegunda tarjeta para entrar en los detalles de la ubicación, y una tercera tarjeta para entrar en losdetalles de un nuevo recordatorio.

Tiempo de acción - la creación de las pantallas de aplicaciones derecordatorio

Los pasos que se muestran aquí se van a utilizar los campos LiveCode estándar y losbotones, pero no dude en hacer su versión más atractivo!

1. Crear un nuevo Mainstack, darle un nombre de EasyReminder, y seleccioneGuardar. Otras opciones, como Recordatorios sencillos puede ser más

Page 251: Live code manual Español

Chapter 6

[ 175 ]

descriptivo, pero sería un nombre demasiado largo si usted está usando uniPhone.

Page 252: Live code manual Español
Page 253: Live code manual Español

Chapter 6

[ 171 ]

2. Ajuste el tamaño de la tarjeta con el tamaño de su dispositivo. Las pantallas quese muestran a continuación se basan en una pila de tamaño iPhone.

3. Ir a Ajustes aplicación independiente, y establecer los valores de la misma maneraque lo hicimos durante las pruebas de la función de localización.

4. Establezca el nombre de la primera carta que se casa.

5. Crea una Ordenar por Tiempo , una tecla Ordenar por Ubicaciónbotón, un campo denominado recordatorios, otro campo denominadodatos, y dos botones denominados Crear Recordatorio ... y Crearubicación ....

6. Agregar un botón más, de nombre Eliminar ubicación o Recordatorio.

7. Asegúrese de que ambos campos tienen su cuadro de texto Lock activada y No envuelvamarcada.

8. Usted debe tener algo similar a lo siguiente:

Page 254: Live code manual Español

Making a Reminder Application

[ 172 ]

9. Hacer una nueva tarjeta y asígnele el nombre ubicación.

10. Agregar un campo y establezca sus contenidos para decir: Introduzca lalatitud y longitud de esta localidad.

11. Agregue dos campos de entrada con nombre latitud y longitud.

12. Cree un botón llamado Ajuste a la ubicación actual.

Evite errores tipográficosAunque hemos puesto un campo para que escriba en la ubicación a mano,utilice el botón Set para ubicación actual, si es posible, o al menos el usoque en su ubicación actual para ver el formato que se requiere.

13. Añadir otro campo de instrucciones que dice: Escriba un nombre para estaubicación:.

14. Agregar un campo de entrada en tercer lugar, el nombre localización nombre.

15. Por último, añadir un botón denominado Añadir ubicación y uno llamadoCancelar.

16. Para obtener esta tarjeta, los tres campos tienen su cuadro de texto de bloqueo para estardesmarcado.

17. La tarjeta debe ser similar a la siguiente:

Page 255: Live code manual Español

Chapter 6

[ 173 ]

18. Haga una tercera carta y el nombre de recordatorio.

19. Agregue dos campos de instrucción que dicen: Escriba un título para esterecordatorio: y

Introduzca una breve descripción:.

20. Cree dos campos de entrada con nombre título y Descripción.

21. Cree tres botones denominados Establecer ubicación Conexas Configuraciónde la fecha, y Establecer hora.

22. Añadir tres campos próximos a los botones, los cuales se utilizarán para mostrar alusuario que la selección se hizo tuvo lugar. Nombre de los campos ubicacióndel campo, Fecha de campo, y tiempo en el campo.

23. Cree un botón llamado casilla de verificación Reproducir sonido de alerta.

24. Por último, cree dos botones más nombrados Agregar aviso y Cancelar.

25. Organizar todos estos elementos para aparecer como sigue:

Page 256: Live code manual Español

Making a Reminder Application

[ 174 ]

¿Qué ha pasado?Hemos hecho todas las pantallas necesarias para que la aplicación funcione. Esa fue la parte fácil.Espera a ver la cantidad de mecanografía le vamos a hacer!

Pila de secuencias de comandos de nivelHay un poco de código por delante. Describiendo lo tienen por característica implicaríasaltar por todo el lugar, añadiendo a los guiones existentes en algunos casos, por lo quesería fácil perderse. Así que en lugar de hacerlo de esa manera vamos a ver el código decada tarjeta a la vez, y también a los controladores que entran en el guión de pila. Semuestra aquí en "La hora de la acción" pedazos, sobre todo para darle un descanso de vezen cuando! Así que sin más preámbulos, el guión Stack ...

Tiempo para la acción - la adición de funciones de nivel de pilaPara esta aplicación, vamos a poner un poco de la lógica de los botones en las propias tarjetas,pero todavía deja una buena cantidad que entra en el guión de pila. Para que sea menosabrumador, mostraremos una o dos funciones a la vez seguido de una explicación acerca decualquierpuntos interesantes.

1. Abra el script de pila.

2. Escriba los controladores siguientes:en OpenStack

si la plataforma es "iphone" iPhoneSetKeyboardReturnKey entonces"Done"

ReadData

showData

final OpenStack

en el enfoque

returnInField en

nada

final returnInField

Android OS teclados generalmente tienen un botón dedicado a poner elcontrol del teclado. Sin embargo, ese no es el caso en iOS; el botón que seencuentra en la Volver clave debería ser posible que tenga lugar una palabraespecial, tales comoEnviar, o Hecho. Lamentablemente, en la introducción de texto en los campos que soncapacestener un carácter de retorno. Para resolver este problema, establezca la Volverbotón Hecho decir, lo que llevará al usuario a esperar el teclado para que

Page 257: Live code manual Español

Chapter 6

[ 175 ]

desaparece cuando se presiona el botón. También atrapar elreturnInField mensaje, y usar eso como una manera de ponerrealmente el control del teclado.

Page 258: Live code manual Español

Making a Reminder Application

[ 176 ]

3. A continuación, escriba las funciones que va a leer y escribir la lista de recordatorioscomo un archivo de texto en el documentos carpeta en su dispositivo:en WriteData

mundial gReminderData

poner specialFolderPath ("documentos") & "/ reminders.txt"en tRemindersPath

gReminderData si está vacía, entonces escriba "hayentradas" en gReminderData

tRemindersPath archivo abierto

escribir gReminderData presentar

tRemindersPath tRemindersPath cerrar el

archivo

clearnotifiers

setupnotifiers

final WriteData

en ReadData

mundial gReminderData

poner specialFolderPath ("documentos") & "/ reminders.txt"en tRemindersPath

si hay un archivo tRemindersPath a

continuación, abra el archivo

tRemindersPath

leer tRemindersPath archivo hasta

cerrar el archivo eof tRemindersPath

lo puso en otro

gReminderData

tRemindersPath archivo abierto

escriba "hay entradas" para presentar

tRemindersPath tRemindersPath cerrar el

archivo

poner "hay entradas" en el extremo

gReminderData si

final ReadData

Estas dos funciones están usando la habilidad sencilla que LiveCode tieneque leer y escribir archivos de texto. Observe que aunquespecialFolderPathse está utilizando para ayudar a calcular dónde el archivo se guardará.Funciona incluso cuando las pruebas en las máquinas de escritorio. Eldiccionario LiveCode muestra una lista completa de las rutas de las carpetasespeciales, incluyendo muchos que no se aplican a aplicaciones móviles.

4. La showData función bien podría haber sido puesto en el Casa tarjeta Tarjeta

Page 259: Live code manual Español

Chapter 6

[ 177 ]

guión, pero tenerlo en el Apilar nivel se mantiene cerca de otras funciones quese relacionan. Escriba en este momento.en showData

mundial gReminderData

Page 260: Live code manual Español

Making a Reminder Application

[ 178 ]

tarjeta ir "a casa"

puesto vacío en el terreno "recordatorios"

poner en gReminderData campo "datos"

si gReminderData = "hay entradas" y

luego salir showData

End If

establecer el itemdelimiter

a poner una ficha en

tLineNumber

repetir con a = 1 para el número de líneas en

gReminderData poner una línea de gReminderData en

Tentry

si el artículo 1 de Tentry =

"Recordatorio" y luego poner el

punto 2 del Tentry en TTITLE

poner el tema 3 de Tentry en tDescription

poner el tema 4 de Tentry en tNotificationTime

convertir tNotificationTime de segundos a tiempoabreviado y fecha larga

poner el tema 5 del Tentry en tLocationName

poner TTITLE & ":" && && tDescription && tNotificationTimetLocationName en tLineNumber línea de campo

"recordatorios" para añadir un tLineNumber

End If

final de

la

repetición

finalshowData

Si recuerdan el archivo de texto de ejemplo de antes, la showDatafunción está teniendo cada línea y la división de los elementos TABdelimitado en trozos de información para presentar al usuario. Un trucolindo es que el tiempo de notificación, que es un número largo desegundos, se convierte en un formato legible por humanos, que muestratanto la fecha y hora de la notificación. La datos campo se utiliza paramostrar los datos en bruto que se ha grabado. En la aplicación final queno se repite el mensaje, pero es útil para comprobar si la información escorrecta recordatorio.

5. Las últimas funciones en la Apilar script son para configurar las notificaciones de símismos.

en mobileCancelAllLocalNotifications

clearnotifiers

clearnotifiers finales

Page 261: Live code manual Español

Chapter 6

[ 179 ]

en setupnotifiers

mundial gReminderData

si gReminderData = "hay entradas" y luego salir

setupnotifiers establecer el itemdelimiter a la pestaña

repetir con a = 1 para el número de líneas en

gReminderData poner una línea de gReminderData en

tEntryDetails

Page 262: Live code manual Español

Making a Reminder Application

[ 180 ]

si el artículo 1 de tEntryDetails = "Recordatorio", entonces

poner punto 2 del && tEntryDetails "-" elemento&& 3 de tEntryDetails en alertBody

poner en "Aceptar" enalertButtonMessage

poner en tEntryDetails alertPayload

poner el tema 4 de tEntryDetails en

alertTime poner el tema 6 de tEntryDetails

en mobileCreateLocalNotification

reproducirSonido alertBody,alertButtonMessage, alertPayload, alertTime, reproducirSonido

End If

final de

la

repetición

setupnotifiers finales

en pMsg localNotificationReceived

responder "Notificación Local:" el

fin && pMsg localNotificationReceived

Muchas aplicaciones móviles que utilizan notificaciones no siempreborrarlos. En general, a lo mejor no tiene que ser limpiado, una vez quepasan se han ido para siempre! Bueno, no siempre. A veces, usted irá auna aplicación justo por delante decuando una notificación de que va a pasar, y hacer la tarea, para luego sermolestado con notificaciones acerca de algo que ya hizo! En nuestraaplicación,que borrar todas las notificaciones que fueron vencidos y volver a crear lalista completa de nuevo. De este modo, cualquier notificación que hayaeliminado no volverá en tu contra después. Para ayudar en la depuración,alertPayload se completa con la entrada recordatorio entero, y semostrará a usted cuando entra en juego la notificación

¿Qué ha pasado?Además de conseguir tus dedos bien caliente, que ha introducido todas lasfunciones para leer y escribir los datos del recordatorio, y para la creación y larecepción de los mensajes de notificación.

Scripts de inicio de tarjetasNo vamos a poner las secuencias de comandos en el nivel de la tarjeta, sino que sólo puedeestar dentro de los distintos botones, empezando por los de la primera tarjeta.

Page 263: Live code manual Español

Chapter 6

[ 181 ]

Tiempo para la acción - lo que los botones de la tarjeta de trabajo adomicilio

El guión Ordenar por botón de ubicación no es poco. Usted debe mirar hacia adelante aeso! Pero primero, vamos a empezar con el botón Ordenar por Hora.

1. Edite el script del botón Ordenar por Time, en la primera carta.

2. Escriba en este controlador de resumen:en mouseUp

mundial gReminderData

establecer el itemdelimiter a la pestaña

tipo numérico gReminderData por el tema 4 de

cada showData

WriteData

final mouseUp

LiveCode comando de clase es de gran alcance, y en el caso anterior,se ordenar la lista de recordatorios basado en el valor denotificación segundos. Una vez que las líneas están ordenados, lalista para que el usuario ve es recreado,y el archivo de texto se reescribe.

3. Cómo prepararse mentalmente y luego editar el script del botón Ordenar por Ubicación.

4. Escriba en todo esto:en mouseUp

mundial gReminderData

mobileStartTrackingSensor "ubicación",

true

poner mobileSensorReading ("localización", false) en

tLocation mobileStopTrackingSensor "ubicación"

establecer el itemdelimiter a coma

poner el tema 1 de tLocation en

TLAT poner punto 2 del tLocation

en tlong establecer el

itemdelimiter a la pestaña

tipo numérico gReminderData por GetDistance (TLAT, tlong,punto 5 de cada uno)

showData

WriteData

final mouseUp

Page 264: Live code manual Español

Making a Reminder Application

[ 182 ]

función GetDistance Plat, submarinismo natación, pLocName

si pLocName está vacía luego regresar

1000000 gReminderData mundial

puesto vacío en TLAT

Page 265: Live code manual Español

Chapter 6

[ 183 ]

puesto vacío entlong

repetir con a = 1 para el número de líneas en

gReminderData si el artículo 1 de tEntryDetails =

"Ubicación", entonces

si el artículo 2 de tEntryDetails pLocName

= a continuación, poner el tema 3 de

tEntryDetails en TLAT poner el tema 4

de tEntryDetails en tlong

End If

End If

Fin derepetición

TLAT si está vacía, entonces volver

1000000000 distancia retorno (TLAT,

tlong, Plat, Plong)

final GetDistance

función distancia lat1, lon1, lat2,

6371 Lon2 poner en r

poner toRad ((lat2-lat1)) en

dLat poner toRad ((Lon2-lon1))

en dLon poner toRad (lat1) en

lat1

poner toRad (lat2) enlat2

poner el pecado (dLat / 2) * sin (dLat / 2) + sen (dLon /2) * sin (dLon / 2) *

cos (lat1) * cos (lat2) en un

poner 2 * atan2 (sqrt (a), sqrt (1-

a)) en c, introduzca r * c a d

volver

distancia

final d

función de retorno

Pangle toRad

pAngle/180 * PI

final toRad

La primera parte de la mouseUp controlador es sólo conseguir la ubicación actual.La distancia y toRad las funciones son las mismas que vimos antes.La magia sucede en la forma en que la línea de clasificación utiliza una función paradeterminarel orden de clasificación. Con la aprobación de la ubicación que se asocia con cadarecordatorio

Page 266: Live code manual Español

Making a Reminder Application

[ 184 ]

en la GetDistance función, es posible ejecutar a través de la lista delugares para encontrar una coincidencia, y luego usar esa ubicación latitud ylongitudpara medir la distancia desde su ubicación actual. Esa distancia es entoncesutilizado por el comando de clase para decidir el orden de las líneas.

5. Para relajarse un momento de editar el recordatorio ... Crear script de botón, y lapuso a lo siguiente:en mouseUp

Ir a la ficha mouseUp

"recordatorio" end

Page 267: Live code manual Español

Chapter 6

[ 185 ]

6. Del mismo modo, ajuste la opción "Crear Location ..." script botón para esto:en mouseUp

Ir a la ficha mouseUp

"ubicación" final

7. Última guión para esta tarjeta, edite la ubicación Eliminar o script botónReminder, y escriba lo siguiente:en mouseUp

mundial gReminderData

mobilePick gReminderData, 1, "marca", "cancelDone",

"recogedor" poner el resultado en tItemsToDelete

si tItemsToDelete = "0" y luego salir

mouseUp establecer el itemdelimiter de

coma

repetir con a = el número de elementos en tItemsToDelete hasta

1 línea delete (punto A de tItemsToDelete) de gReminderData

Fin de repetición

gReminderData si está vacía, entonces escriba "hayentradas" en gReminderData

showData

WriteData

final mouseUp

La borrar controlador utiliza mobilePick con un conjuntoparticular de parámetros. Un parámetro interesante es marca deverificación. El pedir ese tipo de selector se mostrará una listacon casillas de verificación que cuando está en el iPad o Android. Estopermitirá elegir varias entradas a borrarde una sola vez. Por lo tanto repetir el bucle que recorre tantosartículos como usted eligió.

¿Qué ha pasado?Si todo va bien, se ha recuperado por ahora, después de tratar de entender el tipo defunción de localización! Usted puede ver por lo menos lo difícil del guión Stack habría sidosi todo este código se había colocado en esa ubicación. Vamos a pasar a la siguiente carta...

Creación de una ubicación de la tarjetaEl siguiente paso es la tarjeta que vamos a mostrar cuando el usuario toca la Creación ...Localización botón en la primera carta.

Page 268: Live code manual Español

Making a Reminder Application

[ 186 ]

Tiempo de acción - haciendo el trabajo de la tarjeta ubicaciónLa tarjeta tiene tres campos Vivo en el mismo, para la latitud, longitud, y un título para laubicación. El usuario también puede escribir en los detalles de forma manual, pero si llegana estar en el lugar en cuestión hay un botón hay que agarrar la ubicación y rellenar losnúmeros de forma automática.

1. Edite el script del botón Set para ubicación actual, y escriba las siguientes líneas:en mouseUp

mobileStartTrackingSensor "ubicación", true

poner mobileSensorReading ("localización", false) en

tLocation mobileStopTrackingSensor "ubicación"

establecer el itemdelimiter a coma

si el número de elementos en tLocation = 3 entonces

poner el tema 1 de tLocation en el campo

"latitud" poner punto 2 del tLocation en el

campo "longitud"

End If

End mouseUp

2. Nada demasiado complicado allí, la ubicación se agarró y la latitud y longitudentradas se almacenan en los dos campos.

3. Edite el script del botón Cancel, y el cambio a este script sencillo:en mouseUp

Ir a la ficha

mouseUp "hogar" end

4. Último artículo de esta tarjeta; editar el script Ubicación botón Agregar y escriba losiguiente:

en mouseUp

mundial gReminderData

si el campo "Nombre de ubicación" está vacío,

responde "Por favor, introduzca un nombre para

esta ubicación." salir mouseUp

End If

si el campo "latitud" está vacío o campo "longitud" está vacío,

responda con "Por favor, introduzca los valores de

localización, o pulse el botón SET 'paraUbicación actual "botón".

salida final

mouseUp si

poner "Location" y ficha y campo "Nombre de ubicación" & tab ycampo

Page 269: Live code manual Español

Chapter 6

[ 187 ]

"Latitud" y ficha y campo "longitud" en tLocationDetails

si gReminderData = "hay entradas" y luego

poner en tLocationDetails gReminderData

más

Page 270: Live code manual Español

Making a Reminder Application

[ 188 ]

poner retorno y tLocationDetails después del

final gReminderData si

Ir a la ficha

"casa" showData

WriteData

mouseUp

final

5. La mayor parte de ese controlador es simplemente verificar que elusuario haya introducido la información requerida.

¿Qué ha pasado?Mucho menos que ocurrió en la primera tarjeta! Pero era igualmente importante. Ahoratenemos una manera para que el usuario pueda configurar una ubicación para ser utilizadopor los recuerdos que han creado. Y ahí es donde nos dirigimos ahora ...

Recordatorio formulario de inscripciónEsta última carta es esencialmente un formulario de inscripción, sólo queremos preguntarle alusuario cuál es el recordatorioes para. Hay algunos aspectos difíciles a él sin embargo, y una o dos funciones extensas parahacer frentecon eso.

Tiempo de acción - teniendo en información sobre el recordatorioLa tarjeta de recordatorio hace un buen uso de los recolectores. Hay poca escribiendo para que elusuario lo hace,y porque van a recoger una entrada de una lista que se presenta, hay una buena probabilidad delainformación no tendrá ninguna errata en él!

1. Edite el script del botón Set relacionada con la localización y el tipo de lassiguientes:

en mouseUp

mundial gReminderData

puesto vacío en tLocations

establecer el itemdelimiter

a poner una ficha en

tLineNumber

repetir con a = 1 para el número de líneas en

gReminderData si el artículo 1 de la línea de un

gReminderData = "Ubicación", entonces

Page 271: Live code manual Español

Chapter 6

[ 189 ]

poner punto 2 a 4 de la línea de gReminderData entLineNumber línea de tLocations

Añadir 1 al final si

tLineNumber

Fin de repetición

tLocations si está vacío,

responde "Usted necesita agregar una ubicación."

Page 272: Live code manual Español

Making a Reminder Application

[ 190 ]

más

mobilePick tLocations, 1

poner el resultado en

tChosenLocation si tChosenLocation>

0 entonces

poner el punto 1 de la línea de tChosenLocationtLocations en "campo de ubicación" campo

End If

End If

finalmouseUp

Hemos creado la primera palabra de cada línea en los datos de recordatorios a cualquieraUbicación o Recordatorio. Aquí hay un lugar dondese hace uso de ello. Una vez que saque las líneas que sonUbicación, presentarlos dentro de un selector es fácil dehacer.

2. Edite el script del botón Establecer fecha, y el cambio a este fácil de entender script:en mouseUp

mobilePickDate "fecha"

poner el resultado en

tDate tDate convertir a

segundos

tDate poner en el campo de

mouseUp "campo de fecha de" fin

3. Establecer la secuencia de comandos del botón Establecer hora para este script casiidéntico:

en mouseUp

mobilePickDate "tiempo"

poner el resultado en

TTIME TTIME convertir a

segundos

TTIME poner en el campo de

mouseUp "campo de tiempo" final

4. El guión del botón Cancelar es el mismo ya que está en la tarjeta de Ubicación:en mouseUp

Ir a la ficha

mouseUp "hogar" end

5. Por último, y lejos de ser menos, el guión Recordatorio botón Agregar hace todo el

Page 273: Live code manual Español

Chapter 6

[ 191 ]

trabajo duro.en mouseUp

mundial gReminderData

si el campo "título" está vacío o el campo "descripción" está

vacío, responda con "Por favor, introduzca un título y una

descripción."

salir mouseUp

Page 274: Live code manual Español

Making a Reminder Application

[ 192 ]

End If

poner "false" en tDoAlert

si el hilite de botón "Play Sound Alert" y luego poner "true"en tDoAlert

poner de campo "campo de fecha" en

tDateValue poner campo "campo de hora"

en tTimeValue

convertir tTimeValue de segundos a corto

plazo convertir a segundos tTimeValue

poner de campo "campo de tiempo" - tTimeValue en

tTimeValue add tTimeValue a tDateValue

poner "Recordatorio" y ficha y campo "título" y ficha y campo"Descripción" en tReminderDetails

poner tReminderDetails & Tab y tDateValue & ficha y campo"campo de ubicación" y en la ficha tReminderDetails

poner tReminderDetails & Tab y tDoAlert en tReminderDetails

si gReminderData = "hay entradas" y luego

poner en tReminderDetails gReminderData

más

poner retorno y tReminderDetails después del

final gReminderData si

Ir a la ficha

"casa" showData

WriteData

final mouseUp

La mayor parte de la secuencia de comandos es simplemente lacombinación de los diferentes bits de información junto a la entrada unrecordatorio, la delimitación de las zonas con un carácter de tabulación.Pero hay un poco de aritmética lindo pasando ahí también. Al comienzo de estecapítulo, nos fijamos en cómo se diferencia de tiempo Unix tiempo real a unavelocidad de 0,6 segundos por año. Si desea programar una notificación a las 8am en cinco años a partir de ahora, entonces usted no puede tomar el valorque el botón Set Time le dio, ya que se refiere a la actual 8 am. No se puedetomar el valor que le dio Establecer fecha, porque eso sería medianoche. Por lotanto, al convertir el valor de tiempo en formato de fecha corta, y luego devuelta a formato segundo, averiguar lo que el tiempo Unix fue en lamedianoche del día actual. Restando que a partir del valor que le dio Set Timele permite conocer el número de segundos transcurridos desde la medianoche,sin importar cuántos segundos detrás del tiempo Unix es. Adición de ese valor ala de Set Date nos dará una exacta segundo Unix para notificar que seproduzca. En iOS, hay un tipo de selector que le permite ajustar la fecha y lahora juntos, pero como que no está en Android, hemos utilizado una forma quefuncione para ambos.

Page 275: Live code manual Español

Chapter 6

[ 193 ]

¿Qué ha pasado?¡Uf! Llegamos a la final! Intente ejecutar la aplicación en su dispositivo. Si tus dedos no sondemasiado entumecido que es! Honestamente, usted puede apostar una fortuna que nofunciona la primera vez, pero si funciona lo suficientemente bien como para mostrar el textosin formato en el campo de datos en la primera tarjeta, es de esperar que será capaz delocalizar cualquier error en la código. También puede escribir algunos datos de pruebadentro de la pila en el equipo y por lo menos probar las funciones que no requierencaracterísticas específicas del dispositivo.

Tener un héroe go - transiciones agradablesEn realidad, si se las arregló para pasar por entrar todo ese código hasta el punto en que laaplicación está funcionando, ya eres un héroe! Sin embargo, lea la sección en el iOS y Androidnotas de la versión para LiveCode acerca de la compatibilidad de efectos visuales. A ver si puedesconseguir algunas transiciones típicas sistema operativo móvil que ocurren a medida que avanzahacia y desde las diferentes tarjetas. Si decide utilizar MobGUI como una manera de hacer que laaplicación vea más bonita, entonces eche un vistazo en sus scripts por defecto del botón, haycomentada líneas que pueden ayudarle a empezar con la realización de transiciones agradables.

ResumenEste capítulo fue mucho más emocionante de lo esperado! Una aplicación de recordatoriosno es absolutamente tan impresionante como Angry Birds, pero, haciendo uso de lascaracterísticas de ubicación de un dispositivo móvil hecho novela un poco más. A lo largode la manera en que incursionó con estas cosas:

Lectura y escritura de datos en el especial documentos carpeta

El uso de selectores para las listas de sencillos, fechas y hora

Lectura de la ubicación actual del dispositivo

Creación de eventos de notificación locales

En el mejor de los casos, usted puede llegar a hacer una aplicación móvil en unas pocashoras o días, pero no hay mucho que pasa antes de poder enviar la aplicación a las tiendasde aplicaciones diversas. Suena como un buen tema para el próximo capítulo!

Page 276: Live code manual Español

Making a Reminder Application

[ 194 ]

Page 277: Live code manual Español

7Implementar en su dispositivo

No deje todo para ti!

Herramientas como LiveCode se puede utilizar exclusivamente para aplicaciones de productividadpersonal, y sería más que pagar por sí mismos en el tiempo que le ahorrará todos los días. Pero, ¿porqué no dejar que el resto del mundo se benefician de sus creaciones!

Hasta ahora, hemos creado varias pequeñas aplicaciones de perforación de prueba, y unoscuantos más seres concretarse. En todos los casos, sin embargo, sólo hemos probado estossimuladores en el interior o en el dispositivo personal. Ha llegado el momento de sacarlo amás personas, para las pruebas beta en un primer momento, y luego para subir a las tiendasde aplicaciones diferentes.

En este capítulo se incluirán los siguientes puntos:

Examine todos los ajustes independientes de aplicaciones opcionesrelacionadas con la creación de aplicaciones móviles

Crear compilaciones de una aplicación de modo que pueda ser enviado a los probadoresbeta

Construir una versión final de distribución de una aplicación

Revise cómo cargar aplicaciones para iOS App Store, AppStore Amazony Google Play

Hay algunas etapas en la creación de aplicaciones para iOS para la AppStore que tiene que llevarse a cabo en un Mac, y así todos los pasosdescritos aquí para iOS se deben seguir usando un Mac. Los pasos deAndroid pueden aplicar para Mac o Windows. Tenga en cuenta tambiénque este capítulo es más de una referencia, y no un tutorial práctico.Cuando usted tiene una aplicación que se está preparando para completary enviar a las tiendas de aplicaciones, y te encuentras con un punto defricción, esperemos que recuerdo haber leído sobre el tema en algún lugarde este capítulo!

Page 278: Live code manual Español

Deploying to Your Device

[ 188 ]

Configuración de aplicaciones independientesYa ha estado en la configuración de un par de veces ya, pero sólo hemos hecho el número mínimo de cambiosnecesarios con el fin de probar la aplicación. Hay un montón de opciones en allí que usted tendrá que llenarantes de su aplicación está lista para ser vendida en una tienda de aplicaciones. Realizaremos una breve repasarlas secciones de aplicación independientes de, y luego entrar en más profundidad con el Android y iOSsecciones.

GeneralLa sección general de los ajustes independientes se usa principalmente para controlar quécaracterísticas de LiveCode se van a incluir en una aplicación independiente de escritorio.Esas opciones no se aplican a las aplicaciones móviles, pero está en la sección general queestablezca el nombredel expediente de solicitud, así como la carpeta de compilación (los temas de interés seencuentran en la parte superior e inferior del cuadro de diálogo):

Page 279: Live code manual Español

Chapter 7

[ 189 ]

StacksLa sección de Stacks le mostrará una lista de las pilas que ya están incluidas en su proyecto.Eso, por supuesto, incluyen el Mainstack actual, y también incluirá las pilas que han sidoagregadas por los plugins como MobGui. Todas las opciones se atenuarán.

Copiar archivosEn la sección Copia de archivos se utiliza para agregar los archivos y carpetas adicionalespara ser utilizados por la aplicación. Estos van a ser archivos de sólo lectura, si ustednecesita los archivos modificables aún se podía incluir esos archivos aquí, y luego escribir lascopias de los archivos en la carpeta de documentos especial. Así es como se ve el cuadro dediálogo con las carpetas de imágenes y sonidos añadidos:

iOSEl Mac, Windows, Linux, Web, y las secciones de los informes de error no se utilizan al realizar iOSy aplicaciones de Android, así que ahora vamos a echar un buen vistazo a la sección de iOS, poco apoco ...

Page 280: Live code manual Español

Deploying to Your Device

[ 190 ]

Construir paraLa construcción para la configuración de dispositivos iOS determinar que la aplicación va atrabajar, y lo que la versión mínima de iOS tiene que ser. Al decidir qué elegir, hay cosasque son obvias y otras no son tan obvias. Si usted está haciendo una aplicación querealmente necesita una gran área de espacio de trabajo, entonces no puede ser muyexitoso en un iPod o en la pantalla del iPhone. Si se trata de una pequeña utilidad que estáorientada a su uso en un dispositivo portátil, tal vez usted no necesita tener una versiónpara iPad. Usted es capaz de elegir el iPod, iPhone y iPad, o simplemente para iPod yiPhone, y aunque sólo sea iPad.

La versión mínima de iOS que usted elija puede depender de las particularidades que hautilizado. Usted no desea que los usuarios podrán comprar su aplicación sólo para encontrarque una cierta característica no funciona correctamente en su versión anterior iOS. Puedeque tenga que mantener algunos dispositivos, configurados para utilizar versiones antiguasdel sistema operativo, para probar así que usted puede estar seguro de que su configuraciónes correcta. Además, Xcode te permite descargar varias versiones del simulador, y enLiveCode puede elegir una versión específica para realizar la comprobación.

La última selección es el procesador utilizado en el dispositivo. Sus opciones son v6Universal, brazo, y el brazo v7. Estos se refieren a conjuntos de instrucciones utilizado en losprocesadores móviles. En iOS, las cosas son más sencillas que en Android, ya que losprocesadores se denominan ARMv6 o ARMv7. Con Android, hay muchos más tipos deprocesadores, y puede tomar un poco de investigación para averiguar qué conjunto deinstrucciones se utiliza para un procesador determinado.

Manzana mismos han abandonado el soporte para ARMv6. versión iOS 4.3 y posteriorrequiere ARMv7. Los dispositivos que son ARMv7 son los iPhones desde el 3GS y el iPodTouch desde la 3 ª generación, a excepción de la versión de 8GB de la 3 ª generación, queaún estaba ARMv6. Usted puede tener una aplicación que funciona bien incluso en el iPhoneoriginal, pero si usted tiene alguna duda acerca de cómo se va a realizar, eligiendo Arm v7puede ser una buena idea. También puede elegirun mínimo iOS 4.3 o versión posterior, o incluso 5.0 o posterior. Algunas de lascaracterísticas del navegador web funciona mejor después de iOS versión 5.0 fuelanzado.

Siempre se puede dejar estas opciones establecidas a valores más bajos por ahora, y tomar una decisión despuésde haber oído cómo sus beta testers se llevaba bien con la aplicación.

Page 281: Live code manual Español

Chapter 7

[ 191 ]

Aquí está la construcción para el área de los valores, así como los menús que puede elegir:

Configuración básica de aplicaciónHemos utilizado algunos de estos valores un par de veces ya. Éste es el conjunto completo de opciones:

Mostrar el nombre: el nombre que aparecerá bajo el icono en el dispositivo real

Versión: el número de versión que aparece en la descripción de iTunes para la aplicación

Interior App ID: el ID de aplicación que utilizó en el Portal iOS Developer hora dehacer el desarrollo o el perfil de distribución de aprovisionamiento

Perfil: el perfil de datos que coincide con esta aplicación

Externos: un conjunto de archivos de comandos opcionales externos quepueden haber utilizado en su aplicación

Usted debe probar diferentes nombres de visualización para ver cómo se ve en los dispositivos. Hay un límitepara cuánto tiempo el nombre puede ser antes de iOS trunca el nombre, la colocación de elipses en el mediodel texto. Para el iPhone que es de aproximadamente 11 o 12 caracteres.

Es importante asegurarse de que la actualización de una aplicación que envía deberántener un número de versión es posterior a la aplicación existente. A partir de las marcas1.0.0 sentido, recuerda a aumentar el número cuando usted hace sus actualizaciones. Note preocupes, si te olvidas de que se encuentra el proceso de subida a la App Store fallará!Las tiendas de aplicaciones en general requieren que la actualización sea una versiónposterior a la que está siendo reemplazado.

Para fines de desarrollo se puede utilizar un perfil de datos que utiliza un ID de aplicacióninterna que contiene un comodín. Al hacer presentar una aplicación para iOS App Store,asegúrese de que el archivo de suministro es una Distribución, y que el ID de aplicación queutiliza coincide exactamente con el ID de aplicación interna. También, asegúrese de que el IDes diferente a cualquier otra aplicación que tenga enla tienda. Tenga en cuenta sin embargo que el ID como se muestra en la página de cuentade desarrollador mostrará los dígitos adicionales en el inicio de la ID, por ejemplo:31415926.com.yourname.yourappname. La App ID coincidente interna sería

Page 282: Live code manual Español

Deploying to Your Device

[ 192 ]

com.yourname.yourappname.

Page 283: Live code manual Español

Chapter 7

[ 193 ]

En la imagen siguiente ejemplo, un archivo de aprovisionamiento de desarrollo que se elija,y también hay comandos externos utilizados fueron:

IconosUsted es capaz de seleccionar un icono diferente para cada tipo que iOS y iTunes requieren. El área de iconos esfácil, haces clic en el botón ... y seleccione el archivo de su sistema de archivos. Sería posible que LiveCode tomaruna imagen de gran tamañoy para crear los distintos tamaños para usted, pero no es una opción para eso! Porsi sirve de algo, puede que tenga razones para mostrar unaicono diferente para cada caso. Por ejemplo, usted podría hacer un icono para las pantallasRetina que tenían más detalle en lo que se podía ver en una pantalla no Retina. Como ustedno tiene una opción, simplemente disfrutar de la flexibilidad que esto te da!

Observe la casilla de verificación Icono prerendered. Usted tiene la opción de crear unicono exactamente como debe aparecer en los dispositivos. O bien, puede producir unicono cuadrado sin sombra, y deje el sistema para que se vea como un botón con unefecto de relieve. Echa un vistazo a los diferentesaplicaciones en sus dispositivos, usted encontrará que algunas personas estaban felices deusar biselado de Apple aspecto resaltado, y otros prefirieron hacer sus propias cosas. Lafunción del icono prerendered le permite hacer su propia cosa. En esta captura de pantallase puede ver que los iconos de todastipos han sido seleccionados, incluso Retina iPad, y que no están pre-prestados:

Page 284: Live code manual Español

Deploying to Your Device

[ 194 ]

Pantallas de bienvenidaDesde el primer iPhone, iOS ha tenido la capacidad de cargar y mostrar una pantalla deinicio de inmediato cuando un usuario toca un icono de aplicación. Esto les da algo paramirar mientras la aplicación se está cargando. Todo lo que se necesitaba en esos días erauna imagen predeterminada, y tenía un nombrede Default.png. Cuando el iPad llegó ahora había una necesidad de pantallas de iniciomás. Por lo menos se necesitaba una resolución de imagen mayor defecto, pero también senecesitan imágenes personalizadas para el paisaje, incluso yendo tan lejos como para tenerimágenes diferentes en función del paisajede si el botón de inicio es el lado izquierdo o lado derecho.

LiveCode no da acceso a ese nivel de flexibilidad, pero es muy raro que una aplicación senecesita un paisaje diferente para las dos variantes, por lo general puede llegar a funcionarcon sólo una. Lo mismo para la variación retrato al revés, la imagen predeterminada retratoregular puede ser utilizado para eso también.

Las pantallas Retina tienen sus propias entradas para configurar la pantalla de inicio, y porconvención, los archivos que tienen nombres que incluyen una @ 2x parte del nombre.

Cuál de las opciones de la pantalla emergente se activan depende de las opciones de orientación,como se describe en la siguiente sección. En esta captura de pantalla, las opciones Retratos iPadaparecen en gris,ya que la aplicación está dispuesto a ser único paisaje:

Usted puede notar que no hay un retrato iPhone u opción paisaje. Esto se debe a laDefault.png seutiliza para ambos. Si su aplicación es sólo paisaje, para luego diseñar la pantalla debienvenida como paisaje, sino girar la imagen 90 grados hacia la derecha para create a320x480 o 640x960Default.png o [email protected] imagen.

Page 285: Live code manual Español

Chapter 7

[ 195 ]

Opciones de orientaciónComo se mencionó anteriormente, usted es capaz de especificar qué orientaciones seapoyan en su aplicación. Si la aplicación es sólo para el iPod y el iPhone, sólo se puedeestablecer cuál es la orientación inicial. Las opciones son Portrait, Retrato Upside-Down,Left Paisaje, Paisaje y derecha. Si es para iPad, entonces también se puede establecer quelas orientaciones son compatibles mientras que la aplicación está en uso. Las opciones queseleccione afectará a lo que los iconos se pueden importar. Las orientaciones se ajustan conun solo menú desplegable y casillas de verificación cuatro:

Esquema de URL personalizadaA veces, cuando se utiliza un dispositivo iOS te va a tocar una URL en una página web, y depronto te encontrarás en el correo, o mirando una página en la App Store. Esto se logramediante el uso de un esquema de URL personalizado. En el caso de la App Store, losenlaces comienzan con ITMS-apps :/ /, y desde ese iOS sabe que el enlace debe abrirse en laApp Store app. Usted puede hacer lo mismo con su aplicación. Al establecer una cadenapersonalizada similar a continuación, puede obtener iOS para abrir la aplicación cuando elusuario toca un enlace que comienza con la misma cadena en la URL. El valor de la cadena seintroduce con un campo de entrada de texto simple como se muestra en la siguiente capturade pantalla:

Requisitos y restriccionesAntes hemos hablado de cómo configurar el dispositivo, el conjunto de instrucciones delprocesador y la versión del iOS, es una manera de asegurarse de que los usuarios son capacesde utilizar las características de su aplicación. Los requisitos y las opciones de restriccionespermiten especificar con gran detalle lo que las capacidades del dispositivo debe tener. Por lomenos, si usted tiene una aplicación que consiste en tomar fotografías, lo que requiere unacámara podría ser una buena idea! Si se trata de una aplicación de chat de vídeo, lo querequiere una cámara frontal tendría sentido. La aplicación de recordatorios que hicimos en elcapítulo anterior debe tener su opción Servicios de ubicación seleccionado, para asegurarse

Page 286: Live code manual Español

Deploying to Your Device

[ 196 ]

de que el tipo de función de distancia podría funcionar. Aquí está la lista completa:

Page 287: Live code manual Español

Chapter 7

[ 197 ]

Status BarLa última opción en la configuración de iOS controla si la barra de estado ha de ser visibleo no, y si debe tener el aspecto de la barra de estado predeterminado, o un aspectonegro. Para el aspecto negro puede establecer si que es ser opaco o translúcido. Lasiguiente captura de pantalla muestra la opción Barra de estado:

Page 288: Live code manual Español

Deploying to Your Device

[ 198 ]

AndroideComo podrá ver, el número de opciones para definir para Android es menor que la deiOS. Esto no es así porque Android es más sencillo, sino porque LiveCode exponeprácticamente todas las opciones posibles para iOS, incluyendo muchos que no tendrámás probabilidades. iOS también tiene las variaciones pantalla de presentación que noestán disponibles como opciones en Android.

En el mundo de Android, hay algunos ajustes que se requieren para hacer, en particular,los permisos. iOS le pide al usuario permiso para utilizar algunas funciones, pero no hastael momento en que su aplicación invoca esa característica. Usted habrá visto los cuadrosde diálogo que pregunta: App Fancy quiere saber su ubicación. Android por su parte lepide permiso para utilizar esas características en el momento en que la aplicación estáinstalada.

Echemos un vistazo a las opciones de Android.

Configuración básica de aplicaciónVarias de las opciones para iOS se les da un nombre diferente para el sistema operativoAndroid. En lugar de nombre para mostrar que hay Label, Internal ID App se llamaidentificador, y no hay un archivo de aprovisionamiento, pero no hay una clave de firma.Esencialmente, sin embargo, son las mismas opciones que para iOS.

El icono se establece como parte de la configuración básica, ya que sólo un icono que senecesita, así que no hay necesidad de que su propio conjunto de opciones. Para que unicono debe seleccionar una versión 512x512 tamaño de la imagen, y LiveCode hará que losotros tamaños para usted.

Aplicaciones Android no tiene una pantalla de inicio como la de iOS, pero LiveCode sepuede dar una pantalla de presentación, y mostrará que como la primera pantalla que veel usuario después de la carga de aplicaciones.

Usted es capaz de establecer que la aplicación va a ser instalado, con opciones de almacenamiento interno,Permitir almacenamiento externo, Prefiero y Almacenamiento Externo. El almacenamientoexterno se refierees la memoria SD que la mayoría de los dispositivos Android pueden tener. Los usuarios deAndroid no me importa dóndela aplicación está instalada, o son fanáticos de lo que se almacena en la memoria SD! Usted podríaseleccione Permitir almacenamiento externo, y esperan un montón de gente para elegir a tenerloinstalado enla memoria SD, o usted puede elegir Prefiero almacenamiento externo, sabiendo que sólo unaminoríacambiaría la opción de forzar la instalación debe hacerse en la memoria interna. En general,le molesta menos gente usando el ajuste Prefiero Almacenamiento Externo.

Page 289: Live code manual Español

Chapter 7

[ 199 ]

In-app notificaciones compras y empuje, que en el momento de la escritura son característicasmuy nuevas en LiveCode, se manejan de manera diferente de lo que son con iOS. Si usteddesea utilizar en app-compras, echa un vistazo a las lecciones en línea RunRev, y también eldeveloper.android.com sitio web para más información. Hasta aquí sólo hay una leccióniOS, que se encuentra aquí:

http://lessons.runrev.com/m/4069/l/48771

Page 290: Live code manual Español

Deploying to Your Device

[ 200 ]

Es de suponer que la lección de Android se añadirá a que algún día no muy lejano. El devAndroideloper información sobre la facturación in-app está aquí:

http://developer.android.com/guide/market/billing/billing_overview.html

Al igual que con iOS, Android OS se pueden dar órdenes externas, y también tiene elesquema de URL personalizado. Una característica que no se encuentra en iOS es lacapacidad de fijar un icono que se utiliza en la barra de tareas.

Así es como los ajustes básicos de aplicación se presentan opciones:

Page 291: Live code manual Español

Chapter 7

[ 201 ]

Requisitos y restriccionesDentro de este conjunto de opciones que puede establecer la versión mínima de Android yfijo que las características de hardware son necesarios. Las columnas de botones de radiose denominan de manera diferente de iOS. En vez de decir que una función es necesaria oprohibidos, usted está diciendo si la función es necesaria o usado. Esto se convierte eninformación que el usuario de Android es capaz de leer, y puede desempeñar un papel en sideciden comprar su aplicación. Por lo tanto, trate de seleccionar lo que corresponda a suaplicación.

Permisos de aplicacionesCuando una aplicación para iOS hace uso de ciertas características, tales como su ubicación,hay un diálogo de alerta que aparece cuando la función por primera vez. Con Androidcualquiera de estas funciones se enumeran durante la instalación de la aplicación, y elusuario podrá dar permiso para que todas las características de una sola vez.

Éstos son los permisos que se pueden elegir:

Page 292: Live code manual Español

Deploying to Your Device

[ 202 ]

Opciones de la interfaz de usuarioLas opciones de la interfaz de usuario realiza la misma función que la orientación y lasopciones de la barra de estado en iOS. Si usted está presentando una aplicación para iPadque es el paisaje, hay que apoyar tanto a las variaciones del paisaje. Este no es el mismorequisito con los almacenes de Android aplicación, ypor lo que las opciones son mucho más simples, es suficiente para decir si la orientación inicial hade serRetrato u horizontal, y si la barra de estado ha de ser visible o oculto:

Creación de aplicaciones para Beta TestersEs posible que haya estado dando prueba se acumula a los amigos y colegas de todo el camino a través deldesarrollo de su aplicación, pero incluso si no lo ha hecho, se hace más importante que hacer a fin de que seacerque al cargar la aplicación a las tiendas de aplicaciones. Los beta testers pueden informarle sobrecuestiones técnicas y no técnicas. ¿Hay errores ortográficos en los créditos? ¿El icono se ven bien? Hubo algúnaspecto extraño a la experiencia de instalación? Y, por supuesto, es que la aplicación haga lo que se suponeque debe hacer, en los numerosos dispositivos y sistemas operativos?

El proceso de hacer una aplicación para enviar a un probador es diferente en Android queen iOS. De hecho, es increíblemente fácil en Android! Veamos en primer lugar.

Envío de una aplicación Android para los probadoresAl hacer un Guardar como aplicación autónoma ... para Android, se crea un archivo APK.Podrías correo electrónico el archivo a sus probadores, y que podían hacer lo que sellama una "carga lateral" de laarchivo en su dispositivo. En el Capítulo 2, Primeros pasos con LiveCode Mobile, vimos lodifícil que puede ser conseguir un dispositivo Android conectado para las pruebas, y bienpodría estar más allá de las capacidades técnicas de algunos de sus probadores parahacerlo.

Afortunadamente, existe un método mucho más simple. Tome el archivo APK y ponerlo enlínea en alguna parte. Eso podría estar en una ubicación compartida DropBox o Google Drive,o tal vez sólo un servidor en su oficina. Haz lo que sea necesario para llegar al punto de quetiene una URL que enlaza con el archivo. Ahora correo electrónico URL a sus probadores, auna dirección de correo electrónico que se puede leer en sus dispositivos. A continuación,sólo se necesita un solo toque del enlace en el correo electrónico para iniciar la descarga e

Page 293: Live code manual Español

Chapter 7

[ 203 ]

instalación de la aplicación.

Hay una sección de Desarrollo de la configuración del dispositivo Android que los testerspuedan necesitar para visitar, para activar la función que permite a las aplicaciones que seinstalan de esta manera, pero es muy fácil de hacer ese cambio.

Page 294: Live code manual Español

Deploying to Your Device

[ 204 ]

Preparación de una aplicación iOS para que pueda trabajaren algún otro dispositivoLas cosas no son tan sencillas para iOS! Lo primero que tienes que hacer es añadir el ID dedispositivo único (UDID) para cada uno de los dispositivos de probadores beta "en su cuentade desarrollador de iOS. Los probadores pueden conseguir ese número al conectar eldispositivo a su ordenador y ver su información en iTunes. Cuando usted está buscando en lapestaña Información, podrás ver el número de serie del dispositivo. Al hacer clic sobre elnúmero que hará que cambie a un número más largo, que es el UDID que será necesaria.Una vez que ese número está mostrando que puede hacer un atajo de teclado para copiar elnúmero al portapapeles (Ctrl + C en Mac, Ctrl + C en Windows). Haga que sus probadores dehacer esto, y luego los he pegar el número en un mensaje de correo. Usted quiereasegurarse de que usted obtenga el número correcto, porque va a utilizar una de sus 100asignación de dispositivos en su cuenta de desarrollador de iOS.

Ir a https://developer.apple.com/ios/manage/devices/index.action con elfin de añadir los dispositivos a su cuenta. Haga clic en el botón Agregar dispositivos en esapágina, y usted será capaz de añadir los dispositivos a tu cuenta:

Page 295: Live code manual Español

Chapter 7

[ 205 ]

A continuación, vaya a la fespués de enlace: https://developer.apple.com/ios/manage/provisioningprofiles / index.action y, o bien crear un nuevo perfil o seleccioneuna existente y seleccione Editar / Modificar. A continuación, aparecerá una lista de losdispositivos asociadosa su cuenta, y puede permitir a cualquier combinación de dispositivos que desea trabajar con eseaprovisionamiento perfil. En la siguiente imagen puedes ver que el grupo de dispositivos deprueba esmuy breve:

Después de enviar los cambios, verá que el perfil modificado se encuentra pendiente. Nose necesita ningún tiempo para procesar el archivo de aprovisionamiento, ustedinmediatamente puede volver a cargar la página y encontrar que está listo paradescargar.

Descargue el nuevo perfil y agregarlo a Xcode (haz doble clic en el archivo descargadodebe hacer eso para usted). Abra Mainstack de su aplicación en LiveCode, ve a Ajustesaplicación independiente ... | iOS, y asegúrese de que el perfil de datos se selecciona enel menú Perfil y Guardar como aplicación autónoma ... de nuevo, para asegurarse deque los nuevos dispositivos son conocidos por la aplicación.

Page 296: Live code manual Español

Deploying to Your Device

[ 206 ]

Por ahora usted tendrá un archivo APP, lo que equivale a iOS de la APK de Android. Comocon Android que podría correo electrónico el archivo a sus probadores, junto con el archivo deaprovisionamiento yprobadores tienen la "carga lateral" que en sus dispositivos. En este caso, eso no es tan difíciltarea, ya que el probador puede utilizar iTunes para hacerlo. Si tienes que ir por ese camino, que susprobadoresarrastre el archivo APP y archivos de aprovisionamiento en la biblioteca de iTunes, conectar eldispositivo, consulteen la ficha Aplicaciones, asegúrese de que la nueva aplicación está seleccionada y realizar unasincronización. Sin embargo, esposible para hacer las cosas mucho más fáciles para los usuarios, tan fácil como lo fue para losusuarios de Android.

La creación de "Over The Air" instaladores para iOSDesde iOS 4.0, ha sido posible instalar una aplicación desde un vínculo en una página web.Creación de la estructura de archivos para que eso funcione es un poco complicado, aunque,pero, afortunadamente, hay por lo menos un par de herramientas que se pueden comprarpara hacer las cosas más fáciles para usted.

AirLaunchSoftware hiperactivo ha hecho un plugin LiveCode que puede llevar a su archivo APP y creala estructura de archivos necesaria para el "over the air" instalar al trabajo. Sólo hay unúnico cuadro de diálogo que se necesita para rellenar como se muestra a continuación:

Page 297: Live code manual Español

Chapter 7

[ 207 ]

Después de seleccionar el archivo APP sólo tendrá que introducir la URL de la carpetadonde será cuando esté en línea, a continuación, haga clic en el botón Crear archivos. Acontinuación, e-mail la dirección URL de la carpeta para sus probadores, y cuando se visitela página web en su dispositivo habrá un solo enlace al tacto, y la aplicación se instalará.

Ver más información sobre AirLaunch en la página utilizando el siguiente enlace:

http://www.hyperactivesw.com/airlaunch/index.html

BetaBuilderBetaBuilder se pueden encontrar en la Mac App Store, en la fespués de enlace:

http://itunes.apple.com/us/app/betabuilder-for-ios-apps/id415348946? mt = 12

No fue hecho con LiveCode en mente, y funciona con archivos de la API no archivos APP. Elproceso es muy similar al de AirLaunch, selecciona el archivo que desea utilizar, introduzcala dirección URL de la carpeta en línea, y el programa generará los archivos para usted. Unavez más, todo lo que sucede en una sola ventana de diálogo como se muestra en lasiguiente captura de pantalla:

Page 298: Live code manual Español

Deploying to Your Device

[ 208 ]

Una manera fácil de convertir el archivo APP LiveCode en un IPA es arrastrar la aplicación eniTunes, a continuación, seleccione Mostrar en Finder, haga clic en la aplicación en laBiblioteca. Esto revelará el archivo IPA, que puede arrastrar a la ventana BetaBuilder.

Ambos productos hacen la vida más fácil para sus probadores. AirLaunch tiene las ventajasde ser un plugin que funciona dentro de LiveCode, que es muy probable que haya abiertotodos modos, y trabajar directamente con los archivos de APP que LiveCode crea.BetaBuilder principal ventaja es que es increíblemente barato!

TestFlightApp.comhttps://testflightapp.com utiliza exactamente la misma técnica que las dosaplicaciones utilizan, pero el sitio también incluye una gran cantidad de herramientas degestión de proyectos. Es mucho más de lo necesario para el envío de aplicacionespersonalizadas a un testers pocos, pero puede entrar en su más propio cuando se trata devarias aplicaciones de salir a un gran grupo de testers.

Creación de una tienda de aplicaciones de archivo de envíoEl mayor obstáculo a superar para hacer una versión de su aplicación que puede sersometido a las tiendas de aplicaciones es la adquisición de un certificado de distribución. Elproceso es más rápido para Android, pero implica algo de tecleo en la línea de comandos, yhay una ligera diferencia si estás en Windows en lugar de Mac. El proceso de iOS tienemuchos pasos a la misma, pero al menos los que no tienen que ver con escribir comandoscrípticos. Pronto nos ocuparemos de Android en primer lugar.

Encontrar y utilizar la aplicación para Android KeytoolUna de las cosas que se instaló cuando se agregó el Java Development Kit es unaherramienta para hacer un archivo de almacén de claves, que es un certificado auto-asignado. Es la herramienta que se utiliza para crear el certificado que necesita con el fin dedistribuir una aplicación para Android.

En Mac no es necesario para encontrar esa aplicación, sólo tiene que escribir el comando enla Terminal, y la herramienta se encuentra para ti. En Windows necesita para navegar hasta lacarpetadonde vive la herramienta de claves. Antes de llegar tan lejos tienes que abrir primero la línea decomandosAdministrador.

En Windows, la aplicación CMD se encuentra en C: \ Windows \ System32 \. Vaya aese directorio en el Explorador de Windows, haga clic derecho en el archivo y seleccioneEjecutar como administrador. La aplicación Keytool estará en la carpeta bin del directorioJava JDK. Una vez en el directorio C: \ del sistema, cambie los directorios para llegar a ese

Page 299: Live code manual Español

Chapter 7

[ 209 ]

lugar, que será algo así como: C: \ Archivos de programa \ Java \

jdkx.x.x_xx \ bin \, donde la jdkx.x.x_xx parte sería en realidad la versión delJDK que ha instalado. Usted debe ser capaz de obtener todo el camino con una línea comoesta:

C: \> cd \ Archivos de programa \ Java \ jdk1.7.0_01 \ bin \

Page 300: Live code manual Español

Deploying to Your Device

[ 210 ]

En Mac va a utilizar el Terminal, que se encuentra en / Aplicaciones / Utilites. Sólo tiene que abrirTerminal, e inmediatamente será capaz de utilizar la aplicación Keytool.

En cualquier caso, ahora se escribe una línea relativamente corto, y luego responder a lasdiversas preguntas que aparecen. Para una comprensión más completa de lo que es goingadelante, visite la página web:

http://developer.android.com/guide/publishing/app-signing.html

Para nuestros propósitos, sólo tendremos que escribir el comando correcto y todo deberíair bien, incluso si no entendemos lo que escriben!

Esta es la línea que escribir, cambiando los nombres y alias del almacén de claves para quecoincida con el nombre que desea utilizar para este certificado:

keytool-genkey-v-keystore my-release-key.keystore

-Alias-alias_name keyalg tamaño de clave RSA-2048-10000 validez

Cuando se presiona la tecla Intro o Retorno usted comenzará a ver una serie de preguntas,comenzando con la contraseña que desea utilizar para el almacén de claves. Otraspreguntas se le pedirá su nombre completo, detalles sobre su empresa, ciudad y país. Esun conjunto de datos que pueden ser codificados en un almacén de claves que es único, ytiene suficiente información precisa con la que un usuario puede decidir si se debe confiaren el certificado.

Cuando la herramienta esté terminado tendrá el archivo de almacén de claves queLiveCode requiere. Será fácilmente disponible en la carpeta de inicio en Mac, y algoenterrado en la carpeta bin del JDK en Windows.

Vaya a las Opciones de la aplicación de los ajustes básicos de la aplicación independientede su Mainstack y navegue hasta el archivo de la entrada Key. Una vez elegido, esasección se verá como la siguiente captura de pantalla:

Si usted ha elegido sus iconos, pantalla de presentación, requisitos y permisos, usteddebería ser capaz de construir una versión del archivo APK que se pueden cargar en lastiendas de aplicaciones.

Page 301: Live code manual Español

Chapter 7

[ 211 ]

Creación de un certificado de distribución para iOSComo se mencionó anteriormente, no existe una tipificación de línea de comandosimplicados en conseguir un certificado de distribución para iOS, pero hay un montónde pasos a seguir. El primer lugar a visitar es el iOSDeveloper Portal, para asegurarse de que ha creado un ID de aplicación específico yaprovisionamiento de archivo para esta aplicación particular.

Las imágenes siguientes representan las medidas adoptadas para conseguir un certificado yel perfil de una aplicación para ser nombrado Estoy Confundido!, que es esencialmenteel rompecabezas que hemos hecho anteriormente.

En la parte App IDs del portal hay un botón New App ID que te lleva a una página para entraren los detalles de ID de aplicación. Aquí se puede ver que la ID se le da el nombre de ImDesconcertado App ID, y un paquete de identificador decom.colinholgate.impuzzled. Esto debe coincidir con el ID de aplicación internosestablecido en LiveCode.

Page 302: Live code manual Español

Deploying to Your Device

[ 212 ]

Ahora que hay un identificador de aplicación, que puede ser utilizado en la creación de unperfil de distribución de aprovisionamiento, en la sección de aprovisionamiento. Una de lasdificultades es sin embargo el mensaje de advertencia sobre la creación deun certificado:

Al hacer clic en el enlace de texto te lleva a una larga descripción de cómo se tieneque solicitar una autoridad de certificación, y cargar un archivo que genera el Accesoa Llaveros. Cuando se presenta esta situación, siga cuidadosamente los pasos que seindican:

Page 303: Live code manual Español

Chapter 7

[ 213 ]

Una vez que haya cargado el archivo de solicitud de certificado que será capaz de hacer unperfil de distribución que utiliza el ID de aplicación específico, y el certificado dedistribución. La entrada final se verá como la siguiente captura de pantalla, y deberáutilizar el botón de descarga para obtener una copia local del archivo deaprovisionamiento:

Ahora tiene el archivo que LiveCode requiere, sólo que no lo selecciona en la configuración de LiveCode.En su lugar, haga doble clic en el archivo y se instalará usando Xcode. Una vez que esté en Xcode acontinuación, puede seleccionar en el menú Perfil en la Configuración de aplicación básica en LiveCode:

Al igual que con Android, debe asegurarse de añadir los iconos y pantallas de inicio, losrequisitos establecidos, y así sucesivamente, y usted será capaz de guardar un archivo APPlisto para ir a la tienda iOS App.

La carga en las tiendas de aplicacionesCada tienda de aplicaciones lo guía a través del proceso de carga de una nueva aplicación, yhay un buen montón de pasos a seguir! Podría tomar otro libro para mostrar todas laspantallas que tienen que vadear. Mostrando las pantallas aquí no sería tan valioso,principalmente a causa de la gran cantidad de pantallas, pero también porque los cambios en

Page 304: Live code manual Español

Deploying to Your Device

[ 214 ]

el proceso de vez en cuando. Por ejemplo, Google incluso cambió el nombre de su serviciodesde el capítulo 2 se ha escrito!

Page 305: Live code manual Español

Chapter 7

[ 215 ]

Existe cierta similitud entre lo que cada una de las tiendas le pedirá, por lo que vamos a verlos preparativos que usted puede ser que desee tomar antes de ir a las tiendas. Cuando estélisto para proceder con la carga, estos are las páginas que empiezan por:

iTunes Connect -https://itunesconnect.apple.com

Google Play - https://play.google.com/apps/publish/

Amazon AppStore - https://developer.amazon.com/home.html

¿Cuál es similarLas tres tiendas de aplicaciones pedirá una descripción de lo que hace la aplicación, lainformación de clasificación, el precio, un sitio Web de soporte o dirección de correoelectrónico y la información de categoría. Con el fin de pedir un precio, que no sea libre,usted tendrá que configurar una cuenta de comerciante. En el caso de Apple, que tiene quedar una dirección de página web para el apoyo, Google sólo pide información de contacto,y Amazon muestra de apoyo como opcional. Los tres piden capturas de pantalla, y las dostiendas de Android también le permite subir un vídeo de demostración.

Lo que es diferenteManzana pide una gran cantidad de información que se transmite a través de muchaspantallas. La carga del archivo de aplicación actual está a cargo de la utilidad ApplicationLoader que viene como parte de Xcode.También parece que tiene que introducir toda la información en una sola sesión. Con elbotón Guardar en la parte inferior de la página web, pensando que puede volver ycontinuar en otro momento, no parece funcionar.

Google solicita una gran cantidad de información, pero todo está atascado en unapantalla! Tenga cuidado al comenzar a utilizar la página. Lo primero que piden es elarchivo APK. Probablemente debería cancelar que al principio, porque aún no se ha fijadoun precio para la aplicación. Si lo hace subir el APK de inmediato, que es al instante y deforma permanente una aplicación gratuita.

Amazon pide menos información, y se presentan las preguntas dentro de una página.Hay muy buenas críticas por ahí, alabando la facilidad de presentar a la AppStoreAmazon!

En pocas palabrasEl proceso de envío es sólo la parte más estresante de desarrollar una aplicación móvil! Tehace sentir mejor acerca de las otras etapas que has pasado, tal vez los que no eran tan malodespués de todo!

Esperamos que tengan una pareja que puede ser un segundo par de ojos, para ayudarle a

Page 306: Live code manual Español

Deploying to Your Device

[ 216 ]

entender todas las preguntas, y no te pierdas algo importante que te perseguirá más tarde.

Page 307: Live code manual Español

Chapter 7

[ 217 ]

ResumenYo no sé ustedes, pero yo soy mejor! Y no sólo porque son las 4 am, este negocio deaplicaciones móviles de desarrollo puede ser abrumador. Incluso el lado administrativode las cosas pueden ser un poco complicado. En este capítulo hemos cubierto algunasde esas tareas menos programáticas:

Al examinar todas las opciones en la configuración de aplicación independiente

Lucha de camino a través de líneas de comando y los trámites burocráticos para obtenerun certificado de aplicación

Intentó conseguir mentalmente preparado para presentar en las tiendas de aplicaciones

Estamos al final del camino en cuanto a hacer uso de las características móviles en una pila LiveCode,y teniendo que hasta el punto de ser una aplicación móvil real. El siguiente, vamos a ver algunos add-ons para LiveCode que le permiten utilizar las funciones más móviles.

Page 308: Live code manual Español

Extender LiveCode

La historia hasta ahora ...El largo y tortuoso camino fue el último single que se lanzará por los Beatles, y que sería unbuen título para un libro que describe lo que se tardó en llegar LiveCode trabajando endispositivos móviles! Tan pronto como hubo aplicaciones en el iPhone, RunRev estabadesarrollando una manera de publicar para iPhone de LiveCode. Luego, en abril de 2010,Steve Jobs escribió este artículo infame en Flash:

http://www.apple.com/hotnews/thoughts-on-flash/

Adobe también había desarrollado una manera de publicar para iPhone de FlashProfessional, sino como parte de la determinación de Apple de no permitimos Flashcualquier cosa que pueda utilizarse en el iPhone, las reglas de la App Store de presentaciónfueron cambiadas, prohibiendo a los desarrolladores el uso de cualquier otra herramientade Xcode para publicar aplicaciones.

Algunas herramientas continuó en una zona gris, porque usaban Xcode para hacer lapublicación final. Aplicaciones GameSalad y Unidad siguió publicándose y le fue bien en laApp Store. RunRev trató de convencer a Apple para permitir LiveCode (que todavía sellamaba Revolución Runtime en el momento) que pueda utilizarse como una herramienta depublicación para el iPhone, incluso la promesa de publicar sólo en el iPhone, y no seguiradelante con la publicación en Android. Manzana se mantuvieron firmes, y declinó la oferta.

Para Adobe, este no era el fin del mundo, y empezaron a trabajar en la editorial Android. Pero,RunRev ya había planeado una conferencia en torno a la idea de publicar para iOS, y que laconferencia tuvo que ser pospuesta.

Page 309: Live code manual Español
Page 310: Live code manual Español

Extending LiveCode

[ 212 ]

Durante el verano de 2010, Apple realizó una encuesta para los desarrolladores, y varias delas preguntas que dieron a la gente como yo una oportunidad para pedir que Apple nospermite utilizar nuestras herramientas de desarrollo preferidas, y no tener que usar Xcode.Es difícil estar seguro de si eso es lo que hizo la diferencia, pero el 9 de septiembre de 2010,Apple ha cambiado su posición sobre el tema. Este es el mensaje que me desperté a lamañana:

http://www.apple.com/pr/library/2010/09/09Statement-by-Apple-on-App-Tienda-Review-guidelines.html

Rápidamente me envió un mensaje a la Revolución lista de correo electrónico, tituladocómo hacer totalmente día de Kevin, "Kevin" ser Kevin Miller, CEO de RunRev. Tuvo elefecto deseado, y aún se pueden leer los mensajes de la carta:

http://runtime-revolution.278305.n4.nabble.com/how-to-totally-make-Kevin-s-día-td2532866.html

Esto me RunRev de nuevo en el desarrollo de una "Publicar en iOS" característica, iPhoneOS haber sido renombrado como iOS en ese momento. La conferencia terminó retraso quetendrá lugar en San José, a finales de abril de 2011. En ese momento, RunRev no sólohabía hecho la función de iOS funcionan bien, pero también ha publicado la primeraversión de la "Publicar en Android" característica.

Es muy divertido de una manera de pensar que, si va a publicar en Android desdeLiveCode, puede agradecer a Apple por ser tan terco!

Extender LiveCodeEl progreso en LiveCode ha continuado a un ritmo bastante rápido, y en abril de 2012RunRev había puesto en práctica todas las características de iOS para Android también,además de haber añadido mucho al conjunto de características para iOS.

Sin embargo, no todas las características que está cubierto y hay un mercado de otrosfabricantes de complementos para LiveCode, lo que hace que el desarrollo sea más fácil enLiveCode, o que proporcionan funciones que aún no están disponibles en la versiónestándar. Éstos son algunos de los complementos, la mayoría de las cuales se puedencomprar en el mercado LiveCode:

http://www.runrev.com/store/

MobGUIYa hemos usado MobGUI en capítulos anteriores. Toma la forma de un plugin. Usted coloca elarchivo en su MobGUIplugins carpeta. Esta lección describe LiveCode plugins y agrega:

http://lessons.runrev.com/s/lessons/m/4071/l/21341-how-to-install-

Page 311: Live code manual Español

Appendix

[ 213 ]

usuario a medida-plugins

Page 312: Live code manual Español

Extending LiveCode

[ 214 ]

La forma en que funciona MobGUI es que te permite realizar controles periódicos LiveCodeen la tarjeta de la pila, y luego cuando la aplicación se ejecuta, los controles estándar seintercambian los controles nativos. Esto tiene una ventaja sobre sólo hacer controlesestándar que se parecen a los controles de iOS, ya que el control se ve bien también.

MobGUI no hace nada que no se podía ver con sus propios scripts, pero hace que seamucho más fácil de usar diseño y controles móviles del sistema operativo nativo. Hay uncanal de YouTube para MobGUI que le mostrará algunas de las cosas que se puedenhacer usando la tool:

http://www.youtube.com/user/MobGUI

tmControltmControl es un conjunto de temas hechas por los medios de comunicación táctiles paraque pueda dar a sus stacks LiveCode un aspecto más artístico. Además de la cienciaficción y otros temas, hay un tema iOS. Así es como se ve:

Page 313: Live code manual Español

Appendix

[ 215 ]

No es demasiado sorprendente verdad! Un tema Android está previsto, así como adiciones al iOStema. Esta página mostrará la av actualmenteailable temas:

http://tmtools.tactilemedia.com/tmcontrol/themes.html

DropTools PaletteFabricado por Hijos de Software Thunder, DropTools Palette es un complemento gratuitopara LiveCode, que actúa como una cubierta para albergar muchos tipos de controlespersonalizados LiveCode. Además de ser el titular de Sons Of Thunder controlespersonalizados, también ha sido utilizado por otros desarrolladores como una manera fácilde traer sus propios controles personalizados en el mercado. El sitio web DropToolsincluye descripciones detalladas de cómo usted puede desarrollar sus propios controlesDropTools compatibles.

El sitio también actúa como un "agregador" para los controles personalizados LiveCode, e incluyeenlaces a ambosDropTools y no DropTools compatibles add-ons. La página principal es located aquí:

http://droptools.sonsothunder.com/

Muchos de los controles personalizados no se refieren a las aplicaciones móviles, pero hayunos pocos, y que sin duda aumentará con el tiempo.

Page 314: Live code manual Español

Extending LiveCode

[ 216 ]

mergExtmergExt es un conjunto de comandos externos para LiveCode. En el momento de escribiresto, no hay LiveCode Android SDK, por lo que en la actualidad todos estos son sólo paraiOS. Esta es la lista tal como está, junto con descripciones tomadas de la página LiveCodemercado:

http://www.runrev.com/store/product/mergExt-1-0-2/

mergAccessory: Este es un iOS externo para conectar y comunicar con hardwareaccesorio utilizando el marco de accesorio externo.

mergAnswerColor: Se trata de un externo iOS que presenta un selector de colormodal. mergAV: Se trata de un externo iOS que agrega funciones y comandos

relacionados con el marco AVFoundation. Actualmente, esto incluye la selección,grabar, guardar y editar videos.

mergBanner: Esta es una externa iOS que añade una bandera iAd para suaplicación en la parte inferior de la pantalla.

mergDoc: Se trata de un externo iOS que agrega funciones y comandosrelacionados con la interacción con los documentos. Esto incluye actualmentepresenta un avance modal, abierto en el menú de aplicación, documento menú deopciones, y solicitando los iconos del documento en formato PNG. La impresión estambién disponible a través de la vista previa.

mergMK: Este es un LiveCode MapKit externo que añade un control del mapa, queadmite que muestra la ubicación del usuario con la rúbrica, añadiendo pinsanotación, y polilíneas.

mergMessage: Esta es una externa iOS que añade un comando para enviar un mensajeSMS. mergPop: Se trata de un externo iOS que añade funciones a presentar una hoja deacción

(Pop-over en el iPad) y el menú contextual para la interacción del usuario.

mergReader: Se trata de un externo iOS que presenta un lector de PDF modalutilizando el código abierto vfrReader proyecto.

mergSettings: Se trata de un externo iOS que integra una aplicación LiveCodecon la aplicación Ajustes y también incluye InAppSettingsKit presentar uncuadro de diálogo de adaptación dentro de su aplicación.

mergTweet: Esta es una externa iOS que añade un comando para enviar un mensajetweet. mergXattr: Se trata de un externo iOS que agrega comandos para configurar el

cartel de no respaldar y atributos de protección de un archivo. mergZXing: Este es un LiveCode externa que utiliza la ZXing biblioteca para

Page 315: Live code manual Español

Appendix

[ 217 ]

leer una amplia gama de tipos de códigos de barras a través de la cámara traserade un dispositivo móvil.

animationEngine: Esto le permite crear animaciones de alta calidad, ydetectar colisiones entre objetos. Es muy adecuado tanto para crear juegos yaplicaciones para hacer la presentación. Aquí está su informaciónción de páginaen el mercado LiveCode:http://runrev.com/store/product/animation-engine-5/

Page 316: Live code manual Español

Extending LiveCode

[ 218 ]

Aunque no es específicamente para uso móvil, animationEngine se ha ajustadopara cumplir con los requisitos iOS App Store, y así todavía debe ser de uso en lafabricación de aplicaciones de iOS. También funciona para aplicaciones de Android.Como se muestra en la Creación a través de los instaladores de aire para iOS en elúltimo capítulo, AirLaunch es un add-on que facilita la creación de más de-the-airarchivos de instalación para iOS. Una decola descripción se puede encontrar aquí:http://www.hyperactivesw.com/airlaunch/ index.html

La creación de su propio add-onsLos dos principales tipos de complementos que podrían estar interesadas en hacer soncontroles personalizados y comandos externos y funciones (generalmente conocido comoexternos).

Los controles personalizadosLos controles personalizados están hechos típicamente de un grupo que contiene muchoscontroles estándar, y con una secuencia de comandos grupo que gestiona la apariencia y lainteracción de estos controles. Hay un tutorial en hacer un control personalizado a estapágina:

http://www.runrev.com/developers/lessons-and-tutorials/tutorials/avanzado-custom-controls /

Si va a ir a hacer una bonita paleta personalizada para hacer más fácil que arrastrar y soltarlos controles personalizados a la ventana de la tarjeta, tenga en cuenta lo que es DropTools-compatible. Se podría ahorrar una cantidad significativa de tiempo para resolver elproblema que resuelve DropTools ya, y los controles personalizados estaría en línea con loscontroles DropTools otros, haciendo que la pantalla menos gente con paletaspersonalizadas! Hay una gran cantidad de información sobre el desarrollo de la Dra.opToolscontroles compatibles en esta página:

http://droptools.sonsothunder.com/developer/

ExterioridadAbajo a la derecha de la ya mencionada "lecciones-y-tutoriales" de la página es una largalista de tutoriales, dos de los cuales se relacionan con lo que los externos. Estos tutorialesestán destinados en particular para el desarrollo externo de aplicaciones de escritorio. Pordeveloping externos móviles, debe mira esta página:

http://www.runrev.com/developers/documentation/externals-sdk/

Page 317: Live code manual Español

Appendix

[ 219 ]

En el momento de la escritura, esta página sólo cubre los aspectos externos de iOS, pero no hay razónpara esperar quepor el tiempo que usted está leyendo esto, habrá información sobre la creación de lo externoAndroid también.La página es muy larga, e incluso incluye un video de 17 minutos! El c de vídeoun ser vistoYouTube también, en esta dirección:

http://www.youtube.com/watch?feature=player_embedded&v=lqduyQkhigg

La creación de lo externo no es trivial. Si usted tiene una idea para un externo útil, perosiento que es más allá de sus capacidades o intereses para creaciónte a ti mismo, toma unvistazo a la página mergExt:

http://mergext.com

Aquí usted puede hacer sugerencias o votar por los externos que le gustaría ver creó. Si

usted siente que puede hacer lo externo, ¿por qué no ponerlos a disposición de los

productos? Lava tarifa para estos complementos se encuentra en los $ 30 - rango de $ 100 - cualquier venta querealice compensar sulos costos de desarrollo.

Page 318: Live code manual Español

Extending LiveCode

[ 220 ]

Page 319: Live code manual Español

Respuestas PopQuiz

Capítulo 1, Fundamentos LiveCodePop Quiz - mejor nombre?

Respuesta: Henry. En los primeros días de multimedia que parecía que todo el mundo teníauno de sólo unos pocos nombres. Había Bill Atkinson, quien creó HyperCard, y Bill Appleton,quien creó SuperCard. Kevin Calhoun fue el principal programador HyperCard por untiempo, y Kevin Miller es el jefe de RunRev. Bob Stein fue uno de los fundadores de TheVoyager Company, y junto con Bob Abel fue uno de los pioneros en multimedia. Dan eraotra buena opción, con la existencia de Dan Winkler, autor del lenguaje HyperTalk, y DannyGoodman, autor de muchos libros de programación famosos. Henry sería un buen nombresi quería hacer automóviles, o casarse con un montón de reinas.

Pop Quiz - Trato de recordar ...Respuesta: En la sección Formato de texto de la paleta Inspector. Para llegar a esa seccióninvolucrada la selección de la herramienta de edición, haga clic en el campo de título, y eligiendo elformato de texto de la paleta Inspector menú desplegable. Sin embargo, de hecho existe un menú detexto. Realmente eso es lo que debería haber utilizado!

Page 320: Live code manual Español

Pop Quiz Answers

[ 220 ]

Capítulo 2, Primeros pasos con Mobile LiveCodePop Quiz - cuando algo es demasiado?

Respuesta: El tamaño del archivo se va a ir a más de 50 MB. Las otras respuestas sonválidas también, aunque se puede reproducir la música como un sonido externo, parareducir el tiempo de carga, pero al ir a más de 50 MB, a continuación, eliminaría el potencialde ventas de personas que se conectan a través de redes celulares e inalámbricas no. En elmomento de escribir esto, todas las tiendas requieren que se puede conectar de formainalámbrica si desea descargar aplicaciones que son más de 50 MB.

Pop quiz - nombres sabrosos códigoRespuesta: Pastel de queso del limón. El patrón, si no es obvio, es que el nombre decódigo toma en la siguiente letra del alfabeto, es un tipo de comida, pero másespecíficamente es un alimento postre. "Munchies" casi funciona, pero "Marshmallow" o"Pie merengue" serían mejores opciones!

Pop quiz - nombres de código para iOSRespuesta: Hunter Mountain. Aunque no es publicidad, Apple hace uso de nombres en clave paracada versión de iOS. Ejemplos anteriores han incluido Big Bear, Apex, Kirkwood, y Telluride. Estos ytodos los demás aparentemente, son estaciones de esquí. Hunter Mountain es una montañarelativamente pequeño (3.200 pies), por lo que si se acostumbra tal vez sería una actualización menor!

Capítulo 3, la creación de interfaces de usuarioPop Quiz - conseguir el cuadro grande

Respuesta: 45 El Mac original tenía una pantalla que estaba 512x342 píxeles. Que se ajuste amás de 45 veces en el área de una foto de 8 megapíxeles.

Pop quiz - el costo de las cosas en estos díasRespuesta: 6.000 veces mejor. Sí, por supuesto. Hace 25 años Apple estaba vendiendo un MB 4add-on kit para el Macintosh II, por alrededor de $ 1500. Ahora vende un 8 GB add-on para el Mac Propor $ 500.

Page 321: Live code manual Español

[ 221 ]

Pop Concurso Answers

Capítulo 4, Utilización remota de datos y medios decomunicaciónPop quiz - nombre que la estructura

Respuesta: La ruta del mensaje. Para mayor información, RunRev tiene una lección en líneaque describe la ruta del mensaje:

http://lessons.runrev.com/s/lessons/m/4603/l/44036-the-livecode-mensaje-path

Pop quiz - otros lugares especialesRespuesta: Usuarios. Casa y Escritorio no son utilizadas por Android, yEscritorio no es utilizada por iOS. 0x000e sonaba sospechosa, pero en realidad es elspecialFolderPath entrada para Mis videos, bajo Unix! Ninguno de los sistemastiene un Usuarios entrada.

Capítulo 5, Cómo hacer una aplicación Jigsaw PuzzlePop-Quiz - ¿cuántos bits en un byte?

Respuesta: 8. Aunque sólo sea por el interés de los matemáticos, es bueno saber que unbyte son 8 bits. Un "bit" es un "dígito binario", y cuando empiezas a pensar de bits en lostérminos que usted verá que un byte puede almacenar 2 a la potencia de 8 valores en él("binary" estar Base 2). Esto entra en juego cuando se mira en la longitud de una cadenaPascal (2 a la potencia de 8 es 256, por lo tanto, el rango de caracteres en una cadena Pascales 0-255), y le ayuda a darse cuenta de que si una imagen está formada por de un byte paracada píxel de color rojo, verde y azul, es una imagen de 24-bit. Una vez que se agrega enotro byte de datos del canal alfa, que tiene una imagen de 32 bits.

Pop-Quiz - conseguir el cuadro grandeRespuesta: Depende de la naturaleza de la imagen. SVG es una descripción de cómo dibujarla imagen, mientras que PNG es una descripción de los píxeles en la imagen. En PNG que lainformación es también de datos comprimidos, en una forma sin pérdida. Para el mapa deejemplo, en su tamaño original, un PNG de 24-bit es la mitad del tamaño del archivo SVG.Hay una gran cantidad de datos necesarios para describir los contornos de los estados deEE.UU.! Si la imagen tiene que ser ampliada, el archivo PNG se hacen más grandes, mientrasque el SVG seguiría siendo el mismo tamaño de archivo. Por otro lado, si una imagen era unrectángulo de un gradiente diagonal SVG sería pequeña, y el PNG sería enorme, porque no

Page 322: Live code manual Español

[ 222 ]

hay tramos largos de mismos píxeles de colores para la compresión de datos para funcionarbien.

Page 323: Live code manual Español
Page 324: Live code manual Español

Pop Quiz Answers

[ 222 ]

Pop-Quiz - calcular esto!Respuesta: 16.777.216 botones. Al igual que con la discusión sobre "bits y bytes", los valores derojo, verde y azul se combinan para dar 2 a la potencia de 24 valores posibles. Si sólo se utilizan dos de loscolores, la respuesta habría sido 65.536.

Capítulo 6, Cómo hacer una aplicación RecordatoriosPop-Quiz - AO (Siglas extraño!)

Respuesta: Para no molestar a los franceses, más o menos. Los franceses no hayanobjetado de manera proactiva, pero en realidad, la sigla de UTC se seleccionará de formaque no coincida específicamente la versión en Inglés de la frase. También cayó muy biencon las otras siglas de UT0, UT1, y así sucesivamente.

Pop-Quiz - ¿Qué piso es mi apartamento en?Respuesta: piso 11. Los números de volver de la vuelta del sensor ubicación como latitud,longitud y altitud. Eso haría que la elevación para el que el dispositivo estaba en esetiempo de aproximadamente 37,5 metros, demasiado bajos para ser el piso 40. No haysuficiente información en la captura de pantalla para que usted sepa exactamente cuándo fuetomada, y donde en la tierra!

Page 325: Live code manual Español

[ 221 ]

ÍndiceLaAdobe Director 132Adobe Flash 132AirLaunch

aproximadamente 202URL, para información 203

alarma de reloj 160alphaData propiedad 134Amazon Appstore

aproximadamente 40-43URL 209

Androide60 pruebas

Android Appel envío, a los probadores 199

Android Debug Bridge (ADB) 61Android developer

Amazon Appstore 40, 41Android Market 36Android SDK, la descarga de 44convirtiendo 36LiveCode, señalando Android SDK 47, 48

Android Keytool aplicaciónbuscando 204, 205utilizando 204, 205

Android Market 36-40Android SDK

descargar 44instalar, en Mac OS X (Intel) 45instalación, en Windows 46, 47LiveCode, poiting a 47, 48

Android secciónaproximadamente 196Permisos de aplicaciones 198Configuración básica de aplicación 196Requisitos y restricciones opciones 198Opciones de la interfaz de usuario 199

Android pruebas de 60, 61Dispositivo virtual de Android

partida 60animationEngine 215Manzana 209Opciones de aplicaciones Android sección Permisos,

198aplicaciones

creando, por los beta testers 199subir, a las tiendas de aplicaciones 208, 209

Aplicación de las tiendasaplicación, subir a 208, 209comparando 209

app store archivo de envíola creación de 204

ARMv7 190

BConfiguración básica de aplicación, el artículo 196AndroidConfiguración básica de la aplicación, iOS sección 191,192BetaBuilder

aproximadamente 203, 204URL 203

beta testersaplicaciones, capacidad para 199

Page 326: Live code manual Español

[ 224 ]

Birthday Reminder 160mapas de bits de datosde mapa de bits 132

utilizado, para la creación de botonesde estilo OS 80

Puntos de interrupción 31Navegador de tarjeta

aproximadamente 112controles del navegador, añadiendo113

browserFinishedLoading función 118Informes Bug artículo 189Construir para la configuración de lasección 190 iOS

Cbotones de la calculadora

la creación de 19controladores de tarjetas

la adición de 22, 23tarjetas

la creación de 15, 16navegar entre los 16

charToNum función 132checkdistance manejador 156Regalo de Navidad lista 160manejador clearPressed 24clipboardData 22código, LiveCode jerarquía

sobre 14tarjetas, la creación de 15, 16cartas, navegando entre 16 y 17

detección de colisionesmaskData, usando para 139

colisión mapa deteccióncreando 136-138

Copiar archivos del artículo 189currentcommand variable de 25CurrentValue variable 26personalizados complementos

la creación de 216controles personalizados 216externas 216, 217

controles personalizados 216Esquema de URL personalizado, iOSsección 194

Dselectores de fecha

creando 161-164

Page 327: Live code manual Español

[ 225 ]

selector de fechas, banco de pruebas deaplicaciones móviles

Viendo del 77depuración, LiveCode 30, 31eliminar manejador 180correo electrónico de escritorio deaplicaciones, banco de pruebas deaplicaciones móviles

invocando 72nativa aplicación de correo electrónico,llamando a 72

distanciacalcular, entre dos puntos sobre la Tierra 167,

168

función distancia 156-179distribución de certificados

crear, para iOS 206-208sintaxis punto 20DropTools Palette

aproximadamente 214animationEngine 215mergAccessory 215mergAnswerColor 215mergAV 215mergBanner 215mergDoc 215mergExt 215mergMessage 215mergMK 215mergPop 215mergReader 215mergSettings 215mergTweet 215mergXattr 215mergZXing 215

Efunciónedgepiecehuevotemporizador152 160e-mail de prueba, banco de pruebas deaplicaciones móviles

instalación, en los dispositivos 72externals 8, 216, 217

FFlash 132

GSección general 188genericRGB perfil decolor 138

Page 328: Live code manual Español

[ 226 ]

función GetDistance 179getPixel función 132

aproximadamente 133 pruebas134, 136

Gimp 133GMT 161Google Play

URL 209GPS 164Interfaz gráfica de usuario (GUI) 170Greenwich Mean Time. Ver GMT

H14 controladores dejerarquía, LiveCode

tarjetas, creandocódigo 14 15apilar estructura 14

scripts de inicio de tarjetasaproximadamente 177añadiendo, a app recordatorios 178-180

Software hiperactivo 202HyperCard 8

YoIconos área, imagen iOSartículo 192

seleccionar, para rompecabezas 146-151imageData del

aproximadamente 133mal uso de 134transferir 151-154

datos de imagen de formato 132, 133139 ImageDataTest pilainspector paleta

sobre 11usado, en aplicación de la calculadorasencilla 18

instaladorescrear, para iOS 202

controles de la interfazsobre 28botones rollover 28-30imágenes fijas de control 28Reproductor de vídeo de control 28

iOScertificado de distribución, creando para 206-208

Page 329: Live code manual Español

[ 227 ]

instaladores, creandopara 202 pruebas de64pruebas, iOS simulador utilizado 64

iOS Appla preparación de 200, 202

iOS nombres de código 57iOS Developer

convirtiendo 49-56iOS SDK

LiveCode, apuntando a 59, 60iOS sección

aproximadamente 189Configuración básica de aplicación 191, 192Construir para la configuración 190Esquema de URL personalizada 194Iconos de área 192Opciones de Orientación 194Requisitos y restricciones opciones 194Pantallas Splash 193Status Bar opción 195

iOS simuladorutilizando 64

iTunes ConnectURL 209

Jrompecabezas

la creación de 146imageData del, transfiriendo 151-154imagen, seleccionar 146-151piezas, creando 146-151eventos de toque, la creación de 155-157

KKeepers tarjeta

aproximadamente 125la creación de 126-128

archivo de almacén de claves 204Kindle Fuego

añadiendo, a ADB 62, 63con 61

Ldiseños, LiveCode con el Administrador deGeometría

alrededor del 93

Page 330: Live code manual Español

[ 226 ]

botones, posicionando 94diseños, utilizando MobGUI95 diseños, utilizando uncontrolador de cambio detamaño

el 91 porcódigo simple ejemplo de diseño 92Lingo idioma 20

Links tarjetaaproximadamente 114manejador de init, añadiendo 118, 119enlaza función de extracción, lo que hace115-118118 eslabones perdidos

Enlaces controladortarjeta init

la adición de 118, 119Enlaces función de extracción

creando 115-118Linux artículo 189LiveCode

aproximadamente 7, 69, 131, 187personalizados complementos, creando216depuración 30-32Diccionario 9descargar 9extiende 212jerarquía, creando 13Ayuda menú 9Historia 8iconos, arrastre de las herramientas depaleta 11, 12imageData del, mal uso de 134instalación de 9interfaz controla 28rompecabezas, la creación de 146principal de Windows 10metáforas 8MobGUI 83lecciones en línea 9Para utilizar los botones de estilo, lacreación de 79señalando, a SDK iOS 59, 60poiting para Android SDK 47, 48recordatorios de aplicación, la creación de170Recursos 9

Tutoriales en línea RunRev los 32tamaño de la pantalla y la orientación, el ajuste91Comience ventana Center 9banco de pruebas de aplicaciones móviles, lacreación de 70Tutoriales 9Guía del usuario 9Las muestras de usuario 9

Page 331: Live code manual Español

[ 227 ]

LiveCode aplicaciónotra pila, utilizando para el almacenamiento dedatos 107almacenamiento de datos pila, creando 107-109datos externos, carga 103datos externos, ahorrando 103apilar estructura 100archivo de texto, lectura 105, 106archivo de texto, escritura 105, 106URL, consulta 103-105Aplicación WebScraper, creando 110

LiveCode Gerente Geometríautilizado, para los diseños de 93

LiveCode móvil 35loadImage manejador 150ubicación de la tarjeta

creando 180-182

MMac artículo 189Herramienta Magic Wand 140, 147ventanas principales, LiveCode

sobre 10inspector paleta 11Message Box 11herramientas de paleta 11

makepuzzle manejador 153mapa

creando, de Estados Unidos 136-138maskData

aproximadamente 134utilizarse, por 139 de detección de colisiones

Tarjetas multimediaaproximadamente 121Enlaces para los medios, la extracción de 121,122

Medios de tarjetas de guionesla creación de 123, 125

mergAccessory 215mergAnswerColor 215mergAV 215mergBanner 215mergDoc 215mergExt 215mergMessage 215mergMK 215mergPop 215mergReader 215

Page 332: Live code manual Español

[ 228 ]

mergSettingsmergTweet 215215 215mergXattrmergZXing 215Message Box 11MetaCard 8MobGui 189MobGUI

alrededor del 83, 212descargar 84Cuenta con 88partida 85utilizado, para la creación de banco depruebas de aplicación 86-88utilizado, para los diseños de 95con 213de trabajo 213

MobGUI controles nativosel 88 porfunciones 89, 90

mouseColor función 136MouseEnter manejador 136mouseUp manejador 179moveCars manejador 144

Nubicación nativo

seguimiento 165-167newNumber booleano variable de 25, 26Nook 67notificación de mensajes 160numberPressed 21

OOpenCard evento 24Opciones de orientación, la sección 194 iOSPara utilizar los botones de estilo

la creación de 80crear, mapas de bits utilizado 80Photoshop, utilizado para la preparación deestados de botón

80-83

PPascal 132

Photoshopaproximadamente 133

Page 333: Live code manual Español

[ 229 ]

utilizado, para la preparación de los estados debotón 80-82

física dispositivo Androidconectar 61conectar, Fuego Kindle utiliza 61Fuego Kindle, añadiendo a ADB 62, 63

imágenes, banco de pruebas de aplicacionesmóviles

carga 77-79piezas

creando, por rompecabezas 146-151pixel 132Plus 8preopenstack manejador 155

Rraza imagen del coche

creando 141-145hipódromo

la creación de 139, 140regex 114regexp 114recordatorio 159, 160pantallas recordatorio de aplicaciones

creando 170-174recordatorio formulario de entrada 182-185recordatorios de aplicación

tarjetas, trazando 170-174la creación de 170formulario de entrada 182-185Scripts de inicio de tarjetas, añadiendo 178-180ubicación de la tarjeta, creando 180-182pantallas, creando 170-174apilar las funciones de nivel, añadiendo 174-177

Requisitos y Restricciones, opciones de Androidartículo

198Requisitos y opciones Restricciones, iOS

artículo194

resetpuzzle manejador 153cambiar el tamaño de controlador de

utilizado, para los diseños de 91returnInField mensaje 174RGB valora 132botones rollover 28-30RunRev.com 133Tutoriales en línea RunRev los 32Runtime Revolution 8, 211

Page 334: Live code manual Español

[ 228 ]

Stamaño de la pantalla y la orientación

ajuste 91diseño, utilizando LiveCode GerenteGeometría 93diseño, utilizando MobGUI 95diseño, utilizando controlador de cambio detamaño 91otros tamaños 96

14 guioneslista de la compra 160showData función 175, 176aplicación de la calculadora sencilla

botones de la calculadora, la creación de 19controladores de tarjetas, añadiendo 22, 23la creación de 18ampliar 27inspector paleta, utilizando 18Las variables 24

simple pilapruebas, en los simuladores de 65, 66probando, en los dispositivos 66, 67

Pantallas Splash opción, iOS sección 193pila de secuencias de comandos de nivel

aproximadamente 174añadiendo, a app recordatorios 174-177

pila de tarjetas 8Stacks 8Pilas artículo 189apilar estructura

aproximadamente 100código impulsado 100ubicaciones de código 101-103diseños creados manualmente 100

estructura de pila, jerarquía LiveCode 14Standalone Settings Opciones de aplicación

aproximadamente 188Android artículo 196Copiar archivos del artículo 189General de la Sección 188iOS artículo 189Pilas artículo 189

Status Bar opción, iOS artículo 195Imagen fija de control 28SuperCard 8

Tnavegación por pestañas, WebScraper

la creación de 110, 111nombres sabrosos código

Ice Cream Sandwich 48Jelly Bean 48Key Lime Pie 48

banco de pruebas de aplicaciones móvilescrear, MobGUI utilizado 86-88selector de fechas, mostrando 77correo electrónico de escritorio de aplicaciones,invocando 72e-mail de prueba, instalar en dispositivos de 72aplicación del navegador nativo, llamando a 75nativa aplicación de correo electrónico, llamando a 72imágenes, carga de 77-79la creación de 70pila del banco de pruebas, la creación de 70, 71tratando, en los dispositivos 73, 74página web, apertura 75

probadoresAndroid App, enviando a 199

TestFlightApp.comaproximadamente 204URL 204

Texto de la cartaaproximadamente 120la creación de 120

medición del tiempo las funciones de utilidadcreando 161-164

recolectores de tiempocreando 161-164

tmControl 213, 214lista de tareas pendientes 160herramientas de paleta

sobre 11iconos, arrastre de 11, 12

toRand función 179eventos de toque

la creación, por rompecabezas 155-157touchMove evento 156

UID de dispositivo único (UDID) 200

Page 335: Live code manual Español

[ 229 ]

Unix Time 161Opciones de interfaz de usuario de Android,sección 199UTC (Tiempo Universal Coordinado) 161

Vlas variables

alrededor del 24 porcurrentcommand variable de 25CurrentValue variable 26newNumber variable booleana 25

tipos de variables 24-26detallado sintaxis 20Reproductor de vídeo de control 28

Wpágina web, banco de pruebas deaplicaciones móviles

aplicación del navegador nativo, llamandoa 75

la apertura de 75WebScraper aplicación

Navegador tarjeta 112la creación de 110, 111Guardianes de la tarjeta 125Links tarjeta 114121 tarjetas multimedianavegación por pestañas, la creación de 110Texto de la carta 120

Web del artículo189

Ventanas artículo 189

XXcode

instalando 57-59

Page 336: Live code manual Español

[ 230 ]

Page 337: Live code manual Español

Guía para principiantes

Acerca de Packt PublishingPackt, que se pronuncia 'lleno', publicó su primer libro "Mastering phpMyAdmin para una eficazgestión de privilegios" en abril de 2004 y, posteriormente, continuó especializan en la publicación delibros muy centrados en tecnologías y soluciones específicas.

Nuestros libros y publicaciones de compartir las experiencias de sus compañeros de los profesionalesde TI en la adaptación y personalización de los sistemas de hoy en día, las aplicaciones y los marcos.Nuestras soluciones basadas en libros que dan el conocimiento y el poder para personalizar elsoftware y las tecnologías que está utilizando para hacer el trabajo. Packt libros son más específicos ymenos generales que las TI libros que hemos visto en el pasado. Nuestro modelo de negocio único quenos permite ofrecerte la información más específica, dándole más de lo que usted necesita saber, ymenos de lo que no.

Packt es una empresa moderna, la edición y único, que se centra en la producción de calidad y devanguardia libros para las comunidades de desarrolladores, administradores y novatos por igual. Paraobtener más información, por favor visite nuestro sitio web: www.PacktPub.com.

Escribir para PacktDamos la bienvenida a todas las preguntas de la gente que está interesada en la edición. Propuestas de librosdeben ser enviados [email protected]. Si su idea del libro se encuentra todavía en una etapatemprana y que le gustaría discutiren primer lugar, antes de escribir una propuesta de libro formal, póngase en contacto con nosotros yuno de nuestros editores puesta en servicio se pondrá en contacto con usted.

No estamos sólo en busca de autores publicados, si usted tiene fuertes habilidades técnicas, pero noexperiencia de escritura, nuestros editores experimentados pueden ayudarle a desarrollar una carreracomo escritor, o simplemente obtener alguna recompensa adicional por su experiencia.

Page 338: Live code manual Español

Thank you for buyingLiveCode Mobile Development

Sencha Touch RecetarioISBN: 978-1-849515-44-3Paperback: 350 páginas

Más de 100 recetas para crear HTML-5basados en plataformas de aplicacionespara dispositivos táctiles

1.Master multiplataforma de desarrollo de aplicaciones

2.Incorporate ubicación geográfica en susaplicaciones

3.Desarrollar nativos que buscan aplicaciones web

PhoneGap de aplicaciones móvilesDesarrollo libro de cocinaISBN: 978-1-849518-58-1Paperback: 316 páginas

Más de 50 recetas para crear aplicaciones móviles que utilizan laPhoneGap API con ejemplos e instrucciones claras

1.Use la PhoneGap API para crear aplicaciones nativasmóviles que funcionan en una amplia gama dedispositivos móviles

2.Discover las características nativas de los dispositivos yfunciones que puede acceder e incluir dentro desus aplicaciones

3.Packed con ejemplos claros y concisos que lemuestre cómo construir fácilmente aplicacionesmóviles nativas

Por favor, compruebe www.PacktPub.com para obtener información sobrenuestros títulos

Page 339: Live code manual Español

Cocos2d para iPhone 1 JuegoDesarrollo libro de cocinaISBN: 978-1-849514-00-2Paperback: 446 páginas

Más de 90 recetas para el desarrollo de iOS juego2D utilizando cocos2d

1.Discover avanzado Cocos2d, OpenGL, y lastécnicas para iOS que abarcan todas las áreasdel proceso de desarrollo de juegos

2.Learn cómo crear desde arriba juegos isométricos,juegos de plataformas de desplazamientolateral, y los juegos con la iluminación realista

3.Full de la diversión y las recetas atractivas conlas bibliotecas modulares que pueden serconectados a su proyecto

Corona SDK Juegos para móvilDesarrollo: Guía para principiantesISBN: 978-1-849691-88-8Paperback: 408 páginas

Crea juegos monetizados para iOS y Android conel mínimo coste y el código

1.Build una vez y desplegar sus juegos tanto para iOS yAndroid

e

2.Crear juegos de éxito comercial mediante laaplicación de diversas técnicas y herramientas demonetización

3.Cree tres juegos de diversión e integración conredes sociales como Twitter y Facebook

Por favor, compruebe www.PacktPub.com para obtener información sobrenuestros títulos

Page 340: Live code manual Español