π§ Intellicon Chat SDK Integration
π Getting Started
To get started with the Intellicon Chat SDK, run the following command in your terminal:
flutter pub add intellicon_chat_sdk
π‘ Usage Example
Below is a complete example showing how to initialize and launch the Intellicon Chat screen with full theming and customization support β including the new custom download handlers added in version 1.0.6.
Navigator.push<void>(
context,
MaterialPageRoute(
builder: (context) => Chat(
config: Config(
baseUrl: _baseUrlController.text,
appId: _appIdController.text,
history: History(show: _showHistory),
),
customData: const {"customerType": "normal"},
user: User(
participantId: _participantIdController.text,
name: "Arham",
fcmToken: _fcmTokenController.text,
),
// π Version 1.0.6 β Custom Download Handlers
downloadAudio: (
{required String url, required Function() stopLoading}) async {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text(url)),
);
await Future.delayed(const Duration(seconds: 5));
stopLoading();
},
downloadImage: (
{required String url, required Function() stopLoading}) async {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text(url)),
);
await Future.delayed(const Duration(seconds: 5));
stopLoading();
},
downloadVideo: (
{required String url, required Function() stopLoading}) async {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text(url)),
);
await Future.delayed(const Duration(seconds: 5));
stopLoading();
},
downloadFile: (
{required String url, required Function() stopLoading}) async {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text(url)),
);
await Future.delayed(const Duration(seconds: 5));
stopLoading();
},
backgroundDecoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [Colors.red, Colors.orange],
),
),
appBarTitleStyle: const TextStyle(color: Colors.white),
appBarBgColor: Colors.transparent,
appBarGradientBgColor: const LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [Colors.red, Colors.orange],
),
appBarIconTheme: const IconThemeData(color: Colors.greenAccent),
appBarCenterTitle: true,
loaderColor: Colors.red,
attachmentModalBgColor: Colors.brown,
/////////////////////////////////////////
feedBackContainerDecoration:
const BoxDecoration(color: Colors.white),
feedBackActiveColor: Colors.red,
feedBackInActiveColor: Colors.red,
feedbackTextActiveColor: Colors.blue,
feedbackTextInActiveColor: Colors.grey,
/////////////////////////////////////////
emojiIconColor: Colors.black,
attachmentIconColor: Colors.black,
micInActiveIconColor: Colors.white,
micActiveIconColor: Colors.brown,
micSendBgColor: Colors.greenAccent,
sendIconColor: Colors.black,
dateBoxDecoration: BoxDecoration(
border: Border.all(
color: Colors.blueAccent,
width: 2.0,
style: BorderStyle.solid,
strokeAlign: BorderSide.strokeAlignInside,
),
borderRadius: BorderRadius.circular(12),
shape: BoxShape.rectangle,
boxShadow: [
BoxShadow(
color: Colors.blueAccent.withOpacity(0.25),
blurRadius: 8,
spreadRadius: 2,
offset: const Offset(2, 4),
blurStyle: BlurStyle.normal,
),
],
),
dateTextStyle: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
),
messageTextStyle: const TextStyle(
color: Colors.black,
fontSize: 14,
fontWeight: FontWeight.normal,
fontStyle: FontStyle.normal,
backgroundColor: Colors.transparent,
decoration: TextDecoration.none,
shadows: [
Shadow(
color: Colors.black26,
offset: Offset(1, 1),
blurRadius: 2,
),
],
),
hintStyle: const TextStyle(
color: Colors.grey,
fontSize: 14,
fontWeight: FontWeight.normal,
fontStyle: FontStyle.italic,
height: 1.5,
shadows: [
Shadow(
color: Colors.black26,
offset: Offset(1, 1),
blurRadius: 2,
),
],
),
sendVoiceMessageIconColor: Colors.blue,
deleteVoiceMessageIconColor: Colors.blue,
messageBoxBgColor: Colors.purpleAccent,
chatStyle: ChatStyle(
appBarColor: _appBarColor,
appBarTextColor: _appBarTextColor,
appbarEnabled: _appbarEnabled,
bubbleStyle: BubbleStyle(
agent: const AgentBubble(
bgColor: Colors.black,
textStyle: TextStyle(
color: Colors.red,
fontSize: 15,
fontWeight: FontWeight.w400,
),
audioMessage: AudioMessageStyle(
sliderColor: Colors.red,
inactiveColor: Colors.blue,
playPauseIconColor: Colors.red,
downloadIconColor: Colors.red,
durationStyle: TextStyle(
color: Colors.lightBlue,
fontSize: 15,
),
),
videoMessage: VideoMessageStyle(
playButtonColor: Colors.greenAccent,
),
documentMessage: DocumentMessageStyle(
downloadIconColor: Colors.pink,
copyIconColor: Colors.brown,
attachmentIconColor: Colors.white,
textStyle: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 15,
color: Colors.white,
overflow: TextOverflow.ellipsis,
),
),
),
visitor: const VisitorBubble(
bgColor: Colors.blueAccent,
textStyle: TextStyle(
color: Colors.white,
fontSize: 15,
fontWeight: FontWeight.w400,
),
audioMessage: AudioMessageStyle(
sliderColor: Colors.red,
inactiveColor: Colors.white,
playPauseIconColor: Colors.black,
downloadIconColor: Colors.black,
durationStyle: TextStyle(
color: Colors.black,
fontSize: 15,
),
),
videoMessage: VideoMessageStyle(
playButtonColor: Colors.red,
),
documentMessage: DocumentMessageStyle(
downloadIconColor: Colors.pink,
copyIconColor: Colors.brown,
attachmentIconColor: Colors.white,
textStyle: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 15,
color: Colors.white,
overflow: TextOverflow.ellipsis,
),
),
),
),
),
),
fullscreenDialog: true,
),
);
βοΈ Configuration
| Property | Description |
|---|---|
| baseUrl | The base URL of your domain where the chat service is hosted. |
| appId | The unique identifier for your chat bot application. |
| participantId | A unique identifier for the user participating in the chat. |
| name | The name of the user using the chat bot. |
| fcmToken | (Optional) The Firebase Cloud Messaging token for enabling notifications. |
π Version 1.0.6 β Custom Download Handlers
Version 1.0.6 introduces four new optional callbacks that allow full customization of how media and files are downloaded in the chat:
| Property | Type | Description |
|---|---|---|
| downloadAudio | Function({required String url, required Function() stopLoading})? |
Handle custom logic for downloading audio files. Call stopLoading() when finished. |
| downloadImage | Function({required String url, required Function() stopLoading})? |
Handle custom logic for downloading images. Call stopLoading() when finished. |
| downloadVideo | Function({required String url, required Function() stopLoading})? |
Handle custom logic for downloading videos. Call stopLoading() when finished. |
| downloadFile | Function({required String url, required Function() stopLoading})? |
Handle custom logic for downloading other files (e.g., PDFs, docs). Call stopLoading() when complete. |
You can integrate:
- Custom permission or storage logic
- Download progress tracking
- Offline caching or third-party download managers
π οΈ Version History
| Version | Highlights |
|---|---|
| 1.0.6 | Added custom download handler callbacks for audio, image, video, and files. |
| 1.0.5 | Added advanced chat UI theming and customization options. |
| 1.0.3 | Added full widget styling customization across the chat interface. |
| 1.0.2 | Updated Flutter SDK constraint to support Flutter 3.32.8 / Dart 3.5.4. |
| 1.0.0 | Initial release of the Intellicon Chat SDK. |
Libraries
- helper/_message
- helper/_socket_data
- helper/_token
- helper/_token_data
- helper/media_cache
- intellicon_chat_sdk
- models/bubble_style
- models/chat_style
- models/config
- models/feedback_message
- models/interaction
- models/user
- screens/chat
- services/apis
- services/attachment
- services/audio_playback_manager
- services/hive_store
- services/socket
- utils/logs
- utils/time
- widgets/attachment_modal
- widgets/audio_player
- widgets/chat_card
- widgets/chat_feedback
- widgets/document_bubble
- widgets/full_screen_image
- widgets/image_bubble
- widgets/message_bubble
- widgets/message_text
- widgets/notification_bubble
- widgets/socket_media_cache
- widgets/video_bubble
- widgets/video_player