ruut_flutter 0.0.2+patch copy "ruut_flutter: ^0.0.2+patch" to clipboard
ruut_flutter: ^0.0.2+patch copied to clipboard

The official Flutter SDK for Ruut Chat,this SDK provides developers with a seamless way to integrate the Ruut chat widget into their Flutter applications.

Pub Version

Integrate Ruut with Flutter app #

Integrate Ruut flutter client into your flutter app and talk to your visitors in real time. Ruut helps you to chat with your visitors and provide exceptional support in real time. To use Ruut in your flutter app, follow the steps described below.

1. Add the package to your project #

Run the command below in your terminal

flutter pub add ruut_flutter

or

Add ruut_flutter:<<version>> to your project's pubspec.yml file. You can check here for the latest version.

2. How to use #

a. Using RuutWidget #

  • Create an api channel in ruut server by following the steps described here https://www.ruut.com/docs/channels/api
  • Replace inboxIdentifier prop with the inbox identifier for the api channel you created
import 'package:ruut_flutter/ruut_flutter.dart';
import 'package:ruut_flutter/ui/ruut_home.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        fontFamily: "TTHoves-Pro",
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(
        title: 'Flutter Demo Home Page',
      ),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({required this.title}) : super();

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return RuutChat(
      inboxIdentifier: '<api_channel_inbox_identifier>',
      blogUrl: "",
      logoUrl:
      "https://examples.com/image.png",
      theme: RuutChatTheme(
        userAvatarNameColors: [Colors.black, Colors.white],
        userNameTextStyle: TextStyle(color: Colors.black),
        attachmentButtonIcon: Icon(Icons.image_outlined, color: Colors.grey),
        primaryColor: Color(0xff9B6EE3),
        secondaryColor: Colors.white,
        backgroundColor: Colors.grey.shade100,
      ),
      user: RuutUser(
        identifier: "<unique_user_id>",
        name: "Tester test",
        email: "test@test.com",
        customAttributes: {
          "plan": "Premium",
          "tier": "tier_1"
        }
      ),
    );
  }
}

Horray! You're done.

NB: This ruut sdk uses Hive for local storage.

Callbacks #

Ruut callbacks are methods exposed to you that you can hook into to perform various actions based on real-time events within the SDK. These callback methods provide you with greater control over user interactions, allowing you to respond dynamically as certain events occur.

final ruutCallbacks = RuutCallbacks(
      onWelcome: (){
        print("on welcome");
      },
      onPing: (){
        print("on ping");
      },
      onConfirmedSubscription: (){
        print("on confirmed subscription");
      },
      onConversationStartedTyping: (){
        print("on conversation started typing");
      },
      onConversationStoppedTyping: (){
        print("on conversation stopped typing");
      },
      onPersistedMessagesRetrieved: (persistedMessages){
        print("persisted messages retrieved");
      },
      onMessagesRetrieved: (messages){
        print("messages retrieved");
      },
      onMessageReceived: (ruutMessage){
        print("message received");
      },
      onMessageDelivered: (ruutMessage, echoId){
        print("message delivered");
      },
      onMessageSent: (ruutMessage, echoId){
        print("message sent");
      },
      onError: (error){
        print("Ooops! Something went wrong. Error Cause: ${error.cause}");
      },
    );

Available Parameters

Name Default Type Description
inboxIdentifier - String Identifier for target ruut inbox
enablePersistance true bool Enables persistence of ruut client instance's contact, conversation and messages to disk
for convenience.
true - persists ruut client instance's data(contact, conversation and messages) to disk. To clear persisted
data call RuutClient.clearData or RuutClient.clearAllData
false - holds ruut client instance's data in memory and is cleared as
soon as ruut client instance is disposed
Setting
user null RuutUser Custom user details to be attached to ruut contact
callbacks null RuutCallbacks Callbacks for handling ruut events
0
likes
100
points
55
downloads

Publisher

unverified uploader

Weekly Downloads

The official Flutter SDK for Ruut Chat,this SDK provides developers with a seamless way to integrate the Ruut chat widget into their Flutter applications.

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (license)

Dependencies

async, dio, equatable, file_picker, flutter, flutter_chat_types, flutter_chat_ui, flutter_inappwebview, flutter_secure_storage, flutter_svg, hive, hive_flutter, http_parser, image_picker, intl, json_annotation, path_provider, riverpod, stream_channel, synchronized, url_launcher, uuid, web_socket_channel

More

Packages that depend on ruut_flutter