Call Buttons

Add CometChat Flutter UI Kit call buttons for voice and video calling, call settings, and call-related user actions.

Overview

The CometChatCallButtons widget provides users with the ability to make calls, access call-related functionalities, and control call settings.

Usage

Integration

Dart

import 'package:cometchat_chat_uikit/cometchat_calls_uikit.dart';
import 'package:flutter/material.dart';

class CallButtonsExample extends StatefulWidget {
  const CallButtonsExample({super.key});

  @override
  State<CallButtonsExample> createState() => _CallButtonsExampleState();
}

class _CallButtonsExampleState extends State<CallButtonsExample> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Center(child: CometChatCallButtons()),
      ),
    );
  }
}

---

Actions

onError

Dart

CometChatCallButtons(
  onError: (e) {
    // Handle error
  },
)

---

Events

Event	Description
ccCallAccepted	Triggers when the outgoing call is accepted
ccCallRejected	Triggers when the outgoing call is rejected

Dart

class _YourScreenState extends State<YourScreen> with CometChatCallEventListener {
  @override
  void initState() {
    super.initState();
    CometChatCallEvents.addCallEventsListener("unique_listener_ID", this);
  }

  @override
  void dispose() {
    super.dispose();
    CometChatCallEvents.removeCallEventsListener("unique_listener_ID");
  }

  @override
  void ccCallAccepted(Call call) {
    // Handle call accepted
  }

  @override
  void ccCallRejected(Call call) {
    // Handle call rejected
  }
}

---

Customization

Style

Dart

CometChatCallButtons(
  callButtonsStyle: CometChatCallButtonsStyle(
    voiceCallIconColor: Color(0xFF6852D6),
    videoCallIconColor: Color(0xFF6852D6),
    voiceCallButtonColor: Color(0xFFEDEAFA),
    videoCallButtonColor: Color(0xFFEDEAFA),
    voiceCallButtonBorderRadius: BorderRadius.circular(12.5),
    videoCallButtonBorderRadius: BorderRadius.circular(12.5),
  ),
)

Functionality

Property	Description	Code
User	Set User object	user: User?
Group	Set Group object	group: Group?
CallSettingsBuilder	Configure call settings	callSettingsBuilder: CallSettingsBuilder?
Hide Video Call	Hide video call button	hideVideoCallButton: bool?
Hide Voice Call	Hide voice call button	hideVoiceCallButton: bool?
Video Call Icon	Custom video call icon	videoCallIcon: Icon?
Voice Call Icon	Custom voice call icon	voiceCallIcon: Icon?
Outgoing Call Configuration	Configure outgoing call	outgoingCallConfiguration: CometChatOutgoingCallConfiguration?