Embrace the power of SwiftUI and Combine with the Bitmovin Player SDK on iOS and tvOS

To long to read? Check out our video introduction to Swift UI!

Introduction

Starting from version 3.40.0, Bitmovin’s Player iOS/tvOS SDK officially supports integrating with SwiftUI and/or Combine projects as a first class citizen. :tada:
SwiftUI and Combine are two powerful frameworks introduced by Apple that simplify and speed up the development process and make your code cleaner and more robust.

Single line SwiftUI integration

We introduced VideoPlayerView to enable single line integration of our SDK into your SwiftUI view hierarchy.
It is the equivalent of PlayerView, but for SwiftUI.
Once you have added our SDK to your iOS or tvOS project using our guide, all you need to do is to create a Player instance and add a single line to your SwiftUI view:

VideoPlayerView(player: player)

Full code snippet

The SwiftUI support enables you to get started within minutes.

struct ContentView: View {
    private let player: Player = {
        // Create player configuration
        let playerConfig = PlayerConfig()
        // Set your player license key on the player configuration
        playerConfig.key = "<PLAYER_LICENSE_KEY>"
        // Create player based on player configuration
        return PlayerFactory.create(playerConfig: playerConfig)
    }()

    private let sourceConfig: SourceConfig = {
        // Define needed resources
        guard let streamUrl = URL(string: "https://cdn.bitmovin.com/content/art-of-motion/m3u8s/playlist.m3u8"),
              let posterUrl = URL(string: "https://cdn.bitmovin.com/content/art-of-motion/poster.jpg") else {
            fatalError("Invalid URL")
        }
        return SourceConfig(url: streamUrl, type: .hls)
    }()

    var body: some View {
        VideoPlayerView(player: player)
            .background(Color.black)
            .onAppear {
                player.load(sourceConfig: sourceConfig)
            }
    }
}

You can find a fully working application example in our open-source sample project here.

Tip: Our Getting Started guide was already updated to highlight the single line SwiftUI integration, making it easier than ever to get your video content displayed within your application.

Reactive event subscription API using Combine

To enhance the support for modern application development trends, now you can use Apple’s own reactive framework, Combine, for subscribing to events. Using Combine for subscribing to individual or multiple events is simplified and allows the usage of standard Combine operators out-of-the-box. You can cancel an event subscription by releasing the Cancellable instance.

This is as easy as adding a couple of lines to your SwiftUI view:

VideoPlayerView(player: player)
    .onReceive(player.events.on(TimeChangedEvent.self)) { event in
        // Notified for every time changed event
        print("Time changed: \(event.currentTime)s")
    }

Or anywhere in your codebase:

player.events
    .on(TimeChangedEvent.self)
    .sink { timeChangedEvent in
        // Notified for every time changed event
        print("Time changed: \(event.currentTime)s")
    }
    .store(in: &cancellables)

Tip: In case your project uses UIKit, you can still leverage the events API using Combine to simplify your integration.

This new API allows composition of event listeners in a declarative way, which enables the implementation of complex workflows with a couple lines of code:

Publishers.Merge(
    player.events.on(SourceErrorEvent.self).map(\.message)
    player.events.on(PlayerErrorEvent.self).map(\.message)
)
.sink { [weak self] errorMessage in
    // Notified for every source or player error
    print("Error message: \(errorMessage)")
}
.store(in: &cancellables)

The events API is supported on both Player and Source, as well as on PlayerView.

To see all supported ways for subscribing to events, check out our brand new documentation page dedicated to showing how to listen to events, available here.

Summary

We are excited about the integration of SwiftUI and Combine in the Bitmovin Player SDK and look forward to seeing the amazing applications you will create with these new features.
In case you are migrating from AVPlayer to Bitmovin Player, check out our migration guide.

We always appreciate your feedback, so please feel free to share your thoughts and experiences with us.

Next, you can:

10 Likes

Thanks for this example @roland.kakonyi .
What about enabling the fullscreen button on the bitmovin player using SwiftUI?
The fullscreenHandler seems working only on UIKit.

Hi @stefano.russello!

You are right, currently we don’t support full screen handler with SwiftUI.
We are planning to add this feature later on but currently this isn’t planned for the near future!

@roland.kakonyi any news regarding when fullscreen hadler will be implemented on SwiftUI Bitmobin Player SDK?