UIKit Component: Livestream components are built on top of the social.plus SDK, providing ready-to-use live video broadcasting and viewing UI with full data management handled automatically.

Feature Overview

The Livestream feature in social.plus UIKit v4 empowers users to broadcast and engage with live video content seamlessly. It provides a suite of components designed to facilitate the creation, viewing, and management of live streams within your application, offering comprehensive tools for both content creators and viewers.

Key Features

Stream Creation

Live stream setup and broadcasting
  • Target audience selection (community or timeline)
  • Stream title, description, and thumbnail setup
  • Real-time broadcasting controls
  • Camera switching and stream management

Stream Viewing

Live and recorded stream playback
  • Real-time live stream viewing
  • Recorded stream playback for ended streams
  • Interactive viewer interface
  • Stream status and engagement features

Stream Management

Broadcast control and administration
  • Stream termination handling
  • Moderation and safety controls
  • Stream status management

Audience Targeting

Flexible content distribution
  • Community-specific broadcasting
  • Personal timeline streaming
  • Audience selection workflows

Platform Support

FeatureiOSAndroidWebFlutterReact Native
Create Live Stream Post---
View Live Stream Post--
Stream Management--
Audience Targeting---

Implementation Guide

Live stream creation and broadcasting setupStream Creation components enable users to set up and broadcast live video content with comprehensive controls for targeting, customization, and real-time management.

Livestream Target Selection Page

The target selection page allows users to choose where their live stream will be broadcasted - either to a specific community or their personal timeline.

Features

FeatureDescription
Target SelectionChoose between community or personal timeline broadcasting
Community BrowsingBrowse and select specific communities for broadcasting
Audience PreviewPreview potential reach and audience for selected target

Required Properties

PropertyTypeDescription
None-Page requires no mandatory properties

Customization Options

Config IDTypeDescription
livestream_post_target_selection_page/*/*PageCustomize page theme
livestream_post_target_selection_page/*/close_buttonElementCustomize close button image
livestream_post_target_selection_page/*/my_timeline_textElementCustomize timeline option text
livestream_post_target_selection_page/*/titleElementCustomize page title text

Code Examples

let page = AmityLivestreamPostTargetSelectionPage()
let viewController = AmitySwiftUIHostingController(rootView: page)
navigationController?.pushViewController(viewController, animated: true)

Livestream Creation Page

The creation page enables users to set up their live stream by adding title, description, and thumbnail before starting the broadcast.

Features

FeatureDescription
Stream SetupAdd title, description, and thumbnail for the live stream
Camera ControlsSwitch between front and back cameras
Broadcasting ControlsStart, pause, and end live stream broadcasting
Real-time PreviewLive preview of stream content before broadcasting

Required Properties

PropertyTypeDescription
targetIdStringThe ID of the target (community ID or user ID)
targetTypeAmityPost.TargetTypeType of target (community or user)
communityAmityCommunity?Community object (optional, for community streams)

Customization Options

Config IDTypeDescription
create_livestream_page/*/*PageCustomize page theme
create_livestream_page/*/start_livestream_buttonElementCustomize start stream button
create_livestream_page/*/add_thumbnail_buttonElementCustomize thumbnail selection button
create_livestream_page/*/switch_camera_buttonElementCustomize camera switch button
create_livestream_page/*/end_live_stream_buttonElementCustomize end stream button
create_livestream_page/*/live_timer_statusElementCustomize live timer display

Code Examples

// For community stream
let creationPage = AmityCreateLivestreamPage(
    targetId: "community-id", 
    targetType: .community
)
let viewController = AmitySwiftUIHostingController(rootView: creationPage)
navigationController?.pushViewController(viewController, animated: true)

// For user timeline stream
let timelineStream = AmityCreateLivestreamPage(
    targetId: "user-id", 
    targetType: .user
)
// Livestream Target Selection Navigation
class CustomLivestreamPostTargetSelectionPageBehavior: AmityLivestreamPostTargetSelectionPageBehavior {
    override func goToLiveStreamComposerPage(context: AmityLivestreamPostTargetSelectionPageBehavior.Context) {
        // Navigate to livestream creation page
        let creationPage = AmityCreateLivestreamPage(
            targetId: context.targetId, 
            targetType: context.targetType
        )
        let viewController = AmitySwiftUIHostingController(rootView: creationPage)
        navigationController?.pushViewController(viewController, animated: true)
    }
}

// Setup custom behavior
func setupLivestreamTargetSelectionBehavior() {
    let customBehavior = CustomLivestreamPostTargetSelectionPageBehavior()
    AmityUIKit4Manager.behaviour.liveStreamPostTargetSelectionPageBehavior = customBehavior
}
Implementation Strategy: Start with the Livestream Target Selection Page to establish audience targeting workflows, then implement the Creation Page for stream setup and broadcasting controls. Add the Player Page for viewer experiences and ensure proper termination handling with the Terminated Page. Consider implementing real-time moderation features for live content safety and provide clear navigation flows between stream creation, viewing, and post-stream actions. Focus on optimizing streaming quality and providing responsive controls for both broadcasters and viewers.