Start or Join Room - Flutter

After the successful installation of VideoSDK, the next step is to integrate VideoSDK features with your Android or iOS app.

To Communicate with other participant's audio or video call, you will need to join the room.

This guide will provide an overview of how to configure, initialize and join a VideoSDK room.

1. Configuration

To configure a room, you will need generated token and roomId, we had discussed in Server Setup. This code snippet calls API from local server

Scenario 1 - Suppose you don't have any roomId, you can simply generate roomId by invoking create-room API.

Scenario 2 - Suppose you have roomId, now you don't have to call create-room API to generate roomId, instead you can call validate-room API to validate roomId.

Token generation API is necessary for both scenario.

import 'dart:convert';
import 'package:flutter_dotenv/flutter_dotenv.dart'; // To read LOCAL_SERVER_URL from a .env file, you need to add third party package "flutter_dotenv"
import 'package:http/http.dart' as http; // For API Calling, you need to add third party package "http"
import 'package:videosdk/videosdk.dart';

// States Defined in Stateful Component.
String? roomId;
String? token;

void _getRoomIdAndToken() async {
    final LOCAL_SERVER_URL = dotenv.env['LOCAL_SERVER_URL'];

    // Calling get-token API.
    final Uri tokenUrl = Uri.parse('$LOCAL_SERVER_URL/get-token');
    final http.Response tokenResponse = await http.get(tokenUrl);

    final dynamic _token = json.decode(tokenResponse.body)['token'];

    // Calling create-room API.
    final Uri roomIdUrl =
        Uri.parse('$LOCAL_SERVER_URL/create-room/');

    final http.Response roomIdResponse =
        await http.post(roomIdUrl, body: {"token": _token});

    final _roomId = json.decode(roomIdResponse.body)['roomId'];

    // Setting into states of stateful widget
    setState(() {
      token = _token;
      roomId = _roomId;
    });
  }

  // This API is for validate the room id
  // Not require to call this API after create room API

dynamic validateRoom(token, roomId) async {
    final LOCAL_SERVER_URL = dotenv.env['LOCAL_SERVER_URL'];
    final Uri validateRoomUrl =
        Uri.parse('$LOCAL_SERVER_URL/validate-room/$roomId');
    final http.Response validateRoomResponse =
        await http.post(validateRoomUrl, body: {"token": token});
    final _roomId = json.decode(validateRoomResponse.body)['roomId'];
    if (_roomId != null) {
      return _roomId;
    } else {
      return null;
    }
  }

2. Initialization

After configuration, you will have to Initialize

room by providing name, roomId, micEnabled, camEnabled & maxResolution.

Create the room in the State of the screen that owns it. The room releases itself after it leaves, and a room that has left cannot join again. See Leave or End Room.

import 'package:flutter/material.dart';
import 'package:videosdk/videosdk.dart';

class RoomScreen extends StatefulWidget {
  const RoomScreen({super.key});

  @override
  State<RoomScreen> createState() => _RoomScreenState();
}

class _RoomScreenState extends State<RoomScreen> {
  late final Room room;

  @override
  void initState() {
    super.initState();
    room = VideoSDK.createRoom(
      roomId: "<Id-of-Room>",
      participantName: "<Name-of-participant>",
      micEnabled: true, // Flag to enable mic
      camEnabled: true, // Flag to enable camera
      maxResolution: MaxResolution.HD,
      token: "<Authentication-token>",
    );
  }

  @override
  Widget build(BuildContext context) {
    return Container(); // Returning widget
  }
}

3. Join

After configuration & initialization, the third step is to call join() to join a room.

After joining, you will be able to Manage Participant in a room.

join() returns a Future that completes once the room is joined. If the room cannot be joined, it throws a VideoSDKError. On Android, join() does not ask for camera or microphone permission, so call VideoSDK.requestPermissions() first.

// On Android, join() does not ask for camera or microphone permission.
await VideoSDK.requestPermissions();

try {
  // Join the room
  await room.join();
} on VideoSDKError catch (error) {
  // For example 4002 (invalid token) or 3073 (empty room id).
  print("Join failed: ${error.code} ${error.name}");
}

Events

Following events are emitted on the room when it is successfully joined.

• Local Participant will receive a roomJoined event when successfully joined. It can arrive after join() completes, so read room.localParticipant in its handler.
• Remote Participant will receive a participantJoined event with the newly joined Participant object from the event callback.

room.on(Events.roomJoined, () {
  print("Room Joined Successfully");
});

room.on(Events.participantJoined, (Participant participant) {
  print("New Participant Joined");
});