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
Feature | iOS | Android | Web | Flutter | React 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
Feature | Description |
---|---|
Target Selection | Choose between community or personal timeline broadcasting |
Community Browsing | Browse and select specific communities for broadcasting |
Audience Preview | Preview potential reach and audience for selected target |
Required Properties
Property | Type | Description |
---|---|---|
None | - | Page requires no mandatory properties |
Customization Options
Config ID | Type | Description |
---|---|---|
livestream_post_target_selection_page/*/* | Page | Customize page theme |
livestream_post_target_selection_page/*/close_button | Element | Customize close button image |
livestream_post_target_selection_page/*/my_timeline_text | Element | Customize timeline option text |
livestream_post_target_selection_page/*/title | Element | Customize page title text |
Code Examples
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
Feature | Description |
---|---|
Stream Setup | Add title, description, and thumbnail for the live stream |
Camera Controls | Switch between front and back cameras |
Broadcasting Controls | Start, pause, and end live stream broadcasting |
Real-time Preview | Live preview of stream content before broadcasting |
Required Properties
Property | Type | Description |
---|---|---|
targetId | String | The ID of the target (community ID or user ID) |
targetType | AmityPost.TargetType | Type of target (community or user) |
community | AmityCommunity? | Community object (optional, for community streams) |
Customization Options
Config ID | Type | Description |
---|---|---|
create_livestream_page/*/* | Page | Customize page theme |
create_livestream_page/*/start_livestream_button | Element | Customize start stream button |
create_livestream_page/*/add_thumbnail_button | Element | Customize thumbnail selection button |
create_livestream_page/*/switch_camera_button | Element | Customize camera switch button |
create_livestream_page/*/end_live_stream_button | Element | Customize end stream button |
create_livestream_page/*/live_timer_status | Element | Customize live timer display |
Code Examples
Navigation Behavior
Related Components
Posts & Media
Post Components
Post creation and media management for livestream posts
Social Feeds
Feed Components
Livestream post display and interaction in social feeds
Communities
Community Features
Community-based livestream broadcasting and management
Users & Profiles
User Management
User profile integration with livestream content
Comments & Reactions
Interaction Components
Real-time engagement during live streams
Content Moderation
Moderation Tools
Livestream content moderation and safety controls
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.