/opentok-flutter-basic-video-chat

Primary LanguageKotlin

opentok-flutter-basic-video-chat

This repository is providing Basic video chat sample using OpenTok SDK and Flutter.

This project is a kick off projet to explore Flutter integration and it is not oficially supported by Vonage.

Setup flutter SDK

Download, extract and confgure flutter SDK.

Fortunately, flutter comes with a tool that allows us to verify if SDK and all required "components" are present and configured correctly. Run this command:

Check if everything is configured correctly:

flutter doctor

Run the app

There are multiple ways to run the app. The easiest way is to open the whole project in the Android Studio with Flutter plugin installed. Open Flutter project (the root of this repo) and run app targetting one of the platforms.

Fill OpenTokConfig

Optionally you can open iOS project (ios/Runner.xcworkspace folder) in Xcode and run iOS app or Android project in Android Studio (android folder) and run Android App. This is possible because Flutter project consists of iOS and Android projects.

Set up credentials

You will need a valid TokBox account for most of the sample projects. OpenTok credentials (API_KEY, SESSION_ID, TOKEN) are stored inside OpenTokConfig class (inside main.dart file). For these sample applications, credentials can be retrieved from the Dashboard and hardcoded in the application, however for a production environment server should provide these credentials (check Basic-Video-Chat project).

Note: To facilitate testing connect to the same session using OpenTok Playground (web client).

Known issues

When hosting the Native Android/iOS view in the Flutter app the PlatformViewFactory must be used to create instance of the native view (PlatformView). However Opentok SDK is creating views for video streams by itself. This means that we need a hack to be able to display opentok videos within the Flutter app. Instead of creating native view (using the PlatformViewFactory), app creates a container view (also using the PlatformViewFactory) and latter attaches Opentok video streams to this container. Unfortunately this solution requires to store view in the static property.

Development and Contributing

Feel free to copy and modify the source code herein for your projects. Please consider sharing your modifications with us, especially if they might benefit other developers using the OpenTok Android SDK. See the License for more information.

Interested in contributing? You ❤️ pull requests! See the Contribution guidelines.

Getting Help

You love to hear from you so if you have questions, comments or find a bug in the project, let us know! You can either:

References