ผลิตภัณฑ์
Call
สร้างฟังก์ชันการโทรผ่านวิดีโอและเสียงภายในแอปได้อย่างง่ายดาย
Room
เพิ่มฟีเจอร์การประชุมลงในแอปของคุณด้วย Room SDK
Live
เพิ่มการไลฟ์สตรีมวิดีโอและเสียงแบบโต้ตอบลงในแอปของคุณ
Chat
เพิ่มประสบการณ์การรับส่งข้อความให้กับแอปของคุณด้วย Chat API
Push
เข้าถึงและกระตุ้นให้ผู้ใช้กลับมามีส่วนร่วมอีกครั้งได้ทันทีด้วย App Push และ Web Push
RTC Engine
ยกระดับการสื่อสารแบบเรียลไทม์ภายในแอปด้วย RTC SDK
In-game Voice Chat
สร้างแชตเสียงในเกมที่สมจริงด้วย GVoice SDK
Beauty AR
ผสานรวม Beauty AR สำหรับภาพและวิดีโอแบบเรียลไทม์
โซลูชัน

สร้างขึ้นเพื่อ FLUTTER

Flutter
Chat UI Kit

สร้างหน้าจอรับส่งข้อความที่เชื่อมต่อกันด้วย Flutter Chat UI Kit ของ Tencent RTC ปรับวิดเจ็ตการสนทนาและข้อความให้เข้ากับเลย์เอาต์และการนำทางของผลิตภัณฑ์

แหล่งข้อมูลสำหรับนักพัฒนา

เอกสารและตัวอย่าง Chat UI Kit สำหรับ Flutter

สร้างมาเพื่อการสนทนา

มอบพื้นที่ส่วนกลางให้ชุมชนของคุณสำหรับวางแผน แชร์รูปภาพ และพูดคุยในชีวิตประจำวัน

พื้นที่สำหรับทุกข้อความ

นำแชทไปใช้กับหน้าจอขนาดกะทัดรัดและเลย์เอาต์ที่กว้างขึ้นด้วยคอมโพเนนต์ Flutter

ความสามารถด้านแชทของ FLUTTER

ฟีเจอร์สำคัญ พร้อมเชื่อมต่อ

รายการการสนทนา

  • การสนทนาล่าสุด
  • ตัวบ่งชี้ข้อความที่ยังไม่ได้อ่าน

UI การส่งข้อความ

  • มุมมองข้อความที่ผสานการทำงานแล้ว
  • เครื่องมือเขียนข้อความแบบผสานรวม

การแชร์สื่อ

  • รูปภาพและไฟล์แนบ
  • สิทธิ์เข้าถึงสื่อแบบเนทีฟ

ผู้คนและกลุ่ม

  • การสนทนาโดยตรง
  • การโต้ตอบในกลุ่ม

ทำให้เป็นของคุณเอง

  • ปรับซอร์สโค้ด UI
  • ปรับให้เข้ากับการนำทางของคุณ

คอมโพเนนต์ที่เชื่อมต่อกัน

  • Chat SDK ที่ทำงานอยู่เบื้องหลัง
  • ข้อมูลประจำตัวแอปพลิเคชันของคุณ

สำรวจ Flutter Chat Components

ดูว่าคอมโพเนนต์ต่างๆ ทำงานร่วมกันอย่างไร

บทสนทนา

พื้นที่สำหรับการสนทนาของคุณ

เพิ่มวิดเจ็ตการสนทนาลงในแอป Chat ที่เริ่มต้นระบบแล้ว

อ่านเอกสาร
conversations.dart
import 'package:tencent_cloud_chat_conversation/tencent_cloud_chat_conversation.dart';

const TencentCloudChatConversation()

การปรับแต่ง

ปรับแต่ง UI แชท Flutter ของคุณ

นำสไตล์ภาพและโฟลว์ของแอปพลิเคชันมาใช้ในแชต

แบรนด์ของคุณในทุกการสนทนา

ปรับรูปแบบภาพผ่านธีมและ builder ของ Flutter UI Kit

อ่านเอกสาร

เริ่มต้นใช้งาน

การสนทนาครั้งแรกของคุณเริ่มต้นที่นี่

  1. 01

    สร้างแอปของคุณ

    ตั้งค่าแอปพลิเคชัน Chat และผู้ใช้ทดสอบ

    เปิดคอนโซล Chat
  2. 02

    เพิ่ม Chat UI Kit สำหรับ Flutter

    ทำตามคู่มือแพลตฟอร์มเพื่อเชื่อมต่อโปรเจกต์ของคุณ

    ทำตามคู่มือการผสานรวม
  3. 03

    เชื่อมต่อผู้ใช้ของคุณ

    ลงชื่อเข้าใช้ด้วยผู้ใช้ทดสอบสองราย แล้วส่งข้อความแรกของคุณ

    เชื่อมต่อผู้ใช้ของคุณ
Chat UI Kit สำหรับ Flutter
เทอร์มินัล
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()

คำถามที่พบบ่อยเกี่ยวกับ Flutter Chat UI Kit

ต้องกำหนดค่าอะไรบ้างก่อนเพิ่มวิดเจ็ต

ติดตั้งแพ็กเกจ UI ที่เลือก เริ่มต้น UI Kit ลงชื่อเข้าใช้ และลงทะเบียนคอมโพเนนต์ตามเดโมอย่างเป็นทางการ กำหนดค่าสิทธิ์แบบเนทีฟสำหรับฟีเจอร์สื่อที่คุณใช้ Flutter UI Kit และ Core SDK มีข้อกำหนดด้านสภาพแวดล้อมแยกกัน

Flutter UI Kit แตกต่างจาก SDK อย่างไร

UI Kit เพิ่มคอมโพเนนต์อินเทอร์เฟซที่ผสานการทำงานแล้วบน SDK การรับส่งข้อความ ใช้ Core SDK เมื่อต้องการสร้างอินเทอร์เฟซทั้งหมดด้วยตนเอง

ฉันจะยืนยันตัวตนผู้ใช้ของ Flutter Chat UI Kit ได้อย่างไร

สร้าง UserSig สำหรับ production ที่ backend แล้วส่งให้ไคลเอนต์เพื่อยืนยันตัวตน โดยเก็บข้อมูลลับของแอปพลิเคชันไว้บนเซิร์ฟเวอร์

ข้อมูลโค้ด Flutter เหล่านี้ประกอบกันเป็นแอปพลิเคชันที่สมบูรณ์หรือไม่

เนื้อหาเหล่านี้แสดงขั้นตอนการผสานรวมแต่ละขั้น โปรดทำตามคู่มือฉบับเต็มสำหรับการนำเข้า การเริ่มต้นระบบ การเข้าสู่ระบบ การจัดการข้อผิดพลาด และการกำหนดค่าเฉพาะเป้าหมาย ทดสอบการรับส่งข้อความด้วยบัญชีแยกกันก่อนเผยแพร่

ค่าบริการตามการใช้งาน Flutter Chat UI Kit คิดอย่างไร?

การใช้งานบริการ Chat แบบโฮสต์เป็นไปตามแพ็กเกจที่คุณเลือก ตรวจสอบฟีเจอร์และโควตาที่รวมอยู่สำหรับแอปพลิเคชันของคุณ โดยปลั๊กอินเสริมและบริการ Call อาจมีข้อกำหนดแยกต่างหาก

จะผสานรวม Chat UI Kit Flutter กับ Dart ได้อย่างไร?

ติดตั้งแพ็กเกจ Flutter ตามเอกสารและตั้งค่าโปรเจ็กต์เนทีฟของแต่ละเป้าหมาย ทดสอบวงจรชีวิต widget ร่วมกับพฤติกรรม iOS และ Android เบื้องล่าง

จะทดสอบ Chat UI Kit Flutter ก่อนเผยแพร่แอปได้อย่างไร?

ตรวจสอบการเข้าสู่ระบบ ความพร้อม SDK เหตุการณ์ส่งรับ และสถานะข้อความหลังเชื่อมต่อใหม่

จะปรับแต่งอินเทอร์เฟซของ Chat UI Kit Flutter ได้อย่างไร?

สำหรับแพ็กเกจ tencent_cloud_chat_conversation ที่ใช้ในหน้านี้ ให้ส่ง TencentCloudChatConversationBuilders เพื่อปรับแต่งวิดเจ็ต เช่น conversationHeaderBuilder ตัวอย่างเช่น เปลี่ยนส่วนหัวของรายการเป็นชื่อผลิตภัณฑ์และทางเข้าสู่การค้นหาของคุณ โดยคงการเชื่อมต่อรายการสนทนาไว้ ตรวจสอบให้ซิกเนเจอร์ของ builder ตรงกับรุ่นแพ็กเกจที่ติดตั้ง API เหล่านี้เป็นของแพ็กเกจตระกูลนี้ จึงไม่ควรนำไปใช้ปะปนกับตัวอย่าง TIMUIKitChat รุ่นเก่าหรือ UI Kit สำหรับ Flutter คนละชุด

ค้นหาความช่วยเหลือสำหรับขั้นตอนถัดไป

พูดคุยเกี่ยวกับแอปพลิเคชันของคุณ

พูดคุยเกี่ยวกับผลิตภัณฑ์ ปริมาณการใช้งานที่คาดการณ์ และความต้องการด้านการผสานรวมของคุณ

ติดต่อฝ่ายขาย

สร้างประสบการณ์การสนทนาครั้งต่อไปของคุณ

สร้าง app ของคุณด้วย Chat UI Kit สำหรับ Flutter