Example of Flutter app integration with Clan Meeting

Clan Meeting – Flutter Integration

Please make sure that the permissions required for mobile apps are added to your app. We use Flutter InAppWebView for this integration.

Flutter Specific Permissions

Add the following to your AndroidManifest.xml file.

<!-- Webview -->
<provider
    android:name="com.pichillilorenzo.flutter_inappwebview.InAppWebViewFileProvider"
    android:authorities="${applicationId}.flutter_inappwebview.fileprovider"
    android:exported="false"
    android:grantUriPermissions="true">
    <meta-data
        android:name="android.support.FILE_PROVIDER_PATHS"
        android:resource="@xml/provider_paths" />
</provider>

Add the permissions required by the below packages

Flutter Downloader related code is optional and only needed if you want the the shared files to be downloaded within the app. If you do not include Flutter Downloader, then the files will be downloaded using the default mobile browser. Required permissions listed on the package page are needed for downloading shared files within your app.

https://pub.dev/packages/flutter_downloader

URL Launcher is used for opening URLs pasted in chat.

https://pub.dev/packages/url_launcher

Include packages

Add the following to your pubspec.yaml file.

flutter_inappwebview: ^5.3.2
permission_handler: ^8.3.0
url_launcher: ^6.0.13
wakelock: ^0.5.6
path_provider: ^2.0.7
flutter_downloader: ^1.7.1

Create / Join Meeting

Edit the following in main.dart. There is no difference between creating and joining a meeting. A meeting gets created as soon as the first participant joins and is destroyed when the last participant leaves.

void _joinMeeting() async {
  const String domain = 'try.clanmeeting.com';
  const String consumerId = 'colacoca';
  String roomName = Utility.randomString(10);
  const String displayName = 'John Doe';

Remember to request for camera and microphone permissions

Already included in example main.dart

// Request for camera and microphone permissions
await Permission.camera.request();
await Permission.microphone.request();

WebView options

Already included in example clanmeeting.dart

InAppWebViewGroupOptions(
  crossPlatform: InAppWebViewOptions(
    clearCache: true,
    javaScriptCanOpenWindowsAutomatically: true,
    mediaPlaybackRequiresUserGesture: false, // important
  ),
  android: AndroidInAppWebViewOptions(
    supportMultipleWindows: true,
    useHybridComposition: true, // important
  ),
  ios: IOSInAppWebViewOptions(
    allowsInlineMediaPlayback: true, // important
  )
);