DEV Community

Cover image for Microsoft Teams Video Calls to .NET MAUI: A Seamless Integration Guide for iOS
Sr. Kuantico
Sr. Kuantico

Posted on

Microsoft Teams Video Calls to .NET MAUI: A Seamless Integration Guide for iOS

#dotnetmaui #ios #mobile #dotnet

And now let's continue with the other part of the implementation. If you missed the first one, go to this post where I explained how to do it for Android platform.

Now, it's to start with the steps. Enjoy the code!...

Configuration

You will required a Mac for this. Sorry for that, but we will need to run some files via CocoaPods + Xcode too.

  1. First at all, download the repo from here: http://bit.ly/4dROPnr

  2. In your CMD or Terminal go to: [repo]/ProxyLibs/CommunicationUI-Proxy/CommunicationUI-Proxy.xcworkspace folder.

  3. Make sure to have homebrew, Ruby & Cocoapods installed

    //Run this in your terminal, consider use *sudo* for permissions. After all these commands pay attention to the console due probably will required extra libraries to install.

brew install ruby
export PATH="/opt/homebrew/opt/ruby/bin:$PATH"
source ~/.zshrc
gem install cocoapods

//This next command will help us to install part of the necessary resource for Proxy xcworkspace.
pod install

  4. Jump back, in your terminal, to: [repo]/ProxyLibs/CommunicationUI-Proxy and run

//This will create the xcode project framework

./iOSFramework.sh
Enter fullscreen mode Exit fullscreen mode

5.In my case, I didn't have to, but if after these steps your Proxy dir doesn't look like the image below; You will need to execute the Sharpie commands for this project. However, AFTER SHARPIE make sure your dir looks like this:

folder_path_

6.Let's jump to our project in VSCode where we will add the necessary project reference, and your solution explorer should looks like this:

<ItemGroup Condition="$([MSBuild]::GetTargetPlatformIdentifier('$(TargetFramework)')) == 'ios'">
    <ProjectReference Include="../iOS.CallingUI.Binding/iOS.CallingUI.Binding.csproj" />
  </ItemGroup>
Enter fullscreen mode Exit fullscreen mode

project_dir_org

7.Do not forget to create your Composite class in iOS and extended it from IComposite interface created in the Android post.

8.Clean and Build, always make sure whatever you are adding AT LEAST compile.

9.Considered to add in your Azure Portal the necessary resources to make this work. For this one we will need an Azure Communication Service. First create the resource and finally, generate the token.

10.Finally, the place to put your token and meeting info, you will find it on MainPage.xaml.cs:

callComposite.joinCall("[Your Name]",
            "[Your Azure Communication Services Token]",
            "[Teams Link]",
            CallType.TeamsCall, _localization, _dataModelInjection, _orientationProps, _callControlProps);
Enter fullscreen mode Exit fullscreen mode

**

NOTES TO CONSIDER

**

1.I left an alert setup, because this get crash if you try to join into a meeting from a simulator:

if (DeviceInfo.Platform == DevicePlatform.iOS && DeviceInfo.DeviceType == DeviceType.Virtual)
            {
                DisplayAlert("Error", "Joining calls is not supported on iOS Simulators.", "OK");
                return;
            }
Enter fullscreen mode Exit fullscreen mode

2.Point #5 of this post is very important. When you finish to download the framework files, they gets located in a different folder path than the image. I have to move them manually to make it work. This is because when you compile the project the binding will try to reach this files ON THIS path instead on the other installed by default. Don't forget it!

3.If My repo on github give you errors when compile, if because you need to follow to steps to decompress the missing files and libraries. Good luck!

**

CREDITS

**

I want to say thanks to the .NET MAUI and Microsoft team whose collaborate to give us the base code for this. They did the major part and deserve my gratitude.

Collaborators

Enjoy the coding!

Top comments (0)