Video feed layouts (iOS)

Horizontal layout

By default, the video feed adopts a horizontal layout. You can use the following code to customize configurations, such as item ratio, for this layout. As demonstrated in the code below, you set the itemWidthRatio to 16:9 to render the video item in a horizontal layout.

let layout = VideoFeedHorizontalLayout()
// Configure itemWidth:itemHeight to 16:9
layout.itemWidthRatio = 16 / 9
// Configure spacing between items
layout.itemSpacing = 10
// Configure content insets
layout.contentInsets = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)

let channelID = "<Encoded Channel ID>"
let playlistID = "<Encoded Playlist ID>"

// Create VideoFeedViewController instance
let feedVC = VideoFeedViewController(
    layout: layout,
    source: .channelPlaylist(
        channelID: channelID,
        playlistID: playlistID
    )
)

// Create VideoFeedView instance
let feedView = VideoFeedView(
    layout: layout,
    source: .channelPlaylist(
        channelID: channelID,
        playlistID: playlistID
    )
)

VideoFeedSwiftUIView(
    layout: layout,
    source: .channelPlaylist(
        channelID: channelID,
        playlistID: playlistID
    )
)
Vertical item width ratio (such as 4 / 6)
Horizontal item width ratio (such as 16 / 9)

Grid layout

You can implement a grid layout using VideoFeedGridLayout. The following code allows you to customize configurations, such as the item ratio.

let layout = VideoFeedGridLayout()
// Configure itemWidth:itemHeight to 4:6
layout.itemWidthRatio = 4 / 6
// Configure number of columns
layout.numberOfColumns = 2
// Configure spacing between items
layout.itemSpacing = 10
// Configure content insets
layout.contentInsets = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)

let channelID = "<Encoded Channel ID>"
let playlistID = "<Encoded Playlist ID>"

// Create VideoFeedViewController instance
let feedVC = VideoFeedViewController(
    layout: layout,
    source: .channelPlaylist(
        channelID: channelID,
        playlistID: playlistID
    )
)

// Create VideoFeedView instance
let feedView = VideoFeedView(
    layout: layout,
    source: .channelPlaylist(
        channelID: channelID,
        playlistID: playlistID
    )
)

VideoFeedSwiftUIView(
    layout: layout,
    source: .channelPlaylist(
        channelID: channelID,
        playlistID: playlistID
    )
)

Last updated

Was this helpful?