코드 바 ios 응용 프로그램에서 지연되는 외국 문자 표시

Google 글꼴을로드하는 데 Webfont Loader을 사용하고 있습니다. 그리고 WebFont.load의 활성 콜백 내에서 main 스크립트와 bootstrap angular.js 응용 프로그램을로드합니다. 구글 글꼴 파일이로드 될 때까지 코드 바 ios 응용 프로그램에서 지연되는 외국 문자 표시

<script type="text/javascript"> 
WebFontConfig = { 
    google: { 
     families: ['Open Sans:400,700,700i,400i:latin-ext'] 
    }, 
    active: function() { 
     var mainScript = document.createElement('script'); 
     mainScript.src = "/js/main.js"; 
     mainScript.onload = function() { 
      angular.bootstrap(document, ['cob']); 
     } 

     document.body.appendChild(mainScript); 
    } 
}; 

WebFont.load(WebFontConfig); 
</script>

브라우저 사용 기본 글꼴을 만들기 위해, 우리는 각 실행 내부 .wf 활성 클래스

html.wf-active { 
    font-family: 'Open Sans', sans-serif; 
}

에 대한 글꼴을 설정, 우리는 로더와 쇼에서 apploaded 선명한 화면을 전환 응용 프로그램.

angular.module('mymodule') 
    .run([function() { 
     $rootScope.appLoaded = true; 
    } 
]);

HTML

우리는 성공적으로 다음 응용 프로그램의 부트 스트랩,로드 글꼴 파일까지 "로드 ..."를 참조

<body> 
    <div class="app-loader" ng-hide="appLoaded">loading...</div> 
    <div class="page-container" ng-if="appLoaded"> 
     application loaded. <button>GİRİŞ</button> 
    </div> 
</body>

. 그러나 버튼 텍스트는 몇 초 동안 "G R"로 렌더링되며 잠시 후 'İ'와 'Ş'문자가 화면에로드되고 버튼에 GİRİŞ가 표시됩니다.

나는 응용 프로그램이로드 된 후 글꼴이 변경되지 않기 때문에 글꼴 파일, 응용 프로그램의 부트 스트랩 전에로드 확신합니다.

5 월과 관련이 없지만 페이지에서 일부 이미지 파일을 가져오고 외부 문자가 이미지 파일로 렌더링됩니다. 따라서 어떤 종류의 화면 렌더링 대기 시간이 있습니다.

iOS 응용 프로그램에만이 문제가 있습니다. iPhone 6 및 6s 및 xcode 시뮬레이터에서 테스트했습니다. 브라우저 (사파리, 크롬 및 파이어 폭스)와 동일한 코드바 프로젝트로 만든 안드로이드 응용 프로그램에서 의도 한대로 작동합니다.

출처

2017-11-16 Azadrum

나는 그것을 포기 고려 된 것처럼, 다양한 프리로드 방법을 시도 후, 나는 그들이 오히려 보다 페이지에서 사용 할 때 here

대부분의 브라우저 글꼴을 다운로드 사실에 건너왔다 때 CSS에서 선언했습니다.

글꼴의 latin-ext 하위 집합이 페이지 내부에서 사용될 때까지 지연되는 것 같습니다.

로드 화면에 latin-ext 하위 집합을 다운로드하는 더미 문자 (İ)를 넣음으로써이 문제를 해결했습니다.

출처

2017-11-17 07:17:29 Azadrum

코드 바 ios 응용 프로그램에서 지연되는 외국 문자 표시

답변

관련 문제