Description of the Feature
The Floating Window feature allows the host and viewers to enter Small Window mode without leaving the Live Streaming room. The Small Window floats on the Screen and can be freely dragged to an appropriate Position, displaying the Live Streaming content within the Floating Window. In Floating Window mode, the App can switch to other Scenarios or run in the background. Clicking on the Floating Window can restore the normal full-screen Live Streaming interface.
Use Instructions
Overview
The Principle of the Floating Window is to add the video Live Streaming View as the content of the Floating Window on the rootWindow.
Quick Integration
Core code of the Floating Window feature:
// File location: iOS/TUILiveKit/Sources/Component/FloatWindow
FloatWindow // Implementation directory of the core feature of the Floating Window
├── FloatWindow.swift // External interface of the Floating Window feature
└── FloatView.swift // Floating Window View
Floating Window data source:
The ViewController that displays the Floating Window needs to implement the following data source so that the Floating Window can obtain the correct view data.
protocol FloatWindowDataSource: {
func getRoomId() -> String
func getCoreView() -> LiveCoreView
func relayoutCoreView()
}
Use cases and examples:
Displaying Floating Window:
class ExampleViewController: UIViewController {
override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {
FloatWindow.shared.showFloatWindow(controller: self)
}
}
Audience clicks to enter a specific live streaming room from the room list:
if FloatWindow.shared.isShowingFloatWindow() {
if FloatWindow.shared.getCurrentRoomId() == liveInfo.roomInfo.roomId {
FloatWindow.shared.resumeLive(atViewController: self.navigationController ?? self)
return
} else {
FloatWindow.shared.releaseFloatWindow()
}
}
Host starts streaming:
The floating window feature is not supported for hosts yet, so you need to close any existing floating windows before starting a live stream.
if FloatWindow.shared.isShowingFloatWindow() {
FloatWindow.shared.releaseFloatWindow()
}
Mode Switch
In the live streaming scenario, during the mode switching process, you need to use the same LiveCoreView
object to display the live content in both modes. This not only allows sharing the view but also sharing live streaming data and status.
As shown in the figure above, the normal mode is the LiveViewController
scenario, and the floating window mode is the LiveFloatWindow
scenario. During the mode switching process, you can use the same LiveCoreView
object to ensure the live streaming process proceeds normally.
Was this page helpful?