Ejercicio: crear una aplicación de lienzo de taller de reparación de bicicletas

  • 10 minutos

En este ejercicio aplicará los conocimientos adquiridos para completar el proceso de creación de una aplicación de lienzo basada en el diseño que creó en la unidad Ejercicio: diseñar una aplicación de taller de reparación de bicicletas utilizando Figma.

Escenario

Usted desea crear una aplicación de lienzo para sus compañeros basada en un diseño Figma. La aplicación permite a sus compañeros registrar asistentes potenciales a una venta VIP y recoger sus preferencias utilizando una tableta dedicada.

Capturará la información de los asistentes en una hoja de cálculo de Microsoft Excel para que el equipo de marketing pueda ponerse en contacto con los clientes antes y después del evento.

Pasos de preparación

Siga los pasos de la unidad Crear una aplicación de lienzo en un diseño Figma para utilizar el diseño de taller de reparación de bicicletas que ha creado. En el paso 11 puede llamar a la aplicación Evento VIP de bicicletas.

Descargue el archivo de hoja de cálculo de Excel Bicycle VIP registration.xlsx. Este archivo sirve como origen de datos de la aplicación. Guárdelo en una ubicación de Microsoft OneDrive para la Empresa a la que tenga acceso.

Captura de pantalla de la hoja de cálculo de Microsoft Excel llamada Bicycle VIP registration.

Ejercicio

Complete los siguientes pasos para crear la aplicación de lienzo que almacena los registros en la hoja de cálculo Bicycle VIP registration:

  1. Conéctese al origen de datos y, a continuación, seleccione Agregar datos en la sección Datos del panel izquierdo del estudio de lienzo de Power Apps.

    Power Apps. El foco está en la opción Agregar datos de la sección Datos del panel de navegación izquierdo.

  2. Seleccione Excel Online (Business) como origen de datos.

    Captura de pantalla del estudio de lienzo de Power Apps. El foco está en el origen de datos de Excel Online Business.

  3. Seleccione Conectar.

    Captura de pantalla del estudio de lienzo de Power Apps. El foco está en la opción Conectar del origen de datos de Excel Online Business.

  4. Vaya a la ubicación de la hoja de cálculo Bicycle VIP registration que guardó en la sección Pasos de preparación y luego seleccione la hoja de cálculo.

    Captura de pantalla del estudio de lienzo de Power Apps. El foco está en el archivo Excel Bicycle VIP registration.

  5. Seleccione Registrations como tabla y, a continuación, seleccione Conectar.

    Captura de pantalla del estudio de lienzo de Power Apps. El foco está en la tabla Registrations y en el botón Conectar.

  6. Seleccione la opción Usar columna única de tabla de Excel como identificador de Registrations, seleccione _PowerAppsId_ y, a continuación, seleccione Conectar.

    Captura de pantalla del estudio de lienzo de Power Apps. El foco está en el I D de Power Apps y en la opción Usar columna única de tabla de Excel.

  7. Para conectar el control msft_Form al origen de datos, actualice la propiedad DataSource a Registrations.

    Captura de pantalla del estudio de lienzo de Power Apps. El foco está en Registrations como propiedad de DataSource.

  8. Para garantizar la identificación de los controles en los siguientes pasos, seleccione Cambiar nombre de la tarjeta de datos y los componentes de entrada.

    Captura de pantalla del estudio de la aplicación de lienzo de Power Apps. El foco está Cambiar nombre para un control de tarjeta de datos.

    El resultado debe parecerse a la siguiente imagen.

    Captura de pantalla del estudio de lienzo de Power Apps. El foco está en los componentes con el nombre cambiado.

  9. Para conectar las tarjetas de datos a columnas en la tabla de Excel, indique el nombre de la columna para la propiedad DataField de cada control de tarjeta de datos, incluidas las comillas.

    • PreferencesDC: "Preference"

    • PhoneDC: "Phone"

    • CustomerEmailDC: "Email"

    • CustomerNameDC: "Name"

    Captura de pantalla del estudio de lienzo de Power Apps. El foco está en la propiedad DataField para PreferencesDC y en el valor de propiedad Preferencia.

  10. Para insertar los valores de la aplicación en la tabla de Excel, proporcione una propiedad de texto de control de entrada para la propiedad Update de cada control de tarjeta de datos.

    • PreferencesDC: PreferencesInput.SelectedText.Value

    • PhoneDC: PhoneInput.Text

    • CustomerEmailDC: CustomerEmailInput.Text

    • CustomerNameDC: CustomerNameInput.Text

    Captura de pantalla del estudio de lienzo de Power Apps. El foco está en la propiedad Update para PreferencesDC y en el valor de propiedad PreferencesInput.SelectedText.Value.

  11. Para guardar los valores en la hoja de cálculo de Excel y restablecer el formulario de la aplicación de lienzo en el modo de entrada de datos, configure la propiedad OnSelect del botón Enviar en SubmitForm(msft_Form); NewForm(msft_Form);.

    Captura de pantalla del estudio de lienzo de Power Apps. El foco está en la propiedad OnSelect de msft_Button.

Ahora tiene una aplicación completa que permite el registro de clientes para la próxima venta VIP. Para probar la aplicación, selecciona los iconos Guardar y Reproducir. Para compartir la aplicación con sus compañeros, seleccione el icono Compartir.

Captura de pantalla del estudio de lienzo de Power Apps. El foco está en los iconos Compartir, Reproducir y Guardar.

En el siguiente vídeo se explican los pasos que hay que seguir en esta unidad.

Siguientes pasos

Ha aprendido a crear una aplicación de lienzo basada en un diseño de Figma. Esta aplicación está conectada a un origen de datos y usted y sus compañeros pueden utilizarla para registrar la información y las preferencias del cliente para una venta VIP. A continuación puede validar lo que ha aprendido de este módulo.