2013-07-16 2 views
1

OpenTok phonegap 플러그인 인 PhoneGap &과 함께 iOS (iPad) 앱을 제작하고 있습니다. 그러나 우리는 스타일링에 문제가 있습니다. 실제 비디오 내용은 opentok 프레임 워크를 통해 생성 된 객체 요소의 전체 너비에 걸쳐 있지 않습니다. 동영상과 관련하여 명시적인 크기 매개 변수를 opentok에 전달하지만 아직이 문제가 있습니다.OpenTok WebRTC 스타일링 문제

도움이 될 것입니다.

답변

0

PhoneGap 플러그인을 사용하는 iOS 장비에서 오류가 발생하지 않습니다. 모든 것이 정상적으로 작동합니다.

session = "" 
publisher = "" 

subscribeToStreams = (streams)-> 
    for e in streams 
    if (e.connection.connectionId == session.connection.connectionId) 
     return 
    div = document.createElement('div') 
    div.setAttribute('id', 'stream' + e.streamId) 
    div.setAttribute('class', "streamElement") 
    document.body.appendChild(div) 
    session.subscribe(e, div.id, {width: 640, height:480}) 

window.OTGroupChat = (apiKey, sessionId, token) -> 
    publisher = TB.initPublisher(apiKey, "myPublisherDiv", {width: 320, height: 240}) 

    session = TB.initSession(sessionId) 
    session.addEventListener 'sessionConnected', (event) -> 
    session.publish(publisher) 
    subscribeToStreams(event.streams) 

    session.addEventListener 'streamCreated', (event) -> 
    subscribeToStreams(event.streams) 

    session.connect(apiKey, token) 

결과 : 발행자보기 예상 320X240으로 나타나, 및 지정된 가입 된 스트림을 640 * 480로 나타나

여기 (커피 스크립트의) 자바 스크립트 코드 내이다.

나는 다음 콘솔에 직접 입력하여 가입 스트림의 높이를 변경 :

$("object:last").height(100); 
TB.updateViews(); 

가입자 스트림은 순종의 새로운 높이로 조정.

그런 다음 실제 비디오 내용이 object 요소의 배경색을 pink로 설정하여 object 요소의 너비보다 작은 지 여부를 테스트했습니다. 분홍색이 표시되지 않았으므로 실제 OpenTok 비디오는 object 요소의 크기보다 크거나 같습니다. 객체 요소에 크기가 1 인 핑크색 경계선을 지정하면 비디오 주위에 1px 분홍색 윤곽선이 나타나 객체 요소가 비디오와 확실히 동일한 크기임을 나타냅니다.

내가 당신을 오해하고 비디오의 양쪽에있는 검은 색 막대를 언급했다면 Im은 종횡비를 유지하는 것이 OpenTok의 방법이라고 두려워하고 iOS 장치에서 세로보기를 스트리밍하려는 사용자는 종종 동영상 주변에 막대가 있습니다.

enter image description here