GiftSendWidget
: send gift message view, clicking it can bring up the gift panel.GiftDisplayWidget
: receive gift message view, it will display gift messages on this view.Gift Display Panel | Normal Gift Playback Effect | Full-Screen Gift Playback Effect |
![]() | ![]() | ![]() |
GiftListPanelView
: gift panel, presents the gift list, send gifts, and top-up.GiftPlayView
: Panel for playing gifts, automatically listens to gift messages.Gift Display Panel | Normal Gift Playback Effect | Full-Screen Gift Playback Effect |
![]() | ![]() | ![]() |
GiftListView
: gift panel, presenting the gift list and send gifts.GiftPlayView
: A panel for playing gifts, automatically listens for gift messages.Gift Display Panel | Normal Gift Playing Effect | Full-Screen Gift Playing Effect |
![]() | ![]() | ![]() |
dependencies
section in your project's pubspec.yaml
file.dependencies:flutter:sdk: flutterflutter_localizations:sdk: flutterintl: ^0.19.0# Add gift local dependencygift:path: ../gift
localizationsDelegates
and supportedLocales
properties of your MaterialApp
.MaterialApp(localizationsDelegates: const [...GiftLocalizations.localizationsDelegates,], supportedLocales: const [...GiftLocalizations.supportedLocales,], theme: ThemeData.dark(), home: const HomeScreen());
GiftSendController
and GiftSendWidget
objects where you need to integrate the gift sending message, and add the constructed GiftSendWidget
object to your Widget
tree. Example code is as follows:GiftSendController _giftSendController = GiftSendController(roomId: "liveRoomId", /// liveRoomId Replace with your live room IDowner: ownerInfo, /// ownerInfo Replace with your live room host informationself: selfInfo, /// selfInfo Replace with your login user information);GiftSendWidget(controller: _giftSendController);
GiftListPanelView
OnSendGiftListener
callback onSendGift
to get the number of gifts and gift information. After preprocessing, you can call the GiftListPanelView
function sendGift
for the actual sending of gifts.public void onSendGift(GiftListPanelView giftListView, Gift gift, int giftCount) {//...Here is the pre-processing, such as verifying the current user's balance, etcGiftUser receiver = new GiftUser();//...Here set the gift recipient informationgiftListView.sendGift(gift, giftCount, receiver);}
GiftListView
object and add it to your view. You also need to implement the GiftListViewDelegate
callback method onSendGift
.GiftListView
panel, you will receive this callback. You can get the number of gifts to be sent and the gift information in this method. After preprocessing, you can call the GiftListView
function sendGift
for the actual sending of gifts.lazy var giftListView = GiftListView(roomId: roomId, delegate: self)// ...Add giftListView to your parent view and adjust the layout herefunc onSendGift(gift model: TUIGift, giftCount: Int) {//... Preprocessing here, such as verifying the current user's balancelet receiver = TUIGiftUser()//... Set gift recipient information heregiftListView.sendGift(model: giftModel, giftCount: giftCount, receiver: receiver, completion: completion)}
GiftDisplayController
and GiftDisplayWidget
objects where you need to integrate the gift display message, and add the constructed GiftDisplayWidget
object to your Widget
tree. Example code is as follows:GiftDisplayController _giftDisplayController = GiftDisplayController(rroomId: "liveRoomId", /// liveRoomId Replace with your live room IDowner: ownerInfo, /// ownerInfo Replace with your live room host informationself: selfInfo, /// selfInfo Replace with your login user information);GiftDisplayWidget(controller: _giftDisplayController!);
GiftPlayView
itself will receive and play gift messages.GiftPlayView giftPlayView = new GiftPlayView(mContext, roomId);
GiftPlayView
will receive and play gift messages.GiftPlayView
object and add it to your view.let giftPlayView = GiftPlayView(groupId: roomId)// ...Add giftPlayView to your parent view and adjust the layout here
GiftDisplayController
's setGiftCallback
method. Example code is as follows:_giftDisplayController?.setGiftCallback(onReceiveGiftCallback: _onReceiveGiftCallback, /// _onReceiveGiftCallback can be replaced with your custom handling methodonSendGiftCallback: _onSendGiftCallback, /// _onSendGiftCallback can be replaced with your custom handling method);
GiftPlayView
TUIGiftPlayViewListener
function onReceiveGift
.public
interface
TUIGiftPlayViewListener
{
void
onReceiveGift
(
Giftgift
,
int
giftCount
,
GiftUser
sender
,
GiftUser
receiver
)
;
//...
}
GiftPlayView
's delegate GiftPlayViewDelegate
's giftPlayView:onReceiveGift:gift:giftCount:sender:receiver
function.func giftPlayView(_ giftPlayView: GiftPlayView, onReceiveGift gift: TUIGift, giftCount: Int, sender: TUIGiftUser, receiver: TUIGiftUser)// Custom Processing}
GiftSendController
's setGiftList
method, as shown below: List<GiftModel> giftList = [ /// Customize your gift list data sourceGiftModel(giftId: "1", giftName: "Egg", imageUrl: "giftImageUrl", price: 10),GiftModel(giftId: "2", giftName: "Star", imageUrl: "giftImageUrl", price: 10),];_giftSendController.setGiftList(giftList);
mGiftCloudServer.queryGiftInfoList((error, result) -> post(() -> {if (error == Error.NO_ERROR) {mGiftListView.setGiftList(result);} else {ToastUtil.toastLongMessage("query gift list error, code = " + error);}}));
queryGiftInfoList
method themselves to obtain a custom gift list List<
Gift>
, and set the gift list through GiftListView.setGiftList
.animationUrl
of the gift requires an SVGA animation.// File location: iOS/TUILiveKit/Sources/Component/Gift/Store/TUIGiftStore.swiftclass TUIGiftStore {static let shared = TUIGiftStore()private init() {giftCloudServer.queryGiftInfoList { [weak self] error, giftList inguard let self = self else { return }if error == .noError {self.giftList = giftList}}}var giftList: [TUIGift] = []let giftCloudServer: IGiftCloudServer = GiftCloudServer()}// File location: iOS/TUILiveKit/Sources/LiveStream/Main/Manager/LSRouterControlCenter.swiftprivate func getRouteDefaultView(route: LSRoute) -> UIView?{switch route {case .giftView:let giftPanel = GiftListPanel(roomId: manager.roomState.roomId, dataSource: manager)giftPanel.setGiftList(TUIGiftStore.shared.giftList)view = giftPanel}}
queryGiftInfoList
method themselves to obtain a custom gift list List<TUIGift>
, and set the gift list through GiftListView.setGiftList
.animationUrl
of the gift requires an SVGA animation.queryGiftInfoList
method themselves to obtain a custom gift list List<TUIGift>
, and set the gift list through GiftListView.setGiftList
.animationUrl requires an SVGA animation
.controller
needs to integrate some live room information parameters and user information, it should be loaded after the audience enters the live broadcast room or the anchor creates a live streaming room.
Was this page helpful?