Diálogos

Los cuadros de diálogo (denominados módulos de tareas en TeamsJS v1.x) permiten crear experiencias emergentes modales en la aplicación teams. En el elemento emergente, puede hacer lo siguiente:

  • Ejecute su propio código HTML o JavaScript personalizado.
  • Muestra un <iframe>widget basado en YouTube o Microsoft Stream vídeo.
  • Mostrar una tarjeta adaptable.

Los diálogos son útiles para iniciar y completar tareas o mostrar información enriquecida, como vídeos o paneles de Power Business Intelligence (BI). Una experiencia emergente suele ser más natural para los usuarios que inician y completan tareas en comparación con una pestaña o una experiencia de bot basada en conversación.

Los diálogos se basan en las pestañas de Microsoft Teams. Básicamente son una pestaña dentro de una ventana emergente. Usan la misma biblioteca cliente javaScript de Microsoft Teams (TeamsJS), por lo que si ha creado una pestaña, ya está familiarizado con la creación de un cuadro de diálogo.

Puede invocar diálogos de tres maneras:

  • Pestañas de canal o personales: con la biblioteca TeamsJS, puede invocar diálogos desde botones, vínculos o menús de la pestaña. Para obtener más información, consulte Uso de cuadros de diálogo en pestañas.
  • Bots: usar botones en las tarjetas enviadas desde el bot. Esto resulta útil cuando no se requiere que todos los usuarios de un canal vean lo que está haciendo con un bot. Por ejemplo, al hacer que los usuarios respondan a un sondeo en un canal, no resulta útil ver un registro de ese sondeo que se está creando. Para obtener más información, consulte Uso de diálogos de bots de Teams.
  • Fuera de Teams desde un vínculo profundo: también puede crear direcciones URL para invocar un cuadro de diálogo desde cualquier lugar. Para obtener más información, consulte sintaxis de vínculos profundos del cuadro de diálogo.

Componentes de un cuadro de diálogo

Este es el aspecto de un cuadro de diálogo cuando se invoca desde un bot:

ejemplo de cuadro de diálogo

Un cuadro de diálogo incluye lo siguiente, como se muestra en la imagen anterior:

  1. Icono de la coloraplicación.

  2. Nombre de la shortaplicación.

  3. Título del cuadro de diálogo especificado en la title propiedad del objeto DialogInfo.

  4. Botón cerrar o cancelar del cuadro de diálogo. Si el usuario selecciona este botón, la aplicación recibe un err evento. Para obtener más información, vea ejemplo para enviar el resultado de un cuadro de diálogo.

    Nota:

    Actualmente no es posible detectar el err evento cuando se invoca un cuadro de diálogo desde un bot.

  5. El rectángulo azul es donde aparece la página web si está cargando su propia página web mediante la url propiedad del objeto TaskInfo. Para obtener más información, vea Invocar y descartar diálogos.

  6. Si va a mostrar una tarjeta adaptable mediante la card propiedad del objeto TaskInfo, el relleno se agrega automáticamente. Para obtener más información, vea CSS para cuadros de diálogo HTML o JavaScript.

  7. Los botones de tarjeta adaptable se representan después de seleccionar Registrarse. Al usar su propia página, cree sus propios botones. Por diseño, el estilo de botón principal (sólido) se aplica a la última acción raíz de una tarjeta adaptable. Para todas las demás acciones, se aplica el estilo de botón predeterminado.

Paso siguiente

Vea también