CREADO PARA FLUTTER

Flutter
Chat UI Kit

Crea pantallas de mensajería conectadas con el Flutter Chat UI Kit de Tencent RTC. Adapta los widgets de conversaciones y mensajes al diseño y la navegación de tu producto.

RECURSOS PARA DESARROLLADORES

Documentación y ejemplos de Chat UI Kit para Flutter

Un espacio para cada mensaje

Incorpore el chat en pantallas compactas y diseños más amplios con componentes Flutter.

FUNCIONES DE CHAT PARA FLUTTER

Funciones esenciales, listas para conectar

Listas de conversaciones

  • Conversaciones recientes
  • Indicadores de mensajes no leídos

Interfaz de mensajería

  • Vistas de mensajes integradas
  • Un editor de mensajes integrado

Uso compartido de contenido multimedia

  • Fotos y archivos adjuntos
  • Permisos multimedia nativos

Personas y grupos

  • Conversaciones directas
  • Interacciones grupales

Hazlo tuyo

  • Adapta el código fuente de la interfaz
  • Adáptalo a tu navegación

Componentes conectados

  • Chat SDK subyacente
  • La identidad de tu aplicación

Explora Flutter Chat Components

Descubre cómo funcionan juntos los componentes.

Conversaciones

Un espacio para sus conversaciones

Añada el widget de conversación a su aplicación Chat inicializada.

Leer la documentación
conversations.dart
import 'package:tencent_cloud_chat_conversation/tencent_cloud_chat_conversation.dart';

const TencentCloudChatConversation()

PERSONALIZACIÓN

Personaliza tu interfaz de chat en Flutter

Incorpore su estilo visual y el flujo de su aplicación al chat.

Su marca en cada conversación

Ajuste el estilo visual mediante los temas y builders de Flutter UI Kit.

Leer la documentación

COMENZAR

Tu primera conversación empieza aquí

  1. 01

    Crea tu app

    Configura una aplicación de Chat y tus usuarios de prueba.

    Abrir la consola de Chat
  2. 02

    Añade Chat UI Kit para Flutter

    Sigue la guía de la plataforma para conectar tu proyecto.

    Sigue la Guía de integración
  3. 03

    Conecta a tus usuarios

    Inicia sesión con dos usuarios de prueba y envía tu primer mensaje.

    Conecta a tus usuarios
Chat UI Kit para Flutter
Terminal
flutter pub add tencent_cloud_chat_common \
  tencent_cloud_chat_conversation tencent_cloud_chat_message
conversations.dart
import 'package:tencent_cloud_chat_conversation/tencent_cloud_chat_conversation.dart';

const TencentCloudChatConversation()

Preguntas frecuentes sobre Flutter Chat UI Kit

¿Qué se debe configurar antes de añadir los widgets?

Instala los paquetes de UI seleccionados, inicializa el UI Kit, inicia sesión y registra los componentes siguiendo la demostración oficial. Configura los permisos nativos para las funciones multimedia que utilices. Flutter UI Kit y Core SDK tienen requisitos de entorno distintos.

¿En qué se diferencia Flutter UI Kit del SDK?

El UI Kit añade componentes de interfaz integrados sobre el SDK de mensajería. Usa el Core SDK si quieres crear toda la interfaz por tu cuenta.

¿Cómo autentico a los usuarios de Flutter Chat UI Kit?

Genera el UserSig de producción en tu backend. Envíalo al cliente para la autenticación y conserva el secreto de la aplicación en el servidor.

¿Estos fragmentos de Flutter forman una aplicación completa?

Muestran pasos individuales de la integración. Sigue la guía completa para las importaciones, la inicialización, el inicio de sesión, la gestión de errores y la configuración específica de la plataforma de destino. Prueba la mensajería con cuentas separadas antes del lanzamiento.

¿Cómo se calcula el precio de uso de Flutter Chat UI Kit?

El uso del servicio Chat alojado depende del plan seleccionado. Consulta las funciones y cuotas incluidas para tu aplicación; los plugins opcionales y los servicios Call pueden tener requisitos distintos.

¿Cómo integro Chat UI Kit Flutter con Dart?

Instala el paquete Flutter documentado y completa la configuración nativa de cada destino. Prueba el ciclo de vida de los widgets junto con el comportamiento subyacente de iOS y Android.

¿Cómo pruebo Chat UI Kit Flutter antes de publicar mi aplicación?

Comprueba inicio de sesión, disponibilidad del SDK, eventos de envío y recepción y estado de mensajes tras reconectar.

¿Cómo personalizo la interfaz de Chat UI Kit Flutter?

Para el paquete tencent_cloud_chat_conversation utilizado aquí, proporciona TencentCloudChatConversationBuilders para personalizar widgets como conversationHeaderBuilder. Por ejemplo, sustituye el encabezado de la lista por el título de tu producto y un acceso a la búsqueda, manteniendo conectada la lista de conversaciones. Asegúrate de que las firmas de los builders correspondan a la versión instalada del paquete. Estas API pertenecen a esta familia de paquetes; no las mezcles con ejemplos antiguos de TIMUIKitChat ni con otro UI Kit de Flutter.

Encuentra ayuda para el siguiente paso

Habla sobre tu aplicación

Conversa sobre tu producto, el uso previsto y tus necesidades de integración.

Contactar con Ventas

Crea tu próxima experiencia de conversación

Crea app con Chat UI Kit para Flutter.