我正在尝试实现允许在Android应用中的视频会话中间在屏幕共享捕获和相机之间切换的功能。我使用OpenTok SDK 2.5 for Android。
我研究过OpenTok示例（OpenTok samples），并认为它们只显示每个程序示例的一个功能。
问题：代码应该提供两个发布者（一个配备Camera，一个配有Screensharing捕获器）并切换它们，例如
session.unpublish();
if (currentIsCamera) {
session.publish(screenSharingPublisher);
}
else {
session.publish(cameraPublisher);
}
或者更好地坚持使用单个Publisher并根据需要在BaseVideoCapturer和ScreensharingCapturer之间切换？
mPublisher.setPublishVideo(false);
BaseVideoCapturer bvc = mPublisher.getCapturer();
if(bvc != null){
bvc.destroy();
}
//intent to start picture capture (Ex. ACTION_IMAGE_CAPTURE)
拍照后恢复时，需要重新初始化
BaseVideoCapturer bvc = mPublisher.getCapturer();
if(bvc != null){
if(bvc.isCaptureStarted() == false){
bvc.init();
bvc.startCapture();
mPublisher.setPublishVideo(true);
}
}
我从解决方案setPublishVideo(false) does not free the Camera
中提取的这个示例我怀疑取消发布/发布会破坏会话，这不是我想要的。
P.S.Sryry我的英语不是我的母语。答案 0 :(得分：0)
在文档上准备好调用视频发布方法
var apiKey = '<APP_KEY>';
var sessionId = '<Session ID >';//Server Side Values
var token = '<Token >';//Server Side Values
var isModerator = <Yes/No>;//Handle it on server Side
var publisher;
var screenPublisher;
var streamMode = "camera";
session = OT.initSession(apiKey, sessionId);
publishVideo();
sessionEvents(publisher);
connectSession();
HTML代码
<div id="subscribers" class="container-fluid show-controls">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div classs="live-stream">
<div class="caller-list">
<ul>
<li class="">
<div id="publisher" class="draggable user-camscreen">
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="controls" id="">
<div>
<button id="btnShareScreen" data-screen="0" class="">
<img src="~/Content/img/Student/screenshare.svg" class="screenshare" />
</button>
<p class="mb-none mt-xs text-sm line-height-xs text-white">Screen</p>
</div>
</div>
在相机/屏幕切换按钮上，点击通话
/*
Switching between camera and screen
*/
$("#btnShareScreen").on("click", function () {
el = $(this);
if (el.data('screen') == 0) {
//Publish Screen
publishScreen();
connectSession();
el.data('screen', '1');
el.find('img').attr('src', '/Content/img/Student/video-icon.svg');
el.parent().find('p').html("Camera");
}
else {
publishVideo();
connectSession();
el.data('screen', '0');
el.find('img').attr('src', '/Content/img/Student/screenshare.svg');
el.parent().find('p').html("Screen");
}
});
所有方法
function publishVideo() {
console.log(screenPublisher);
if (screenPublisher != undefined) {
endStream(screenPublisher);
}
createPublisherDiv();
publisher = OT.initPublisher('publisher', function (error) {
if (error) {
// Look at error.message to see what went wrong.
} else {
session.publish(publisher, function (error) {
if (error) {
// Look error.message to see what went wrong.
} else {
streamMode = "camera";
}
});
}
});
}
function publishScreen() {
OT.checkScreenSharingCapability(function (response) {
if (!response.supported || response.extensionRegistered === false) {
// This browser does not support screen sharing.
$.alert({
title: 'Alert!',
content: 'Your Browser Does Not Support Screen Sharing',
});
} else if (response.extensionInstalled === false) {
// Prompt to install the extension.
} else {
//Screen sharing available
endStream(publisher);
createPublisherDiv();
const publish = Promise.all([
OT.getUserMedia({
videoSource: 'screen'
}),
OT.getUserMedia({
videoSource: null
})
]).then(([screenStream, micStream]) => {
return screenPublisher = OT.initPublisher('publisher', {
videoSource: screenStream.getVideoTracks()[0],
audioSource: micStream.getAudioTracks()[0],
fitMode: "contain"
});
});
publish.then(screenPublisher => {
session.publish(screenPublisher, function (error) {
if (error) {
// Look error.message to see what went wrong.
} else {
streamMode = "screen";
}
});
}).catch(handleError);
}
});
}
function endStream(streamPublisher) {
session.unpublish(streamPublisher, function () {
//Call back
});
}
function connectSession() {
session.connect(token, function (error) {
if (error) {
console.error('Failed to connect', error);
}
});
}
function sessionEvents(streamPublisher) {
session.on({
sessionConnected: function (event) {
// Publish the publisher we initialzed earlier (this will trigger 'streamCreated' on other
// clients)
session.publish(streamPublisher, function (error) {
if (error) {
console.error('Failed to publish', error);
} else {
console.log("Publish success");
}
});
},
// This function runs when another client publishes a stream (eg. session.publish())
streamCreated: function (event) {
// Create a container for a new Subscriber, assign it an id using the streamId, put it inside
// the element with id="subscribers"
console.log(event.stream);
var subOptions = {
width: '100%', height: '100%'
};
var subContainer = document.createElement('div');
subContainer.id = 'stream-' + event.stream.streamId;
document.getElementById('subscribers').appendChild(subContainer);
// Subscribe to the stream that caused this event, put it inside the container we just made
subscriber = session.subscribe(event.stream, subContainer, subOptions, function (error) {
if (error) {
console.error('Failed to subscribe', error);
}
});
}
});
}
/*
OpenTok Unpublish Methods removes publisher div.That's why dynamically creating div
*/
function createPublisherDiv() {
$('.caller-list').find('li').empty();
var html = '<div id="publisher" class="draggable user-camscreen"></div>';
$('.caller-list').find('li').append(html);
}
function handleError(err) {
if (err) console.log(err.message);
}