Introducción a 3D Touch en Xamarin.iOS

En este artículo se explica el uso de los nuevos gestos i Teléfono 6s e i Teléfono 6s Plus 3D Touch en la aplicación.

Examples of 3D Touch enabled apps

En este artículo se proporcionará e introducción al uso de las nuevas API 3D Touch para agregar gestos sensibles a la presión a las aplicaciones de Xamarin.iOS que se ejecutan en los nuevos dispositivos iPhone 6s y iPhone 6s Plus.

Con 3D Touch, una aplicación i Teléfono ahora es capaz de no solo decir que el usuario está tocando la pantalla del dispositivo, pero es capaz de detectar la presión que el usuario está ejercendo y responder a los diferentes niveles de presión.

3D Touch proporciona las siguientes características a la aplicación:

  • Sensibilidad a la presión: las aplicaciones ahora pueden medir la fuerza con la que el usuario toca la pantalla y aprovechar esa información. Por ejemplo, una aplicación de dibujo puede hacer que una línea sea más gruesa o más fina en función de la fuerza con la que el usuario toca la pantalla.
  • Peek and Pop: ahora la aplicación puede permitir que el usuario interactúe con sus datos sin tener que navegar fuera de su contexto actual. Al presionar de forma dura en la pantalla la pantalla, pueden ver el elemento en el que están interesados (como obtener una vista previa de un mensaje). Al presionar más duro, pueden entrar en el elemento.
  • Acciones rápidas: imagine que Acciones rápidas son como los menús contextuales que aparecen cuando un usuario hace clic con el botón derecho en un elemento de una aplicación de escritorio. Con Acciones rápidas, puede agregar accesos directos a las funciones de la aplicación directamente desde el icono de la aplicación en la pantalla Inicio.
  • Probar 3D Touch en el simulador : con el hardware mac correcto, puede probar aplicaciones habilitadas para 3D Touch en el simulador de iOS.

Sensibilidad a la presión

Como se indicó anteriormente, mediante el uso de nuevas propiedades de la clase UITouch puede medir la cantidad de presión que el usuario está aplicando a la pantalla del dispositivo iOS y usar esta información en la interfaz de usuario. Por ejemplo, hacer que un trazo de pincel sea más translúcido o opaco en función de la cantidad de presión.

A brush stroke rendered as more translucent or opaque based on the amount of pressure

Como resultado de 3D Touch, si la aplicación se ejecuta en iOS 9 (o superior) y el dispositivo iOS es capaz de admitir 3D Touch, los cambios en la presión harán que se genere el TouchesMoved evento.

Por ejemplo, al supervisar el TouchesMoved evento de una uiView, puede usar el código siguiente para obtener la presión actual que el usuario está aplicando a la pantalla:

public override void TouchesMoved (NSSet touches, UIEvent evt)
{
    base.TouchesMoved (touches, evt);
    UITouch touch = touches.AnyObject as UITouch;
    if (touch != null)
    {
        // Get the pressure
        var force = touch.Force;
        var maxForce = touch.MaximumPossibleForce;

        // Do something with the touch and the pressure
        ...
    }
}

La MaximumPossibleForce propiedad devuelve el valor más alto posible para la Force propiedad de UITouch en función del dispositivo iOS en el que se ejecuta la aplicación.

Importante

Los cambios en la presión harán que se genere el TouchesMoved evento, incluso si las coordenadas X/Y no han cambiado. Debido a este cambio de comportamiento, las aplicaciones de iOS deben estar preparadas para que el TouchesMoved evento se invoque con más frecuencia y que las coordenadas X/Y sean las mismas que la última TouchesMoved llamada.

Para obtener más información, consulta TouchCanvas de Apple : Uso de UITouch de forma eficaz y eficaz de la aplicación y la referencia de clase UITouch de Apple.

Inspección y pop

3D Touch proporciona nuevas formas para que un usuario interactúe con información dentro de la aplicación más rápido que nunca, sin tener que navegar desde su ubicación actual.

Por ejemplo, si la aplicación muestra una tabla de mensajes, el usuario puede presionar duro en un elemento para obtener una vista previa de su contenido en una vista superpuesta (lo que Apple hace referencia a como inspección).

An example of Peeking at content

Si el usuario presiona más duro, escribirá la vista de mensaje normal (que se conoce como Pop-ping en la vista).

Comprobación de la disponibilidad táctil 3D

Al trabajar con un UIViewController , puede usar el código siguiente para ver si el dispositivo iOS en el que se ejecuta la aplicación es compatible con 3D Touch:

public override void TraitCollectionDidChange(UITraitCollection previousTraitCollection)
{
    //Important: call the base function
    base.TraitCollectionDidChange(previousTraitCollection);

    //See if the new TraitCollection value includes force touch
    if (TraitCollection.ForceTouchCapability == UIForceTouchCapability.Available) {
        //Do something with 3D touch, for instance...
        RegisterForPreviewingWithDelegate (this, View);
        ...

Se puede llamar a este método antes o despuésViewDidLoad().

Control de inspección y pop

En un dispositivo iOS que puede controlar 3D Touch, podemos usar una instancia de la UIViewControllerPreviewingDelegate clase para controlar la visualización de detalles del elemento Peek y Pop . Por ejemplo, si teníamos un controlador de vista de tabla denominado MasterViewController podríamos usar el código siguiente para admitir Peek y Pop:

using System;
using System.Collections.Generic;
using UIKit;
using Foundation;
using CoreGraphics;

namespace DTouch
{
    public class PreviewingDelegate : UIViewControllerPreviewingDelegate
    {
        #region Computed Properties
        public MasterViewController MasterController { get; set; }
        #endregion

        #region Constructors
        public PreviewingDelegate (MasterViewController masterController)
        {
            // Initialize
            this.MasterController = masterController;
        }

        public PreviewingDelegate (NSObjectFlag t) : base(t)
        {
        }

        public PreviewingDelegate (IntPtr handle) : base (handle)
        {
        }
        #endregion

        #region Override Methods
        /// Present the view controller for the "Pop" action.
        public override void CommitViewController (IUIViewControllerPreviewing previewingContext, UIViewController viewControllerToCommit)
        {
            // Reuse Peek view controller for details presentation
            MasterController.ShowViewController(viewControllerToCommit,this);
        }

        /// Create a previewing view controller to be shown at "Peek".
        public override UIViewController GetViewControllerForPreview (IUIViewControllerPreviewing previewingContext, CGPoint location)
        {
            // Grab the item to preview
            var indexPath = MasterController.TableView.IndexPathForRowAtPoint (location);
            var cell = MasterController.TableView.CellAt (indexPath);
            var item = MasterController.dataSource.Objects [indexPath.Row];

            // Grab a controller and set it to the default sizes
            var detailViewController = MasterController.Storyboard.InstantiateViewController ("DetailViewController") as DetailViewController;
            detailViewController.PreferredContentSize = new CGSize (0, 0);

            // Set the data for the display
            detailViewController.SetDetailItem (item);
            detailViewController.NavigationItem.LeftBarButtonItem = MasterController.SplitViewController.DisplayModeButtonItem;
            detailViewController.NavigationItem.LeftItemsSupplementBackButton = true;

            // Set the source rect to the cell frame, so everything else is blurred.
            previewingContext.SourceRect = cell.Frame;

            return detailViewController;
        }
        #endregion
    }
}

El GetViewControllerForPreview método se usa para realizar la operación Peek . Obtiene acceso a la celda de la tabla y a los datos de respaldo y, a continuación, carga DetailViewController desde el guión gráfico actual. Al establecer en PreferredContentSize (0,0) se solicita el tamaño de vista de inspección predeterminado. Por último, desenfocamos todo, pero la celda con previewingContext.SourceRect = cell.Frame la que estamos mostrando y devuelvemos la nueva vista para su visualización.

La CommitViewController reutilización de la vista que creamos en la vista Peek para la vista Pop cuando el usuario presiona más difícil.

Registro para Peek y Pop

Desde el controlador de vista desde el que queremos permitir que el usuario vea y pop elementos, es necesario registrarse para este servicio. En el ejemplo anterior de un controlador de vista de tabla (MasterViewController), usaríamos el código siguiente:

public override void ViewDidLoad ()
{
    base.ViewDidLoad ();

    // Check to see if 3D Touch is available
    if (TraitCollection.ForceTouchCapability == UIForceTouchCapability.Available) {
        // Register for Peek and Pop
        RegisterForPreviewingWithDelegate(new PreviewingDelegate(this), View);
    }
    ...

}

Aquí se llama al RegisterForPreviewingWithDelegate método con una instancia de la PreviewingDelegate que hemos creado anteriormente. En dispositivos iOS que admiten 3D Touch, el usuario puede presionar duro en un elemento para verlo. Si presionan aún más, el elemento aparecerá en la vista de visualización estándar.

Para obtener más información, consulte nuestro ejemplo de ApplicationShortcuts de iOS 9 y ViewControllerPreviews de Apple : Using the UIViewController previewing API sample app, UIPreviewAction Class Reference, UIPreviewActionGroup Class Reference y UIPreviewActionItem Protocol Reference.

Acciones rápidas

Con 3D Touch y Acciones rápidas, puedes agregar accesos directos comunes, rápidos y fáciles de acceder a las funciones de la aplicación desde el icono de pantalla inicio del dispositivo iOS.

Como se indicó anteriormente, puede considerar acciones rápidas como los menús contextuales que pueden aparecer cuando un usuario hace clic con el botón derecho en un elemento de una aplicación de escritorio. Debe usar Acciones rápidas para proporcionar accesos directos a las funciones o características más comunes de la aplicación.

An example of a Quick Actions menu

Definición de acciones rápidas estáticas

Si una o varias de las acciones rápidas que requiere la aplicación son estáticas y no es necesario cambiarlas, puede definirlas en el archivo de Info.plist la aplicación. Edite este archivo en un editor externo y agregue las siguientes claves:

<key>UIApplicationShortcutItems</key>
<array>
    <dict>
        <key>UIApplicationShortcutItemIconType</key>
        <string>UIApplicationShortcutIconTypeSearch</string>
        <key>UIApplicationShortcutItemSubtitle</key>
        <string>Will search for an item</string>
        <key>UIApplicationShortcutItemTitle</key>
        <string>Search</string>
        <key>UIApplicationShortcutItemType</key>
        <string>com.company.appname.000</string>
    </dict>
    <dict>
        <key>UIApplicationShortcutItemIconType</key>
        <string>UIApplicationShortcutIconTypeShare</string>
        <key>UIApplicationShortcutItemSubtitle</key>
        <string>Will share an item</string>
        <key>UIApplicationShortcutItemTitle</key>
        <string>Share</string>
        <key>UIApplicationShortcutItemType</key>
        <string>com.company.appname.001</string>
    </dict>
</array>

Aquí definimos dos elementos de acción rápida estáticos con las siguientes claves:

  • UIApplicationShortcutItemIconType - Define el icono que mostrará el elemento Acción rápida como uno de los siguientes valores:

    • UIApplicationShortcutIconTypeAdd
    • UIApplicationShortcutIconTypeAlarm
    • UIApplicationShortcutIconTypeAudio
    • UIApplicationShortcutIconTypeBookmark
    • UIApplicationShortcutIconTypeCapturePhoto
    • UIApplicationShortcutIconTypeCaptureVideo
    • UIApplicationShortcutIconTypeCloud
    • UIApplicationShortcutIconTypeCompose
    • UIApplicationShortcutIconTypeConfirmation
    • UIApplicationShortcutIconTypeContact
    • UIApplicationShortcutIconTypeDate
    • UIApplicationShortcutIconTypeFavorite
    • UIApplicationShortcutIconTypeHome
    • UIApplicationShortcutIconTypeInvitation
    • UIApplicationShortcutIconTypeLocation
    • UIApplicationShortcutIconTypeLove
    • UIApplicationShortcutIconTypeMail
    • UIApplicationShortcutIconTypeMarkLocation
    • UIApplicationShortcutIconTypeMessage
    • UIApplicationShortcutIconTypePause
    • UIApplicationShortcutIconTypePlay
    • UIApplicationShortcutIconTypeProhibit
    • UIApplicationShortcutIconTypeSearch
    • UIApplicationShortcutIconTypeShare
    • UIApplicationShortcutIconTypeShuffle
    • UIApplicationShortcutIconTypeTask
    • UIApplicationShortcutIconTypeTaskCompleted
    • UIApplicationShortcutIconTypeTime
    • UIApplicationShortcutIconTypeUpdate

    UIApplicationShortcutIconType imagery

  • UIApplicationShortcutItemSubtitle - Define el subtítulo del elemento.

  • UIApplicationShortcutItemTitle : define el título del elemento.

  • UIApplicationShortcutItemType : es un valor de cadena que usaremos para identificar el elemento en nuestra aplicación. Consulte la sección siguiente para obtener más información.

Importante

No se puede tener acceso a los elementos de acceso directo de acción rápida establecidos en el Info.plist archivo con la Application.ShortcutItems propiedad . Solo se pasan al controlador de HandleShortcutItem eventos.

Identificación de elementos de acción rápida

Como ha visto anteriormente, al definir los elementos de acción rápida en la aplicación Info.plist, asignó un valor de cadena a la UIApplicationShortcutItemType clave para identificarlos.

Para que esos identificadores sean más fáciles de trabajar con en el código, agregue una clase llamada ShortcutIdentifier al proyecto de la aplicación y haga que tenga un aspecto similar al siguiente:

using System;

namespace AppSearch
{
    public static class ShortcutIdentifier
    {
        public const string First = "com.company.appname.000";
        public const string Second = "com.company.appname.001";
        public const string Third = "com.company.appname.002";
        public const string Fourth = "com.company.appname.003";
    }
}

Control de una acción rápida

A continuación, debes modificar el archivo de la AppDelegate.cs aplicación para controlar el usuario seleccionando un elemento acción rápida en el icono de la aplicación en la pantalla Inicio.

Haga los siguientes cambios:

using System;
...

public UIApplicationShortcutItem LaunchedShortcutItem { get; set; }

public bool HandleShortcutItem(UIApplicationShortcutItem shortcutItem) {
    var handled = false;

    // Anything to process?
    if (shortcutItem == null) return false;

    // Take action based on the shortcut type
    switch (shortcutItem.Type) {
    case ShortcutIdentifier.First:
        Console.WriteLine ("First shortcut selected");
        handled = true;
        break;
    case ShortcutIdentifier.Second:
        Console.WriteLine ("Second shortcut selected");
        handled = true;
        break;
    case ShortcutIdentifier.Third:
        Console.WriteLine ("Third shortcut selected");
        handled = true;
        break;
    case ShortcutIdentifier.Fourth:
        Console.WriteLine ("Forth shortcut selected");
        handled = true;
        break;
    }

    // Return results
    return handled;
}

public override bool FinishedLaunching (UIApplication application, NSDictionary launchOptions)
{
    var shouldPerformAdditionalDelegateHandling = true;

    // Get possible shortcut item
    if (launchOptions != null) {
        LaunchedShortcutItem = launchOptions [UIApplication.LaunchOptionsShortcutItemKey] as UIApplicationShortcutItem;
        shouldPerformAdditionalDelegateHandling = (LaunchedShortcutItem == null);
    }

    return shouldPerformAdditionalDelegateHandling;
}

public override void OnActivated (UIApplication application)
{
    // Handle any shortcut item being selected
    HandleShortcutItem(LaunchedShortcutItem);

    // Clear shortcut after it's been handled
    LaunchedShortcutItem = null;
}

public override void PerformActionForShortcutItem (UIApplication application, UIApplicationShortcutItem shortcutItem, UIOperationHandler completionHandler)
{
    // Perform action
    completionHandler(HandleShortcutItem(shortcutItem));
}

En primer lugar, definimos una propiedad pública LaunchedShortcutItem para realizar un seguimiento del último elemento de acción rápida seleccionado por el usuario. A continuación, invalidamos el FinishedLaunching método y vemos si launchOptions se han pasado y si contienen un elemento de acción rápida. Si lo hacen, almacenamos la acción rápida en la LaunchedShortcutItem propiedad .

A continuación, invalidamos el OnActivated método y pasamos cualquier elemento de inicio rápido seleccionado al método en el HandleShortcutItem que se actuará. Actualmente solo estamos escribiendo un mensaje en la consola. En una aplicación real, controlaría lo que se necesitaba alguna vez. Una vez realizada la acción, se borra la LaunchedShortcutItem propiedad .

Por último, si la aplicación ya se estaba ejecutando, PerformActionForShortcutItem también se llamaría al método para controlar el elemento Acción rápida, por lo que es necesario invalidarlo y llamar también a nuestro HandleShortcutItem método.

Crear elementos de acción rápida dinámica

Además de definir elementos de acción rápida estática en el archivo de la Info.plist aplicación, puedes crear acciones rápidas dinámicas sobre la marcha. Para definir dos nuevas acciones rápidas dinámicas, edite AppDelegate.cs el archivo de nuevo y modifique el FinishedLaunching método para que tenga un aspecto similar al siguiente:

public override bool FinishedLaunching (UIApplication application, NSDictionary launchOptions)
{
    var shouldPerformAdditionalDelegateHandling = true;

    // Get possible shortcut item
    if (launchOptions != null) {
        LaunchedShortcutItem = launchOptions [UIApplication.LaunchOptionsShortcutItemKey] as UIApplicationShortcutItem;
        shouldPerformAdditionalDelegateHandling = (LaunchedShortcutItem == null);
    }

    // Add dynamic shortcut items
    if (application.ShortcutItems.Length == 0) {
        var shortcut3 = new UIMutableApplicationShortcutItem (ShortcutIdentifier.Third, "Play") {
            LocalizedSubtitle = "Will play an item",
            Icon = UIApplicationShortcutIcon.FromType(UIApplicationShortcutIconType.Play)
        };

        var shortcut4 = new UIMutableApplicationShortcutItem (ShortcutIdentifier.Fourth, "Pause") {
            LocalizedSubtitle = "Will pause an item",
            Icon = UIApplicationShortcutIcon.FromType(UIApplicationShortcutIconType.Pause)
        };

        // Update the application providing the initial 'dynamic' shortcut items.
        application.ShortcutItems = new UIApplicationShortcutItem[]{shortcut3, shortcut4};
    }

    return shouldPerformAdditionalDelegateHandling;
}

Ahora comprobamos si application ya contiene un conjunto de creados ShortcutItemsdinámicamente, si no se crean dos nuevos UIMutableApplicationShortcutItem objetos para definir los nuevos elementos y agregarlos a la ShortcutItems matriz.

El código que ya hemos agregado en la sección Control de una acción rápida anterior controlará estas acciones rápidas dinámicas como las estáticas.

Se debe tener en cuenta que puede crear una combinación de elementos de acción rápida estática y dinámica (como estamos haciendo aquí), no se limita a uno o al otro.

Para obtener más información, consulte nuestro ejemplo viewControllerPreview de iOS 9 y vea ApplicationShortcuts de Apple: Using UIApplicationShortcutItem sample app, UIApplicationShortcutItem Class Reference, UIMutableApplicationShortcutItem Class Reference y UIApplicationShortcutIcon Class Reference.

Probar 3D Touch en el simulador

Al usar la versión más reciente de Xcode y el simulador de iOS en un equipo Mac compatible con un trackpad de force Touch, puede probar la funcionalidad 3D Touch en el simulador.

Para habilitar esta funcionalidad, ejecute cualquier aplicación en i Teléfono hardware simulado que admita 3D Touch (i Teléfono 6s y versiones posteriores). A continuación, seleccione el menú Hardware del simulador de iOS y habilite el elemento de menú Usar fuerza del controlador de seguimiento para 3D táctil :

Select the Hardware menu in the iOS Simulator and enable the Use Trackpad Force for 3D touch menu item

Con esta característica activa, puedes presionar más duro en el trackpad del Mac para habilitar 3D Touch como lo harías en el hardware real de i Teléfono.

Resumen

En este artículo se han introducido las nuevas API 3D Touch disponibles en iOS 9 para i Teléfono 6 e i Teléfono 6s Plus. Se ha tratado la adición de sensibilidad de presión a una aplicación; usar Peek y Pop para mostrar rápidamente información en la aplicación desde el contexto actual sin navegación; y usar Acciones rápidas para proporcionar accesos directos a las características más usadas de la aplicación.