2016-11-05 4 views
1

chromecast SDK 3.0을 사용 중이며 사용자 지정 리시버를 만들고 싶습니다. 그것은 비디오 및 오디오와 잘 작동하지만 이미지 캐스팅에는 문제가 있습니다.사용자 지정 리시버가 올바르게 이미지를 표시하지 않습니다.

<body style="margin: 0"> 
     <img id="androidImage" src="" /> 
... 


에서 JS 파일 : 이러한 구현 이미지

sampleplayer.CastPlayer.prototype.loadImage_ = function(info) { 
    this.log_('loadImage_'); 
    var url = info.message.media.contentId; 
    document.getElementById("androidImage").src=url; 
    this.setState_(sampleplayer.State.PLAYING, true); 
}; 

1 초에 나타나고 배경 이미지로 대체하여 사라
HTML 파일 있다. 또한 이미지가 잘못된 크기로 표시됩니다. 스타일을 적용하려면 다음 코드를 사용하십시오.

<style> 
     img#androidImage { 
     height:100%; 
     width:100%; 
     } 
    </style> 

누군가 입력이 있습니까? 감사!

+0

브라우저에서 올바르게 작동합니까? 본문이 브라우저 뷰포트의 높이가 100 %가 아닌 경우 이미지의 높이를 100 %로 조절할 수 없습니다. 빠른 수정은 보통 body와 html의 100 % hight를 설정합니다. 설명은 – ilwcss

답변

1

이미지 처리는 "재생"상태가 아니라는 의미에서 비디오 및 오디오와 다릅니다. 이미지는 HTML 이미지 태그로 처리되기 때문에 관련 이벤트가 없습니다 (동영상/오디오의 경우 Media 요소는 Cast SDK가 탭하는 여러 이벤트를 생성합니다). 따라서 수신자 측에서 이미지의 상태를 설정하지 마십시오. 가장 기본적인 방법으로 이미지를 처리하는 기본/스타일 수신기를 사용할 수 있습니다. 맞춤 수신기를 작성하려면 사용자 정의 네임 스페이스를 사용하여 수신자와 수신자에게 이미지 URL을 보내고 URL을 잡고 이미지 태그를 채 웁니다. 다른 유형의 미디어 주위에있는 수신기 SDK의 다른 측면을 고민 할 필요가 없습니다. 마지막으로 슬라이드 쇼 기능, 멋진 전환 등을 추가하려는 경우 이미지로는 많은 것을 할 수 없습니다. 이미지를 하나씩 표시하고 하나를 페이드 아웃하고 다음 페이드로 페이드 아웃하여 더 즐거운 전환을 만들 수 있습니다.

+0

thnx입니다. 문제는 HTML 레이아웃에서 발생했습니다. 이 경우 이미지 태그를 플레이어 아래에 배치해야하며 위치는 '절대'로 설정해야합니다. – MSerg

관련 문제