更新记录

1.0.7（2024-05-31）

修改页面组件事件名称为小写，处理uniapp x含大写字母事件不能触发的问题。

1.0.6（2024-05-25）

处理iOS引用framework包容易导致App启动崩溃的问题

1.0.5（2024-05-22）

修改页面组件调用名称，修复uni-app x项目插件调用问题。

查看更多

平台兼容性

HbuilderX/cli最低兼容版本
3.7.0

uni-app

Vue2 Vue3
√ ?
app-vue app-nvue app-android app-ios
? ? ? ?
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
? ? ? ? ? ? ? ? ?
微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序 钉钉小程序 快手小程序 飞书小程序 京东小程序
? ? ? ? ? ? ? ? ?
快应用-华为 快应用-联盟
? ?

uni-app x

app-android app-ios
? ?
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
? ? ? ? ? ? ? ? ?

概述

XF-txLivePlayerUTS封装了腾讯直播播放SDK，可以实现腾讯RTMP\RTC直播播放功能。

模块调用

<txlive-player ref="txLivePlayer" :style="{width:widthNum+'rpx',height:heightNum+'px',background:yanse}"
@streamList="onStreamList" @playing="" @error="onError" @warning="onWarning">
</txlive-player>

播放器监听事件列表

@streamList //执行getStreamList接口返回
@playing //执行isPlaying接口返回
@error
@warning
@videoresolutionchanged
@connected
@videoplaying
@audioplaying
@videoloading
@audioloading
@playoutvolumeupdate
@statisticsupdate
@snapshotcomplete
@rendervideoframe
@playoutaudioframe
@receiveseimessage
@streamswitched
@pictureinpicturestateupdate
@localrecordbegin
@localrecording
@localrecordcomplete

模块接口

setLicence

设置腾讯授权

uni-app项目中（vue/nvue）调用示例：

import { setLicence } from "@/uni_modules/XF-txLivePlayerUTS"

setLicence({
    url: '',
    key: '',
    complete: (res) => {
        console.log(res)
    }
})

uni-app x项目（uvue）中调用示例：

import { setLicence } from "@/uni_modules/XF-txLivePlayerUTS";
import { LicenceOptions } from "@/uni_modules/XF-txLivePlayerUTS/utssdk/interface.uts";

let options = {
  url: '',
  key: '',
  complete: (res : any) => {
    console.log(res)
  }
} as LicenceOptions;
setLicence(options);

可用性

iOS、Android系统

可提供的1.0.0及更高版本

setRenderFillMode

设置画面的填充模式

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].setRenderFillMode(0);

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).setRenderFillMode(0);
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].setRenderFillMode(0);
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

setRenderRotation

设置播放器画面的旋转角度

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].setRenderRotation(90);

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).setRenderRotation(90);
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].setRenderRotation(90);
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

setRenderFillMode

设置画面的填充模式

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].setRenderFillMode(0);

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).setRenderFillMode(0);
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].setRenderFillMode(0);
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

startPlay

开始播放音视频流

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].startPlay("rtmp://");

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).startPlay("rtmp://");
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].startPlay("rtmp://");
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

stopPlay

停止播放音视频流

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].stopPlay();

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).stopPlay();
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].stopPlay();
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

isPlaying

播放器是否正在播放中

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].isPlaying();

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).isPlaying();
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].isPlaying();
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

pauseAudio

暂停播放器的音频流

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].pauseAudio();

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).pauseAudio();
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].pauseAudio();
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

resumeAudio

恢复播放器的音频流

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].resumeAudio();

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).resumeAudio();
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].resumeAudio();
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

pauseVideo

暂停播放器的视频流

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].pauseVideo();

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).pauseVideo();
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].pauseVideo();
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

resumeVideo

恢复播放器的视频流

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].resumeVideo();

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).resumeVideo();
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].resumeVideo();
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

setPlayoutVolume

设置播放器音量

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].setPlayoutVolume(30);

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).setPlayoutVolume(30);
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].setPlayoutVolume(30);
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

setCacheParams

设置播放器缓存自动调整的最小和最大时间 ( 单位：秒 )

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].setCacheParams(1,3);

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).setCacheParams(1,3);
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].setCacheParams(1,3);
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

switchStream

直播流无缝切换，支持 FLV 和 LEB

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].switchStream("rtmp://");

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).switchStream("rtmp://");
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].switchStream("rtmp://");
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

getStreamList

获取码流信息

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].getStreamList();

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).getStreamList();
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].getStreamList();
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

enableVolumeEvaluation

启用播放音量大小提示

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].enableVolumeEvaluation(100);

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).enableVolumeEvaluation(100);
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].enableVolumeEvaluation(100);
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

snapshot

截取播放过程中的视频画面

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].snapshot();

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).snapshot();
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].snapshot();
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

enableObserveVideoFrame

开启/关闭对视频帧的监听回调

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].enableObserveVideoFrame(false,1,1);

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).enableObserveVideoFrame(false,1,1);
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].enableObserveVideoFrame(false,1,1);
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

enableObserveAudioFrame

开启/关闭对音频数据的监听回调

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].enableObserveAudioFrame(false);

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).enableObserveAudioFrame(false);
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].enableObserveAudioFrame(false);
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

enableReceiveSeiMessage

开启接收 SEI 消息

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].enableReceiveSeiMessage(true,242);

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).enableReceiveSeiMessage(true,242);
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].enableReceiveSeiMessage(true,242);
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

showDebugView

显示仪表盘

uni-app项目中（vue/nvue）调用示例：

this.$refs["txLivePlayer"].showDebugView();

uni-app x项目（uvue）中调用示例：

// #ifdef APP-ANDROID
import { TxlivePlayerElement } from 'uts.sdk.modules.XFTxLivePlayerUTS';
// #endif
// #ifdef APP-ANDROID
(this.$refs["txLivePlayer"] as TxlivePlayerElement).showDebugView();
// #endif
// #ifdef APP-IOS
this.$refs["txLivePlayer"].showDebugView();
// #endif

可用性

iOS、Android系统

可提供的1.0.0及更高版本

隐私、权限声明

1. 本插件需要申请的系统权限列表：

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

无

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

评论列表 撰写评论 向官方投诉

暂无用户评论。

插件问答 我要提问

使用中有什么不明白的地方，就向插件作者提问吧~ 我要提问

加载更多...