Custom Co-Hosting and Connection View

Last updated: 2024-12-24 16:52:25
This document mainly introduces how to use the LiveStreamCore module's LiveCoreView to implement a custom co-hosting and connection view.
Prerequisites
Before using LiveStreamCore, you need to integrate and log in to LiveStreamCore to ensure the subsequent features work properly.
Usage guide
Step 1: Adding LiveCoreView to the View
You need to first import the LiveStreamCore module, then create a LiveCoreView view object and add it to your view.
iOS
Android
import LiveStreamCore
import RTCRoomEngine
﻿
class CustomizeConncetionController: UIViewController {
    private let liveCoreView: LiveCoreView = {   
      let view = LiveCoreView()
      return view
    }()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        self.liveCoreView.videoViewDelegate = self
        // Add liveCoreView to the view and set layout constraints
    }
}
public class CustomizeConnectionActivity extends AppCompatActivity {
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        LiveCoreView liveCoreView = new LiveCoreView(this);
        addContentView(liveCoreView,
                new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
    }
}
Step 2: Customizing Co-Hosting View
iOS
Android
If you want to customize the co-hosting and connection view, you need to implement the LiveCoreView delegate VideoViewDelegate.
﻿
protocol VideoViewDelegate {
    func createCoGuestView(userInfo: TUIUserInfo) -> UIView?
    func updateCoGuestView(userInfo: TUIUserInfo, modifyFlag: UserInfoModifyFlag, coGuestView: UIView)
    func createCoHostView(coHostUser: TUIConnectionUser) -> UIView?
    func updateCoHostView(coHostUser: TUIConnectionUser, modifyFlag: UserInfoModifyFlag, coHostView: UIView)
}
The following is a usage example:
extension CustomizeSeatViewController: SGSeatViewDelegate {
    func createCoGuestView(userInfo: TUIUserInfo) -> UIView? {
        return CustomCoGuestView(userInfo: userInfo)
     }
     
    func updateCoGuestView(userInfo: TUIUserInfo, modifyFlag: UserInfoModifyFlag, coGuestView: UIView) {
        if let coGuestView = coGuestView as? CustomCoGuestView {
            coGuestView.updateView(withUserInfo: userInfo)
        }
    }
    
    func createCoHostView(coHostUser: TUIConnectionUser) -> UIView? {
        return CustomCoHostView(coHostUser: coHostUser)
    }
     
    func updateCoHostView(coHostUser: TUIConnectionUser, modifyFlag: UserInfoModifyFlag, coHostView: UIView)
        if let coHostiew = coHostiew as? CustomCoGuestView {
            coHostiew.updateView(withUser: coHostUser)
        }
    }
}
﻿
// Please replace with your CoGuestView
class CustomCoGuestView: UIView {
    var userInfo: TUIUserInfo = TUIUserInfo()
    // ... UI
    init(userInfo: TUIUserInfo) {
        self.userInfo = userInfo
    }
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
﻿
    func updateView(withUserInfo userInfo: TUIUserInfo) {
        self.userInfo = userInfo
        // ...
    }
}
﻿
// Please replace with your CoHostView
class CustomCoHostView: UIView {
    var coHostUser: TUIConnectionUser = TUIConnectionUser()
    // ... UI
﻿
    init(coHostUser: TUIConnectionUser) {
        self.coHostUser = coHostUser
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
﻿
    func updateView(withUser user: TUIConnectionUser) {
        self.coHostUser = user
        // ...
    }
}
If you want to customize the co-hosting and connection view, you need to implement the LiveCoreView adapter VideoViewAdapter.
﻿
public interface VideoViewAdapter {
    View createCoGuestView(TUIRoomDefine.UserInfo var1);
﻿
    void updateCoGuestView(TUIRoomDefine.UserInfo var1, List<UserInfoModifyFlag> var2, View var3);
﻿
    View createCoHostView(CoHostUser var1);
﻿
    void updateCoHostView(CoHostUser var1, List<UserInfoModifyFlag> var2, View var3);
}
The following is a usage example:
liveCoreView.setVideoViewAdapter(new LiveCoreViewDefine.VideoViewAdapter() {
    @Override
    public View createCoGuestView(TUIRoomDefine.UserInfo userInfo) {
        TextView coGuestUserName = new TextView(CustomizeConnectionActivity.this);
        coGuestUserName.setText(userInfo.userName);
        return coGuestUserName;
    }
﻿
    @Override
    public void updateCoGuestView(TUIRoomDefine.UserInfo userInfo, List<LiveCoreViewDefine.UserInfoModifyFlag> list, View view) {
﻿
    }
﻿
    @Override
    public View createCoHostView(LiveCoreViewDefine.CoHostUser coHostUser) {
        TextView coHostUserName = new TextView(CustomizeConnectionActivity.this);
        coHostUserName.setText(coHostUser.connectionUser.userName);
        return coHostUserName;
    }
﻿
    @Override
    public void updateCoHostView(LiveCoreViewDefine.CoHostUser coHostUser, List<LiveCoreViewDefine.UserInfoModifyFlag> list, View view) {
﻿
    }
});
tencent cloud

Recent Pages

Custom Co-Hosting and Connection View

Prerequisites

Usage guide

Step 1: Adding LiveCoreView to the View

Step 2: Customizing Co-Hosting View

Was this page helpful?

Was this page helpful?

tencent cloud

Sign Up

Log in

Recent Pages

Custom Co-Hosting and Connection View

Prerequisites

Usage guide

Step 1: Adding LiveCoreView to the View

Step 2: Customizing Co-Hosting View

Was this page helpful?

Was this page helpful?
