Tencent Cloud

Recent Pages

Customizing a Seat

Last updated: 2024-12-24 18:09:24

This document mainly introduces how to customize a SeatGridView.
Prerequisites
Before using SeatGridView, you need to integrate and log in to SeatGridView to ensure the subsequent features work properly.
Usage guide
Step 1: Adding SeatGridView to the View
You need to import the SeatGridView module first, then create a SeatGridView object and add it to your view.
iOS
Android
import UIKit
import RTCRoomEngine
import SeatGridView 
﻿
class CustomizeSeatViewController: UIViewController {
    private let seatGridView: SeatGridView = {   
      let view = SeatGridView()
      self.seatGridView.setSeatViewDelegate(self)
      return view
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()
        self.seatGridView.setSeatViewDelegate(self)
        // Add seatGridView to the view and set layout constraints
    }
}
import com.trtc.uikit.livekit.seatGridView.SeatGridView;
﻿
public class CustomizeSeatViewActivity extends AppCompatActivity {
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        SeatGridView seatGridView = new SeatGridView(this);
        addContentView(seatGridView,
                new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
    }
}
Step 2: Customizing a Seat
iOS
Android
If you want to customize the seat view, you need to implement the SeatGridView delegate SGSeatViewDelegate.
protocol SGSeatViewDelegate{
    func seatGridView(_ view: SeatGridView, createSeatView seatInfo: TUISeatInfo) -> UIView?
    func seatGridView(_ view: SeatGridView, updateSeatView seatInfo: TUISeatInfo, seatView: UIView)
    func seatGridView(_ view: SeatGridView, updateUserVolume volume: Int, seatView: UIView)
}
The following is a usage example:
extension CustomizeSeatViewController: SGSeatViewDelegate {
    func seatGridView(_ view: SeatGridView, createSeatView seatInfo: TUISeatInfo) -> UIView? {
        return CustomSeatView(seatInfo: seatInfo)
     }
     
    func seatGridView(_ view: SeatGridView, updateSeatView seatInfo: TUISeatInfo, seatView: UIView) {
        if let seatView = seatView as? CustomSeatView {
            seatView.updateSeatView(withSeatInfo: seatInfo)
        }
    }
    
    func seatGridView(_ view: SeatGridView, updateUserVolume volume: Int, seatView: UIView) {
        if let seatView = seatView as? CustomSeatView {
            seatView.updateSeatView(withVolume: volume)
        }
    }
}
﻿
// Please replace with your SeatView
class CustomSeatView: UIView { 
    var seatInfo: TUISeatInfo = TUISeatInfo()
    var volume: Int = 0
    
    // ... UI
﻿
    init(seatInfo: TUISeatInfo) {
        self.seatInfo = seatInfo
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
﻿
    
    func updateSeatView(withSeatInfo seatInfo: TUISeatInfo) {
        self.seatInfo = seatInfo
        // ...
    }
﻿
    
﻿
    func updateSeatView(withVolume volume: Int) {
        self.volume = volume
        // ...
    }
}
If you want to customize the seat view, you need to implement the SeatGridView adapter SeatViewAdapter.
public interface SeatViewAdapter {
    View createSeatView(SeatGridView seatGridView, TUIRoomDefine.SeatInfo seatInfo);
    void updateSeatView(SeatGridView seatGridView, TUIRoomDefine.SeatInfo seatInfo, View seatView);
    void updateUserVolume(SeatGridView seatGridView, int volume, View seatView);
}
The following is a usage example:
seatGridView.setSeatViewAdapter(new VoiceRoomDefine.SeatViewAdapter() {
    @Override
    View createSeatView(SeatGridView seatGridView, TUIRoomDefine.SeatInfo seatInfo) {
        TextView seatUserName = new TextView(CustomizeSeatViewActivity.this);
        seatUserName.setText(seatInfo.userName);
        return seatUserName;
    }
    
    @Override
    void updateSeatView(SeatGridView seatGridView, TUIRoomDefine.SeatInfo seatInfo, View seatView) {
﻿
    }
    
    @Override
    void updateUserVolume(SeatGridView seatGridView, int volume, View seatView) {
﻿
    }
});
﻿

Contact Us

Contact our sales team or business advisors to help your business.

Technical Support

Open a ticket if you're looking for further assistance. Our Ticket is 7x24 avaliable.

7x24 Phone Support

tencent cloud

Recent Pages

Customizing a Seat

Prerequisites

Usage guide

Step 1: Adding SeatGridView to the View

Step 2: Customizing a Seat

Was this page helpful?

Was this page helpful?

tencent cloud

Sign Up

Log in

Recent Pages

Customizing a Seat

Prerequisites

Usage guide

Step 1: Adding SeatGridView to the View

Step 2: Customizing a Seat

Was this page helpful?

Was this page helpful?