> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-skills-v5-temp.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.
# Incoming Call
> Handle incoming CometChat Flutter UI Kit audio and video calls with full-screen caller info, accept, reject, and navigation setup.
| Field | Value |
| ------------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
| Component | `CometChatIncomingCall` |
| Package | `cometchat_chat_uikit` |
| Import | `import 'package:cometchat_chat_uikit/cometchat_calls_uikit.dart';` |
| Barrel | **Calls barrel only** — this widget does not resolve from `cometchat_chat_uikit.dart`. A screen showing chat *and* calling imports both. |
| Purpose | Handle incoming CometChat Flutter UI Kit audio and video calls with full-screen caller info, accept, reject, and navigation setup. |
| Data props | `call` · `user` |
| Actions | `onError` · `onDecline` · `onAccept` |
| View slots | `callSettingsBuilder` · `titleView` · `subTitleView` · `leadingView` · `itemView` · `trailingView` — [details](#custom-view-slots) |
| Styling | `incomingCallStyle` — the app `ThemeData` does not reach inside a kit widget, so scope colours here. |
| Prerequisites | `CometChatUIKit` initialised and a user logged in. |
| Full props | [21 props](#functionality) |
`CometChatIncomingCall` displays a full-screen overlay when an incoming call is received, showing caller info with accept and reject buttons.
***
## Where It Fits
Typically triggered automatically when `CallNavigationContext.navigatorKey` is set in your `MaterialApp`.
```dart theme={null}
MaterialApp(navigatorKey: CallNavigationContext.navigatorKey, home: YourHomeScreen())
```
***
## Quick Start
### Automatic (Recommended)
```dart theme={null}
MaterialApp(navigatorKey: CallNavigationContext.navigatorKey, home: YourHomeScreen())
```
### Manual Launch
```dart theme={null}
Navigator.push(context, MaterialPageRoute(
builder: (context) => CometChatIncomingCall(user: user, call: callObject),
));
```
Prerequisites: CometChat SDK initialized, Calls UIKit added, `callingExtension` set. See [Call Features](/ui-kit/flutter/call-features).
***
## Actions
#### `onAccept`
```dart theme={null}
CometChatIncomingCall(user: user, call: callObject,
onAccept: (BuildContext context, Call call) { /* Custom accept */ },
)
```
#### `onDecline`
```dart theme={null}
CometChatIncomingCall(user: user, call: callObject,
onDecline: (BuildContext context, Call call) { /* Custom decline */ },
)
```
#### `onError`
```dart theme={null}
CometChatIncomingCall(user: user, call: callObject,
onError: (e) { debugPrint("Error: $e"); },
)
```
***
## Functionality
| Property | Type | Description |
| ---------------------- | ---------------------- | --------------------------- |
| `user` | `User?` | Caller user object |
| `call` | `Call` | Call object (required) |
| `callSettingsBuilder` | `CallSettingsBuilder?` | Configure call settings |
| `height` / `width` | `double?` | Widget dimensions |
| `callIcon` | `Widget?` | Custom call type icon |
| `acceptButtonText` | `String?` | Custom accept button text |
| `declineButtonText` | `String?` | Custom decline button text |
| `disableSoundForCalls` | `bool?` | Disable incoming call sound |
| `customSoundForCalls` | `String?` | Custom sound asset path |
***
## Custom View Slots
### Item View
```dart theme={null}
CometChatIncomingCall(user: user, call: callObject,
itemView: (context, call) { return Container(); },
)
```
### Leading View
```dart theme={null}
CometChatIncomingCall(user: user, call: callObject,
leadingView: (context, call) {
return CircleAvatar(radius: 40, backgroundImage: NetworkImage(call.sender?.avatar ?? ""));
},
)
```
### Title View
```dart theme={null}
CometChatIncomingCall(user: user, call: callObject,
titleView: (context, call) {
return Text(call.sender?.name ?? "Unknown",
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold, color: Colors.white));
},
)
```
### Subtitle View
```dart theme={null}
CometChatIncomingCall(user: user, call: callObject,
subTitleView: (context, call) {
final type = call.type == CometChatCallType.video ? "Video" : "Audio";
return Text("Incoming $type Call", style: TextStyle(fontSize: 14, color: Colors.white70));
},
)
```
### Trailing View
```dart theme={null}
CometChatIncomingCall(user: user, call: callObject,
trailingView: (context, call) {
return Row(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [
ElevatedButton(onPressed: () {}, child: Text("Reject"),
style: ElevatedButton.styleFrom(backgroundColor: Colors.red)),
ElevatedButton(onPressed: () {}, child: Text("Accept"),
style: ElevatedButton.styleFrom(backgroundColor: Colors.green)),
]);
},
)
```
***
## Style
```dart theme={null}
CometChatIncomingCall(user: user, call: callObject,
incomingCallStyle: CometChatIncomingCallStyle(
backgroundColor: Color(0xFFEDEAFA),
avatarStyle: CometChatAvatarStyle(backgroundColor: Color(0xFFAA9EE8), borderRadius: BorderRadius.circular(7.5)),
acceptButtonColor: Color(0xFF6852D6),
declineButtonColor: Colors.white,
declineTextColor: Color(0xFFF44649),
callIconColor: Color(0xFF6852D6),
),
)
```
| Property | Description |
| -------------------- | ------------------------- |
| `backgroundColor` | Background color |
| `avatarStyle` | Caller avatar appearance |
| `acceptButtonColor` | Accept button background |
| `declineButtonColor` | Decline button background |
| `declineTextColor` | Decline button text color |
| `callIconColor` | Call type icon color |
***
## Key V6 Differences
| Aspect | V5 | V6 |
| ---------------- | --------------------------------------------------------------- | --------------------------------------------------------------------------- |
| Subtitle | Static `String?` | Dynamic `Widget? Function(BuildContext, Call)?` |
| Decline icon | URL-based `String?` | Widget-based |
| Custom views | Limited | Full `titleView`, `subTitleView`, `leadingView`, `trailingView`, `itemView` |
| State management | GetX controller | BLoC (`IncomingCallBloc`) |
| Removed | `theme`, `avatarStyle`, `cardStyle`, `ongoingCallConfiguration` | Integrated into main style |
***
## Next Steps
Manage outgoing calls
Add call buttons
Complete calling setup
Styling reference