Crafting the Ultimate iOS Video Player: Part 4 — Elevating Your Player with Live Content Support

Live Stream

In this next installment of our Crafting the Ultimate iOS Video Player series, we’re diving into the world of live content handling. Just as we’ve tackled custom controls, subtitles, and video quality settings in our previous articles, handling live content support is essential. By the end of this article, you’ll have the skills to seamlessly integrate live content into your iOS video player, ensuring your users enjoy uninterrupted streaming.

Before we dive into integrating live streaming support, make sure to check out Part 3 of Crafting the Ultimate iOS Video Player series — Exploring Video Quality Selection if you haven’t already.

Configuring a Video Playlist with Free-to-Use Stream URLs

One of the first steps in integrating live content into your custom iOS video player is to configure a video playlist with free-to-use stream URLs. Fortunately, there are numerous websites that curate such URLs, making it easy to set up your own playlist.

For instance, websites like IPTV.org offer a vast collection of stream URLs covering a wide range of content categories. You can explore any such website to find streams that align with your target audience and content preferences.

Let’s take a look at an example of configuring a video playlist with live stream URLs:

let playlist = VideoPlaylist(
    title: "IPTV",
    videos: [
        Video(
            url: "https://ndtvindiaelemarchana.akamaized.net/hls/live/2003679/ndtvindia/master.m3u8",
            title: "NDTV",
            isLiveContent: true
        ),
        Video(
            url: "https://segment.yuppcdn.net/050522/murasu/050522/murasu_1200/chunks.m3u8",
            title: "Murasu",
            isLiveContent: true
        ),
        Video(
            url: "https://ndtv24x7elemarchana.akamaized.net/hls/live/2003678/ndtv24x7/masterp_480p@1.m3u8",
            title: "NDTV.com",
            isLiveContent: true
        ),
    ]
)

In this example, we’ve created a playlist titled “IPTV” containing live stream URLs from various sources such as NDTV and Murasu.

Live Content Specific Player Customizations

Based on the isLiveContent flag configured as part of the video player config, certain adjustments are made to the video player setup.

Observation for properties such as duration, which are typically needed for non-live stream URLs, is skipped for live content streams since they are not applicable in this context.

Additionally, specific controls are tailored for live content playback. For instance, a LIVE button is introduced.

When the user taps the LIVE button, a seamless transition to the current position of the live stream is facilitated. This functionality is achieved through the seekToLive method, which ensures that users are instantly directed to the most recent segment of the live content. By leveraging this feature, users can effortlessly stay up-to-date with the live broadcast, enhancing their viewing experience.

func seekToLive() {
    guard let livePosition = player?.currentItem?.seekableTimeRanges.last as? CMTimeRange else {
        return
    }
    player?.seek(to:CMTimeRangeGetEnd(livePosition))
    playerControlsView.updateLiveState(with: true)
}

Controls that are irrelevant or not applicable to live streams, such as video quality selection, subtitle options, and time labels, are appropriately disabled to streamline the user experience.

func enableLiveControls() {
     liveButton.isHidden = false
     settingsButton.isHidden = true
     subtitleButton.isHidden = true
     totalTimeLabel.isHidden = true
     currentTimeLabel.isHidden = true
     forwardButton.isHidden = true
     rewindButton.isHidden = true
}

Link to Github repo — https://github.com/ajkmr7/Custom-Video-Player

I hope the insights shared in this article will empower you to optimize your iOS app’s video player controls for live content streams, elevating the streaming experience for your users.

Check out Bonus✨ Article of Crafting the Ultimate iOS Video Player — Watch Party Integration

Stay tuned for future articles in this series, where we’ll explore further advancements in video player functionality. Happy coding and may your app continue to thrive! ⚡