githubEdit

Whereby with Flutter

Flutter is Google's free and open-source UI framework for creating natively compiled cross-platform mobile apps.

Prerequisites

Before starting, you will need to add the corresponding permissions to be able to access both the camera and microphone as described in the Android and iOS sections.

Getting started

We recommend using the flutter_inappwebviewarrow-up-right and permission_handlerarrow-up-right modules to handle media permissions in the webview. Update the settings in your iOS and Android projects to match the requirements.

circle-exclamation

Add the WebView component to your code, setup the properties, and fill the room URL and parameters.

Here is a short example:

import 'package:flutter/material.dart';
import 'dart:io' show Platform;
import 'package:flutter_inappwebview/flutter_inappwebview.dart';
import 'package:permission_handler/permission_handler.dart';

var _url = ""; // Replace by your own

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    if (Platform.isAndroid) {
      _url += '?skipMediaPermissionPrompt';
    }
    return MaterialApp(
      home: InAppWebViewPage(),
    );
  }
}

class InAppWebViewPage extends StatefulWidget {
  InAppWebViewPage();

  @override
  _InAppWebViewPageState createState() => new _InAppWebViewPageState();
}

class _InAppWebViewPageState extends State<InAppWebViewPage> {
  _InAppWebViewPageState();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text("Meeting")),
        body: Container(
            child: Column(children: <Widget>[
          Expanded(
            child: Container(
              child: InAppWebView(
                initialUrlRequest: URLRequest(url: Uri.parse(_url)),
                initialOptions: InAppWebViewGroupOptions(
                    crossPlatform: InAppWebViewOptions(
                      mediaPlaybackRequiresUserGesture: false,
                    ),
                    ios: IOSInAppWebViewOptions(
                      allowsInlineMediaPlayback: true,
                    )),
                onPermissionRequest: (controller, permissionRequest) async {
                  await Permission.camera.request();
                  await Permission.microphone.request();
                  return PermissionResponse(
                      resources: permissionRequest.resources,
                      action: PermissionResponseAction.GRANT);
                },
              ),
            ),
          ),
        ])));
  }
}

Last updated

Was this helpful?