Overview
TUIKaraoke is an open-source audio/video UI component that you can integrate into your project to bring online karaoke, seat management, gift giving/receiving, text chat, and other TRTC features to your application. TUIKaraoke requires only a few lines of code and also supports the Android platform. Its basic features are shown below:
Note
All TUIKit components are based on two basic PaaS services of Tencent Cloud, namely TRTC and Chat. When you activate TRTC, the Chat SDK Trial Edition (which supports up to 100 DAUs) will also be activated automatically. For Chat billing details, see Pricing. Integration
Step 1. Download and import the TUIKaraoke component
Go to GitHub, clone or download the code, copy the Source, Resources, and TXAppBasic folders and the TUIKaraoke.podspec file in the iOS directory to your project, and complete the following import operations: Add the following import commands to your Podfile:
pod 'TUIKaraoke', :path => "./", :subspecs => ["TRTC"]
pod 'TXLiteAVSDK_TRTC'
pod 'TXAppBasic', :path => "TXAppBasic/"
Open Terminal and run the following installation command in the directory of the Podfile:
Configure permission requests for your app in the info.plist file of your project. The SDKs need the following permissions (on iOS, the mic access must be requested at runtime):
<key>NSMicrophoneUsageDescription</key>
<string>`TUIKaraoke` needs to access your mic.</string>
Step 3. Initialize and log in to the component
let karaokeRoom = TRTCKaraokeRoom.shared()
karaokeRoom.setDelegate(delegate: self)
karaokeRoom.login(SDKAppID: Int32(SDKAppID), UserId: UserId, UserSig: ProfileManager.shared.curUserSig()) { code, message in
if code == 0 {
}
}
Parameter description:
SDKAppID: TRTC application ID. If you haven't activated TRTC, log in to the TRTC console, create a TRTC application, click Application Info, SDKAppID information is as shown in the figure below:
SecretKey: TRTC application key. Each secret key corresponds to an SDKAppID. You can view your application’s secret key on the Application Management page of the TRTC console. userId: Current user ID, which is a custom string that can contain up to 32 bytes of letters and digits (special characters are not supported).
userSig: The security protection signature calculated based on SDKAppID, userId, and Secretkey. You can click here to directly generate a debugging userSig online. For more information, see UserSig. Step 4. Implement the online karaoke scenario
int roomId = "Room ID";
let param = RoomParam.init()
param.roomName = "Room name";
param.needRequest = false;
param.seatCount = 8;
param.coverUrl = "URL of room cover image";
karaokeRoom.createRoom(roomID: Int32(roomInfo.roomID), roomParam: param) { [weak self] (code, message) in
guard let `self` = self else { return }
if code == 0 {
}
}
karaokeRoom.enterRoom(roomID: roomInfo.roomID) { [weak self] (code, message) in
guard let `self` = self else { return }
if code == 0 {
}
}
int seatIndex = 1;
karaokeRoom.enterSeat(seatIndex: seatIndex) { [weak self] (code, message) in
guard let `self` = self else { return }
if code == 0 {
}
}
func onSeatListChange(seatInfoList: [SeatInfo]) {
}
4. Play back songs and try out the karaoke scenario
You can get the music ID and URL to play back a song. For more information, see Music Playback APIs.
karaokeRoom.startPlayMusic(musicID: musicID, originalUrl: muscicLocalPath, accompanyUrl: accompanyLocalPath);
karaokeRoom.stopPlayMusic();
After completing the previous steps, you can implement the basic karaoke features. If your business needs more features such as chat and gift giving, you can integrate the following capabilities:
Step 5. Add the text chat feature (optional)
If you want implement a text chat feature between speakers and listeners, implement message sending/receiving as follows:
For more information on relevant APIs, see sendRoomTextMsg.
karaokeRoom.sendRoomTextMsg(message: message) { [weak self] (code, message) in
if code == 0 {
}
}
karaokeRoom.setDelegate(delegate: self)
func onRecvRoomTextMsg(message: String, userInfo: UserInfo) {
debugPrint("Received a message from" + userInfo.userName + ": " + message)
}
Step 6. Add the gift giving feature (optional)
You can implement gift giving, receiving, and displaying as follows:
karaokeRoom.sendRoomCustomMsg(cmd: kSendGiftCmd, message: message) { code, msg in
if (code == 0) {
}
}
karaokeRoom.setDelegate(delegate: self)
func onRecvRoomCustomMsg(cmd: String, message: String, userInfo: UserInfo) {
if cmd == kSendGiftCmd {
debugPrint("Received a gift from" + userInfo.userName + ": " + message)
}
}
FAQs
Does the TUIKaraoke component support sound effect features such as voice change, tone change, and reverb?
Note
If you have any suggestions or feedback, please contact colleenyu@tencent.com.
