삼성 TV 용 스플래시 화면을 만드는 방법

0

간단하다고 생각합니다. index.html 스플래시 화면으로 일부 div 추가 (스타일 포함).

백그라운드 다운로드 데이터. 데이터로드 후 기본 앱 화면을 표시합니다.

2014-07-21 15:03:56 alfredo86

0

매우 쉽습니다.

당신은 당신의 index.htm으로의 div 태그를 넣어해야합니다 jQuery를을 사용하여 Main.js에

#spalshscreen{ 
height: 720px; // Full height of the TV screen 
width: 1280px; // Full width of the TV screen 
background-image: url(...); 
}

그리고보다 :

가있는 style.css에서

<div id="splashscreen"></div>

같이 몇 가지 속성을 추가 지정된 시간 동안 div에 show() 및 hide() 함수를 호출 할 수 있습니다. setTimeout ("javascript function", milliseconds);

예컨대

function splashHide() { $('splashscreen').hide(); $('container').show(); } 

window.onLoad(){ 
$('splashscrean').show(); 
$('container').hide(); // Container holds all other div-s in the app 
setTimeout(splashHide(), 3000); // This will call splachHide() after 3 seconds. 
// After 3 seconds splashscreen div will not be visible, while container div will be 
}

이이 일의 한 가지 방법입니다. 예를 들어 두 개의 html 파일을 사용하여 다른 파일을 생각할 수 있습니다.

출처

2014-08-24 19:24:00 anchor

0

모든 응용 프로그램은 시작하기 전에 일부 데이터를 검색 /로드합니다. 그것이 우리가 스플래시 스크린을 사용하는 이유입니다 (개발자 관점에서).

하지만 슬프게도 삼성 앱에서는 스플래시 화면을 수정할 수 없습니다. 그것은 검은 배경 가진 자체 스플래시 화면이 있습니다. 사용자가 앱의 로고와 이름 만 수정할 수 있습니다.

하지만이 문제를 해결할 수있는 방법이 있습니다. 로더, 우리가 선호하는 배경 및 텍스트 (스플래시 화면처럼 보이지 않게)에 가짜 div를 표시 할 수 있습니다. 그리고 좋은 점은 우리가 처음에 우리의 애플 리케이션에 필요한 모든 데이터를 검색하고 사전로드 한 다음 우리의 메인 화면을 표시 할 수 있다는 것입니다.

이에 의해 위의 작업을 achive 수 있습니다

HTML :

<!-- Splash Screen --> 
<div id="divSplash" class="splash hide"> 
    <div class="header"> 
     <img src="app/images/splashlogo.png" style="height: 110px;" /> 
    </div> 
    <div class="bodyText"> 
     <div>Please wait, starting up...</div> 
     <p id="splMessage"></p> 
     <div class="ajax-spinner-bars"> 
     </div> 
    </div> 
    <div class="footer"> 
     <div> 
      <label class="appName"></label> 
     </div> 
     <div style="font-size: 26px;"> 
      <label class="DBVersion"></label><label class="playerName dotdot"></label> 
     </div> 
    </div> 
</div>

CSS :

.splash { 
position: fixed; 
top: 0px; 
background-image: url('../images/backdrop.png'); 
background-size: 100% 100%; 
width: 100%; 
height: 100%; 
z-index: 1000;

}

JS :
jQuery를 약속 여기 비동기/모든 작업 동기화를 수행 한 후 시작 화면을 숨 깁니다.

jQuery.when(Main.getDeviceInfo()).then(function(status) { 
     jQuery("#divSplash").hide(); 
     Main.start(); 
    }, function(status) { 
     // Some error perform necessary steps. 
    });

는 일부 확장에 당신을 도울 것입니다 바랍니다.

출처

2014-09-27 09:51:05

삼성 TV 용 스플래시 화면을 만드는 방법

답변

관련 문제