En este tutorial, aprenderá cómo aprovechar las nuevas API y la funcionalidad de watchOS 2 para crear una aplicación nativa de Apple Watch. Esto incluye elementos de la interfaz del selector, animaciones nativas y controladores de alerta.
En WWDC 2015, Apple anunció la primera actualización importante de su plataforma Apple Watch, watchOS 2. Junto con muchas nuevas características y mejoras, el aspecto más importante de esta actualización para los desarrolladores es la capacidad de crear aplicaciones nativas de Apple Watch. Estas aplicaciones nativas se desempeñan mejor y brindan a los desarrolladores acceso a nuevas funciones, como la corona digital, el micrófono y los sensores de estado..
En este tutorial, te mostraré cómo crear una aplicación WatchKit nativa y describiré brevemente algunas de las nuevas API disponibles en watchOS 2. También te mostraré cómo actualizar una aplicación watchOS 1 no nativa existente a una aplicación watchOS 2 nativa..
Este tutorial requiere que esté ejecutando Xcode 7 en una Mac con OS X Yosemite (10.10) o posterior. Este tutorial se basa en los conceptos y las API de WatchKit disponibles en watchOS 1. Si aún no está familiarizado con el marco de WatchKit, comience con uno de nuestros tutoriales de introducción en WatchKit.
Abre Xcode y crea un nuevo proyecto. En Xcode 7, el nuevo asistente de proyecto incluye un watchOS Sección a la izquierda. Elegir la Aplicación iOS con la aplicación WatchKit plantilla de la watchOS> Aplicación sección. Hacer clic Siguiente continuar.
Complete la información como se muestra en la siguiente captura de pantalla. Desmarque las casillas de verificación en la parte inferior, porque no las necesitaremos para este tutorial.
Complete la configuración del proyecto y eche un vistazo a las carpetas que Xcode ha creado para nosotros. Debería ver tres grupos o carpetas en el Navegador de proyectos a la izquierda:
Antes de que podamos comenzar a agregar cualquier cosa, necesitamos configurar Xcode para construir y ejecutar el objetivo correcto. En la parte superior izquierda de su ventana de Xcode, al lado del botón de parada gris, haga clic en el esquema activo, Manifestación, y elige la siguiente opción:
Haga clic en el botón de reproducción para construir y ejecutar su aplicación. En tu dock, deberías ver aparecer dos iconos de simulador. Uno de ellos es el simulador regular de iOS, mientras que el otro es el simulador de reloj de Apple..
Si la pantalla en blanco de su aplicación Apple Watch no aparece automáticamente en el simulador de Apple Watch, complete los siguientes pasos:
1. Navegue a la Reloj de manzana aplicación en el simulador de iOS. Puede encontrar la aplicación Apple Watch en la segunda página de la pantalla de inicio.
2. Haga clic en la Demo.Celda de vista de tabla como se muestra abajo.
3. Habilitar el Mostrar aplicación en Apple Watch cambiar como se muestra abajo.
4. En el simulador de Apple Watch, navegue a la pantalla de inicio presionando Comando + Shift + H o eligiendo Casa desde el Hardware menú del simulador de reloj de Apple.
Si esto no funciona de inmediato, encienda y apague el interruptor del simulador de iOS. También puede ayudar a salir de Xcode y ejecutar la aplicación WatchKit nuevamente..
Si todo funciona correctamente, haga clic en el icono de la aplicación Apple Watch en el simulador de Apple Watch. Debería ver una pantalla negra con la hora en la parte superior derecha.
Es hora de comenzar a usar algunas de las nuevas API introducidas en watchOS 2. En Xcode, abra Interface.storyboard en el Demo WatchKit App carpeta y y agregar los siguientes componentes a la Controlador de interfaz de escena:
Seleccione el control deslizante y establezca su Máximo y Pasos propiedades para 5 en el Inspector de atributos.
Haga doble clic en el botón y cambie su título a "Mostrar alerta". Abre el Editor asistente para que tengas el storyboard a la izquierda y los contenidos de InterfaceController.swift a la derecha. Cree una salida para el control deslizante arrastrando el control del control deslizante en el guión gráfico al Controlador de interfaz
clase. Nombra la salida deslizador. Haz lo mismo con el selector y nombra la salida recogedor.
Control y arrastre desde el botón hasta el Controlador de interfaz
a la derecha para crear una acción. Nombra la acción showAlertPressed. Esta acción se ejecutará cuando el usuario toque el botón..
Cierra el Editor asistente a la derecha y abierto InterfaceController.swift en el editor de código de Xcode.
El control deslizante y el botón que agregó a la Controlador de interfaz
La clase debería ser familiar si has trabajado con el marco WatchKit. El selector, sin embargo, es uno de los nuevos elementos de interfaz disponibles en watchOS 2.
Un selector para Apple Watch está representado por el WKInterfacePicker
clase. Funciona de manera similar a su contraparte iOS, UIPickerView
. Los usuarios interactúan con un WKInterfacePicker
instancia pulsando en él, desplazándose a través de WKPickerItem
objetos con la corona digital, y luego toque de nuevo para seleccionar un elemento. UNA WKInterfacePicker
Puede mostrar artículos en uno de tres estilos diferentes:
WKInterfacePicker
estilo que admite elementos basados en texto y puede mostrar varios elementos a la vez.Para este tutorial, va a crear un selector de estilo de lista simple con elementos basados en texto. Agregue el siguiente código a awakeWithContext (_ :)
método de la Controlador de interfaz
clase:
override func awakeWithContext (context: AnyObject?) super.awakeWithContext (context) var pickerItems: [WKPickerItem] = [] para i en 1 ... 10 let item = WKPickerItem () item.title = "Picker item \ (i)" pickerItems.append (item) self.picker.setItems (pickerItems)
Construye y ejecuta tu aplicación. Verás que los primeros tres elementos del selector son visibles.
Para interactuar con el elemento de la interfaz del selector, haga clic una vez y luego desplace el mouse o el panel táctil de su Mac como lo haría normalmente. Esto simulará la corona digital del reloj. A continuación, podrá desplazarse por los elementos del selector.
Junto con los nuevos elementos de la interfaz y las nuevas formas para que los usuarios interactúen con las aplicaciones Apple Watch, watchOS 2 admite animaciones nativas para los objetos de la interfaz WatchKit. Los siguientes atributos de los elementos de la interfaz se pueden animar en las aplicaciones de watchOS 2:
La animación se realiza a través de una sola. WKInterfaceController
método de instancia, animateWithDuration (_: animaciones :)
. Como un simple ejemplo, usted va a animar el control deslizante haciéndolo desaparecer y reducirlo hacia la parte superior de la pantalla. Agregue el siguiente código a la se activará
método de la Controlador de interfaz
clase:
anular func willActivate () super.willActivate () self.animateWithDuration (5) () -> Void in self.slider.setHeight (0) self.slider.setAlpha (0)
Cree y ejecute su aplicación y, una vez que la aplicación haya terminado de ejecutarse, debería ver que el control deslizante se reduce y desaparece lentamente.
En el cierre de la animación, puede animar cualquiera de las propiedades enumeradas anteriormente. Esto se aplica a cualquiera de los elementos de la interfaz en su aplicación. Esto permite otro nivel de personalización en la interfaz de su aplicación y también proporciona una forma mucho más sencilla de ocultar y mostrar elementos..
watchOS 2 también permite que las aplicaciones presenten una interfaz de alerta muy similar a la de un UIAlertView
o UIAlertController
en iOS. Estas alertas se muestran llamando al presentAlertControllerWithTitle (_: message: preferredStyle: actions :)
método en un WKInterfaceController
ejemplo.
Los parámetros de título y mensaje de este método son cadenas que se muestran en la interfaz de la alerta. El tercer parámetro es un WKAlertControllerStyle
enumeración
Alerta
muestra una hoja de alerta con botones apilados y una predeterminada Cancelar botón en la parte inferior.SideBySideButtonsAlert
muestra dos botones uno al lado del otro.Hoja de acción
muestra uno o dos botones personalizados con una Cancelar botón en la esquina superior izquierda.El cuarto parámetro es una matriz de WKAlertAction
Objetos, que proporcionan detalles para los botones de alerta. Esta matriz debe contener al menos un objeto y para SideBySideButtonsAlert
debe contener dos.
UNA WKAlertAction
El objeto se crea con un título, estilo (WKAlertActionStyle.Default
, WKAlertActionStyle.Cancel
, o WKAlertActionStyle.Destructive
) y un bloque a ejecutar cuando se selecciona esa acción. Agregue el siguiente código al botón de showAlertPressed
acción:
@IBAction func showAlertPressed () let cancel = WKAlertAction (título: "Cancel", estilo: WKAlertActionStyle.Cancel, handler: () -> Void in) let action = WKAlertAction (title: "Action", estilo: WKAlertActionStyle. Default, handler: () -> Void in) self.presentAlertControllerWithTitle ("Alert", mensaje: "Ejemplo de interfaz de alerta de watchOS 2", preferredStyle: WKAlertControllerStyle.SideBySideButtonsAlert, actions: [cancel, action)))
Construye y ejecuta tu aplicación. Cuando presionas el Mostrar alerta botón, verá una interfaz de alerta animada y mostrará las dos acciones que creó.
Cuando abra un proyecto Xcode existente con una aplicación WatchKit en Xcode 7, aparecerá la siguiente advertencia en la Navegador de problemas a la izquierda:
Al hacer clic en la advertencia, se mostrará una lista de las configuraciones que deben cambiarse en su aplicación para hacer la transición de una aplicación WatchKit existente a watchOS 2. En la parte inferior, verá el siguiente elemento:
Si haces clic Realizar cambios, Xcode actualizará tu aplicación WatchKit existente por ti. Una vez que se completa la actualización, está listo para compilar, probar y enviar una aplicación nativa para watchOS 2.
Las nuevas API y características que aprendió en este tutorial son solo la punta del iceberg. Los elementos de la interfaz del selector, los controladores de alerta y las animaciones nativas son solo algunas de las nuevas características que puede aprovechar en sus aplicaciones Apple Watch en watchOS 2.
Estaremos publicando muchos más tutoriales en Tuts + en los próximos meses, que cubrirán las nuevas funciones y API disponibles en watchOS 2. Asegúrese de buscarlas y no dude en dejar cualquier comentario o pregunta que tenga en los comentarios a continuación..