MediaElement for .NET MAUI: Early Preview

The .NET MAUI Community Toolkit team has been hard at work to bring the MediaElement for playing videos to .NET MAUI. In this post, read all about the features and how to try it yourself, today!

What is MediaElement?

MediaElement has been the control for playing audio and video in Xamarin.Forms. Peter Foot from the community has been doing a great job implementing this for all platforms that were supported by Xamarin.Forms.

However, time has gone by, platforms have newer features, obsoleted APIs, etc. and some features, like playing live streams, have simply never been implemented. Time to change that!

Play Videos in .NET MAUI With MediaElement: Early Preview
Watch my video walkthrough of the .NET MAUI MediaElement preview

MediaElement for .NET MAUI

The MediaElement will be coming to .NET MAUI through the .NET MAUI Community Toolkit. We’re working hard on the implementation at the time of this post. But we’re not just taking everything from the old MediaElement and make it work for .NET MAUI, we’re rewriting it from the ground up.

That way, we can make sure that things are more stable and more robust for the future. Also, we want to make sure that the most requested feedback is incorporated. That means, for instance, that we have support for live streams from day 1.

You can use MediaElement for iOS and macOS, Android and Windows.

An image showing the 4 supported platforms with the .NET MAUI Community Toolkit sample app running with the MediaElement. 

The image shows three bullets with the MediaElement features: play from URLs and local files, works on iOS, Android, macOS and Windows, set speed, position, volume, show/hide controls, looping and more.
Overview of .NET MAUI MediaElement and it’s features

Features

For the first version we’re aiming to bring the most wanted features. There are a great number of extra features beyond that. We’ll be considering each of them in time, for now we want to have a rich media player that works and bring it to you as soon as possible. These are the features we’re aiming for right now:

  • Play media (doh)
    • From online, local files and live streams (see Supported Formats below)
  • Get & set position
  • Get & set volume
  • Get & set show platform playback controls
  • Get & set if the video should loop after it ends
  • Get & set the playback speed
  • Get & set if the device screen should remain on while playing
  • Get duration, current state (playing, paused, buffering, etc.)
  • Do basic operations such as play, pause and stop

Another much (much!) requested feature is playing in fullscreen. I’ve looked into it briefly and it seems there is a good reason it wasn’t implemented: it’s not an easy thing to implement, at least on Android. Of course, we’ll look into it, but probably not for the initial version.

Is there any feature we’re missing that is important to you? Please let us know! Open an issue on the .NET MAUI Community Toolkit repo.

Supported Formats

So what exactly are the supported formats? Great question! I have yet to compose a cool looking table from it, but for now have a look at these overviews for the different platforms:

  • Android
  • iOS/macOS
  • Windows; for Windows I couldn’t find a list of supported formats at this time. If you do know of one, please let me know!

As you might have noticed, for Android we are now using ExoPlayer which brings a lot of more capabilities to our Android variant.

Planned Release with .NET 7

We’re aiming to release the MediaElement together with .NET 7. .NET 7 will bring a new version of .NET MAUI with lots of capabilities and fixes, and the main thing is: it will target Android API 33 by default. That is something we also need for our ExoPlayer bindings.

That’s why we decided to also release MediaElement for .NET MAUI with .NET 7 and up. With, at the time of writing, less than a month to go, that should not be any problem!

Try it Out Yourself!

While we do the last fixes and development, we’re curious to hear your feedback. The MediaElement pull request is still open, but that already produces NuGet packages that you can test out. And those NuGet packages are even still compatible with .NET 6. Here is how you can try out MediaElement right now on your project and how to provide us with feedback.

Try Out MediaElement

So, you’ve decided to try it out? Great! First thing you want to do is add a separate NuGet feed to your Visual Studio. Find the link and instructions here.

To add this feed to your Visual Studio, check out this earlier post from me. Instead of using a local folder, enter the URL from above.

With that in place you should be able to find the MediaElement package when you add a new NuGet to your project.

Android Target Version

At the time of writing the MediaElement still targets net6.0-android33. This means, you can use it with .NET 6 which is the currently most used version with .NET MAUI. However, the 33 at the end might be new to you. This means it targets Android API 33. net6.0-android targets API 31 by default.

To make it work with your project, open the csproj file of your .NET MAUI app and update net6.0-android to net6.0-android33.

Maybe by the time you’re reading this it won’t install because it targets .NET 7, in that case, install .NET 7 (RC) and update your targets to net7.0 in that case your can use net7.0-android because now API 33 is implicit.

UsePreviewFeatures

One thing I ran into while building MediaElement is that suddenly I got messages about using preview features in .NET. I think those messages are wrong and possibly I am doing something wrong or there is some bug, but if you hit that, in your csproj of your .NET MAUI app add a node: <usepreviewfeatures>true</usepreviewfeatures> that will make it go away.

Provide Feedback

If you want to provide feedback, go over to the .NET MAUI Community Toolkit repository and open an issue. Please add as much detail as you can, ideally a reproduction project. We will try and tackle the bugs before we release this thing publicly.

For feature requests, maybe hold off a little longer until we released MediaElement to the public. Only then we will know for sure what features will be implemented at that time and you know what can still be added. If you start requesting now, maybe we’re already thinking about it and doing it.

As always, contributions in any way are also appreciated!

Try Out MediaElement!

We hope you now have a good idea about what is to come for MediaElement and you will try it out. Keep in mind, it’s still early days, things might still change, bugs will be there, but you can help us make it the best version of MediaElement it can be.

11 thoughts on “MediaElement for .NET MAUI: Early Preview”

  1. Hi Gerald,
    Does MediaElement work with local files on android? I keep running into an error and can’t seem to work it out. Does the source url have to be in a special format or can I directly quote the file?
    I’ve tried using the BigBuckBunny video as a source and it loaded, so I think I set up MediaElement correctly.

    Error:
    Java.Lang.AbstractMethodError: ‘abstract method “void com.google.android.exoplayer2.Player$Listener.onPlayerError(com.google.android.exoplayer2.PlaybackException)”‘

    • Hey Jakub!

      If you could provide me with a small repro sample that I could look at that would be awesome! ๐Ÿ™‚

      The error that you see there is something different though, just pushed a fix for that. But that still means that the video playback did give you an error ๐Ÿ˜… wondering how you are using it and what is going wrong. Maybe we can fix it! Thanks!

    • Your a life saver. This is what I have been looking for. If you have for spotify that will be appreciated.

  2. Hi Gerald. MediaElement seems to have disappeared from the CommunityToolkit repo, will it be back soon? Thanks

    • It hasn’t been in the .NET MAUI CommunityToolkit repo yet, it’s in a PR right now as we’re working on it. That is part of the reason why I drafted this post!

  3. Hi Gerald
    I managed to test by cloning Jakub’s “LocalVideoWontPlay” minimal sample – I’m still having trouble seeing MediaElement as a Nuget package, although I’ve added the alternate package sources. Not sure what step I’ve missed!

    Anyway, I’d like to be able to play live streams, but I get an exception –
    System.OverflowException ‘TimeSpan overflowed because the duration is too long.’

    This is when setting the Source to https://samcloud.spacial.com/api/listen?sid=73841&rid=259088&f=mp3,any&br=128000,any&m=sc&t=ssl

    Presumably this is because a live stream doesn’t have a specific duration. This is on Android. In the debugger the application breaks because of the exception, at which point you can hear the stream playing so the actual playback is working. When you continue execution of course the application quits.

    Thanks!

    • Hey Bob, thanks so much!

      I think I know why this might be happening… I’ll be adding it to my TODO list for cases we need to make sure that work. Thanks!

Comments are closed.