礼物播放器
组件概述
礼物播放器主要提供展示子弹动画、展示全屏动画(svga、mp4格式),点赞动画的播放功能。
子弹动画 | 全屏动画 |
![]() | ![]() |
组件接入
1. 在您项目中的 src/main/java 目录下创建包名为 com.trtc.uikit.livekit 的目录,并将 github 上 livekit 目录下的 common 目录 和 component/gift 目录 拷贝到你创建的 com.trtc.uikit.livekit 目录下。
2. 将 github上 main 目录下的 res-common 和 res-gift 目录 拷贝到您自己工程中的 src/main 目录下。
3. 在您的 build.gradle.kts 或者 build.gradle 文件的 android 节点中添加如下配置:
sourceSets.getByName("main") {res.setSrcDirs(listOf("src/main/res", "src/main/res-common", "src/main/res-gift"))}
sourceSets {main {res.srcDirs = ['src/main/res','src/main/res-common','src/main/res-gift',]}}
4. 使用 Android Studio 的全局字符串替换 功能,将
import com.trtc.uikit.livekit.R;
全局替换为 您项目自己的 R文件,示例如下:
使用 CocoaPods 导入组件,导入组件具体骤如下:
1. 您需要在 GitHub 上下载
Gift
和Common
文件夹到本地。
2. 请在您的
Podfile
文件中添加 pod 'TUIGift'
和pod 'TUILiveResources'
依赖。target 'xxxx' do......pod 'TUILiveResources', :path => '../Component/Common/TUILiveResources.podspec'//路径是您的Podfile文件与TUILiveResources.Podspec文件之间的相对路径pod 'TUIGift', :path => '../Component/Gift/TUIGift.podspec'//路径是您的Podfile文件与TUIGift.Podspec文件之间的相对路径end
如果您没有
Podfile
文件,首先终端cd
到xxxx.xcodeproj
目录,然后通过以下命令创建:pod init
3. 在终端中,首先
cd
到Podfile
目录下,然后执行以下命令,安装组件。pod install
4. 您在接入和使用过程中遇到的任何问题,欢迎给我们 反馈。
1. 在项目工程的
pubspec.yaml
文件的 dependencies
节点中,添加 gift 的依赖。dependencies:flutter:sdk: flutterflutter_localizations:sdk: flutterintl: ^0.19.0# 添加 gift 依赖live_uikit_gift: ^1.0.0
2. 执行
fluter pub get
命令3. 配置多语言支持,在您应用
MaterialApp
的 localizationsDelegates
和 supportedLocales
属性上添加 gift 组件的多语言支持。MaterialApp(localizationsDelegates: const [...GiftLocalizations.localizationsDelegates,], supportedLocales: const [...GiftLocalizations.supportedLocales,],// ...);
组件使用
说明:
由于礼物组件需要直播间信息参数,所以需要在观众进入直播间或者主播创建直播间后,再加载礼物组件。
接入礼物播放器
礼物展示组件
GiftPlayView
自身会接收并播放礼物消息。GiftPlayView giftPlayView = new GiftPlayView(getContext());giftPlayView.init("roomId");
礼物展示组件
GiftPlayView
自身会接收并播放礼物消息。您只需要创建
GiftPlayView
对象并将其添加到您的视图上即可。import TUIGiftlet giftPlayView = GiftPlayView(groupId: roomId)// ...此处将giftPlayView添加到您的父视图上并调整布局
在您需要接入显示礼物消息的地方构建
GiftDisplayController
和 GiftDisplayWidget
对象,并将构建的 GiftDisplayWidget
对象添加到您的 Widget
树上。示例代码如下:GiftDisplayController _giftDisplayController = GiftDisplayController(rroomId: "roomId", /// roomId 替换为您的直播间IDowner: ownerInfo, /// ownerInfo 替换为您的直播间主播信息self: selfInfo, /// selfInfo 替换为您的登录用户信息);GiftDisplayWidget(controller: _giftDisplayController!);
监听礼物收发消息
若需要获取接收礼物的回调信息,可实现
GiftPlayView
的 TUIGiftPlayViewListener
中的 onReceiveGift
函数。giftPlayView.setListener(new GiftPlayView.TUIGiftPlayViewListener() {@Overridepublic void onReceiveGift(Gift gift, int giftCount, GiftUser sender, GiftUser receiver) {}@Overridepublic void onPlayGiftAnimation(GiftPlayView view, Gift gift) {}});
说明:
在您成功进入房间之后,您才会收到
onReceiveGift
回调。若需要获取接收礼物的回调信息,可实现
GiftPlayView
的 代理GiftPlayViewDelegate
中的 giftPlayView:onReceiveGift:gift:giftCount:sender:receiver
函数。import TUIGiftfunc giftPlayView(_ giftPlayView: GiftPlayView, onReceiveGift gift: TUIGift, giftCount: Int, sender: TUIGiftUser, receiver: TUIGiftUser)// 自定义处理}
当播放全屏礼物动画时,您会收到
giftPlayView:onPlayGiftAnimation:gift
回调,在该回调中您可调用 playGiftAnimation
函数播放全屏礼物动画。import TUIGiftfunc giftPlayView(_ giftPlayView: GiftPlayView, onPlayGiftAnimation gift: TUIGift) {let fileUrl = "" //您需要将gift.animationUrl对应的动画资源保存到沙箱中,然后将沙箱中的动画地址赋值给fileUrlgiftPlayView.playGiftAnimation(playUrl: fileUrl)}
说明:
您需要确保给函数
playGiftAnimation
传入的参数是本地沙箱路径。若需要获取收发礼物的回调信息,您可以调用
GiftDisplayController
的 setGiftCallback
方法, 示例代码如下所示:_giftDisplayController?.setGiftCallback(onReceiveGiftCallback: _onReceiveGiftCallback, /// _onReceiveGiftCallback 可以替换为您的自定义处理方法onSendGiftCallback: _onSendGiftCallback, /// _onSendGiftCallback 可以替换为您的自定义处理方法);