홈으로 홈으로 | 무료회원가입 | 아이디/비번찾기 | 즐겨찾기
추천음악방송메인홈1대1상담음악방송청취
뽕짝아가씨(무료음악채널)
okTrot(무료음악채널)
전통가요(무료음악채널)

온라이브스토어(앱다운로드)
온라이브(방송등록및청취)

환상의뽕짝파티 무료음악
명작트로트메들리 무료음악
트로트메들리관광 무료음악
동영상노래방
가사검색

POP Player
신나는 고스톱
컴퓨터 오목
작은 음악다방
자동러시 웹플레이어신청

보안∵서버∵쿠키
윈도우∵프레임
이미지∵배경
시간∵달력∵계산
상태바∵타이틀바
음악∵영상
폼∵전송∵테이블
키보드∵마우스
효과∵링크∵메뉴
Script∵php
기타
PHP 강좌
윈도우관련팁
웹관련팁
홈페이지제작팁
기본강좌
레지스트리
윈도우서버
리눅스서버
Android
Webviw [Android]
2년 전
안드로이드  4.4에서  사용하는  WebView는  Chromium  기반으로  변경됨에  따라  안드로이드  크롬  브라우저와  동일한  수준의  성능과  호완성을  갖추고  최신  HTML5,  CSS3  표준  기술들을  지원하며  V8  자바스크립트  엔진이  탑재된  최신버전으로  적용되었습니다.
이제부터  본격적으로  설명할  것들은  매니페스트에  targetSdkVersion을  19이상으로  설정할  경우  알아야  할  WebView  변경사항들에  대한  설명입니다.
targetSdkVersion이  18또는  이보다  낮은  경우  웹뷰는  quirks  mode라는  호환  모드로  동작하도록  구현되어  있습니다.  그러나  4.4의  호환모드에서도  single  and  narrow  column  layouts  및  default  zoom  levels은  지원하지  않으며  이외에도  아직  알려지지  않은  문제가  발행할  수  있으니  안드로이드  4.4  이상에서  꼭  테스트해야합니다.

4.4  웹뷰  최적화  작업중  일어난  이슈에  대해  도움을  주기  위해setWebContentsDebuggingEnabled()을  이용한  데스크롭  크롬을  통한  원격  디버깅이  가능해졌습나다.  이  기능을  통해  WebView를  실행하는  동안  웹  컨텐츠,  스크립트  및  네트워크  활동을  검사하고  분석  할  수  있습니다.  자세한  내용은  Debugging  on  Android을  참조하세요.
User  Agent  Changes
유저  에이전트를  통해  웹뷰에  맞춤형  컨텐츠를  제공하는  경우가  있을  것입니다.  4.4에서는  기존  유저  에이전트  형태와는  달리  크롬  버전을  포함하게  되었습니다.
Mozilla/5.0  (Linux;  Android  4.4;  Nexus  4  Build/KRT16H)  AppleWebKit/537.36
(KHTML,  like  Gecko)  Version/4.0  Chrome/30.0.0.0  Mobile  Safari/537.36
만약  유저  에이전트를  보기만  하고  저장하고  싶지  않다면  스태틱  메서드인getDefaultUserAgent()을  사용하면  됩니다.
public  static  String  getDefaultUserAgent  (Context  context)
Added  in  API  level  17
Returns  the  default  User-Agent  used  by  a  WebView.  An  instance  of  WebView  could  use  a  different  User-Agent  if  a  call  is  made  to  setUserAgentString(String).
그러나  대신  웹뷰객체  생성  후  setUserAgentString()을  이용한  커스텀  에이전트  적용시에는  getUserAgentString()을  사용해야합니다.
public  synchronized  String  getUserAgentString  ()
Added  in  API  level  3
Gets  the  WebView’s  user-agent  string.
Returns
the  WebView’s  user-agent  string
Multi-threading  and  Thread  Blocking
UI  쓰레드가  아닌  별도의  쓰레드에서  WebView를  호출한다면  예측하지  못한  결과가  생길  수도  있습니다.  예를  들어서  앱에서  멀티  쓰레드를  사용할  경우  웹뷰를  UI에서  사용하기  위해  아래와  같이  runOnUiThread()를  통해  호출되어야  합니다.
runOnUiThread(new  Runnable()  {
  @Override
  public  void  run()  {
  //  Code  for  WebView  goes  here
  }
});
또한  UI  쓰레드를  차단하면  자바스크립트와의  연동에  문제가  생길  수  있습니다.  예를들어  아래  코드처럼  사용하면  안됩니다.
//  This  code  is  BAD  and  will  block  the  UI  thread
webView.loadUrl(“javascript:fn()”);
while(result  ==  null)  {
  Thread.sleep(100);
}  
그  대신  비동기로  자바  스크립트를  실행할  수  있게  해주는evaluateJavascript()를  사용  할  수  있습니다.
public  void  evaluateJavascript  (String  script,  ValueCallback<String>  resultCallback)
Added  in  API  level  19
Asynchronously  evaluates  JavaScript  in  the  context  of  the  currently  displayed  page.  If  non-null,  |resultCallback|  will  be  invoked  with  any  result  returned  from  that  execution.  This  method  must  be  called  on  the  UI  thread  and  the  callback  will  be  made  on  the  UI  thread.
Parametersscriptthe  JavaScript  to  execute.resultCallbackA  callback  to  be  invoked  when  the  script  execution  completes  with  the  result  of  the  execution  (if  any).  May  be  null  if  no  notificaion  of  the  result  is  required.
Custom  URL  Handling
이제  웹뷰를  사용할  때  오직  유효한  URL에  대해서만shouldOverrideUrlLoading()  또는  shouldInterceptRequest()가  호출  되어집니다.
4.4  에서  커스텀  URL  스킴  또는  base  URL을  사용하여  리소스들을  불러올때  실패하거나  잘  작동하지  않는다면  RFC  3986을  준수하는  유효한  URL을  지정했는지를  확인하세요.
예를  들어서  새로운  웹뷰에서는  아래와  같은  링크에  대해서는shouldOverrideUrlLoading()는  호출되지  않을  것입니다.
<a  href=”showProfile”>Show  Profile</a>
아래의  경우  유저가  링크를  클릭할때  상황에  따라  결과는  달라질  수  있습니다  :
만약  URL을  null이나  형식에  맞지않는  값으로  loadData()나loadDataWithBaseURL()을  호출할  경우  shouldOverrideUrlLoading()가  호출되지  않습니다.
loadUrl()이나  loadDataWithBaseURL()을  통해  유효한  URL을  호출하는  경우에는  shouldOverrideUrlLoading()가  호출됩니다.  그러나  이  경우에는  실제  URL주소를  전달  받습니다.  즉,  showProfile  대신에http://www.example.com/showProfile을  전달  받을  것입니다.
위와  같이  사용하려면  이제는  아래와  같이  스킴을  이용하면  됩니다.
<a  href=”example-app:showProfile”>Show  Profile</a>
이를  통해  shouldOverrideUrlLoading()이  호출되면  아래  함수와  같이  URL을  사용하면  됩니다.
private  static  final  String  APP_SCHEME  =  “example-app:”;

@Override
public  boolean  shouldOverrideUrlLoading(WebView  view,  String  url)  {
  if  (url.startsWith(APP_SCHEME))  {
  urlData  =  URLDecoder.decode(url.substring(APP_SCHEME.length()),  “UTF-8");
  respondToData(urlData);
  return  true;
  }
  return  false;
}
HTML을  변경할  수  없는  경우에는  loadDataWithBaseURL  ()을  통해  이런식의 — “example-app://<valid_host_name>/”-  커스텀  스킴으로  구성된  기본  URL과  유효한  호스트를  설정할  수  있습니다.  예를  들면  아래와  같습니다.
webView.loadDataWithBaseURL(“example-app://example.co.uk/”,  HTML_DATA,  null,  “UTF-8",  null);
유효한  호스트  이름은  RFC  3986을  준수해야하며  끝에  슬래시를  포함하는  것이  중요합니다,  그렇지  않으면  로드  된  페이지에서  모든  요청은  드롭될  수  있습니다.
Viewport  Changes
뷰  포트란  멀티  디바이스들의  해상도에  대응하기  위해  사용되는  태그를  말합니다.
target-densitydpi를  더  이상  지원하지  않습니다.
target-densitydpi의  경우  아이폰에서는  지원하지  않으므로  공통으로  처리할  수  있는  기준을  지원하기  위해  지원하지  않도록  하는것  같습니다.
이전버전의  경우  웹뷰에서  웹페이지의  스크린  density를  지정하는데  사용하는  target-densitydpi이라는  뷰포트  속성이  있었습니다.
<meta  name=”viewport”  content=”target-densityDpi=device-dpi”>
이  속성은  더  이상  지원되지  않으며  이미지나  CSS에  대해  Pixel-Perfect  UI  in  the  WebView에서  볼  수  있는  표준방법으로  마이그레이션  해야할  것입니다.
Viewport  zooms  in  when  small
이전에  뷰포트의  넓이가  320이거나  그보다  작았다면  넓이  값은  device-width로,  높이가  웹뷰의  높이보다  작거나  같을경우는  device-height로  설정되었을  것입니다.  그러나  새로운  웹뷰에서는  넓이  또는  높이  값이  값이  준수되며  스크린의  넓이에  맞게  웹뷰가  줌  될  것입니다.
<meta  name=”viewport”  content=”width=device-width,  height=device-height”>
Multiple  viewport  tags  not  supported
4.4  이전버전에서는  여러개의  뷰포트  메타태그를  선언하면,  자동으로  그것들이  결합되어  사용되었지만,  이번  버전의  웹뷰에서는  마지막에  선언된  웹뷰만  사용되고  나머지는  무시됩니다.
Default  zoom  is  deprecated
getDefaultZoom()  과  setDefaultZoom()  가  더  이상  지원  되지않습니다.
WebView에서  자동으로  default  zoom을  맞춰주기  때문
이  적용사항은  4.4  및  그  이상의  버전  뿐만아니라  targetSdkVersion을  18이나  그  이하로  설정할  경우에도  동작하지  않습니다.
만약  뷰포트의  넓이를  지정하지  않았다면  아래와  같이  setUseWideViewPort()함수를  통해서  더  큰  뷰포트를  할당  받을  수  있습니다.
public  synchronized  void  setUseWideViewPort  (boolean  use)
Added  in  API  level  1
Sets  whether  the  WebView  should  enable  support  for  the  “viewport”  HTML  meta  tag  or  should  use  a  wide  viewport.  When  the  value  of  the  setting  is  false,  the  layout  width  is  always  set  to  the  width  of  the  WebView  control  in  device-independent  (CSS)  pixels.  When  the  value  is  true  and  the  page  contains  the  viewport  meta  tag,  the  value  of  the  width  specified  in  the  tag  is  used.  If  the  page  does  not  contain  the  tag  or  does  not  provide  a  width,  then  a  wide  viewport  will  be  used.
Parametersusewhether  to  enable  support  for  the  viewport  meta  tag
WebSettings  settings  =  webView.getSettings();
settings.setUseWideViewPort(true);
settings.setLoadWithOverviewMode(true);
Styling  Changes
The  background  CSS  shorthand  overrides  background-size
이번  웹뷰는  배경  스타일을  지정하는  경우  background-size를  위한  CSS  세팅을  재정의합니다.  예를  들어,  아래의  background-size는  기본값으로  변경될  것입니다.
.some-class  {
  background-size:  contain;
  background:  url(‘images/image.png’)  no-repeat;
}

//  두  속성의  간의  위치가  변경되었습니다.
.some-class  {
  background:  url(‘images/image.png’)  no-repeat;
  background-size:  contain;
}
Sizes  are  in  CSS  pixels  instead  of  screen  pixels
이전에는  window.outerWidth  이나  window.outerHeight를  통해  실제  스크린  픽셀  값을  받았지만  새로운  웹뷰의  경우는  CSS픽셀  기반의  값을  받습니다.
스크린사이즈를  구할때  이전  버전에서는  window.outerWIdth  /  outerHeight  를  통해  구할  수  있었지만  4.4에서는<br  />outerWidth/Height가  css  pixel을  나타내게  됩니다.
이렇게  실제  스크린  픽셀  값을  받아  계산하여  사용하는  것은  나쁜  방법입니다.  이제는  계산작업이  필요없이  JavaScript  binding를  이용하여  웹뷰의  실제  픽셀값을  가져올  수  있습니다.
ex)  실제  디바이스  Width  :  480  |  window.outterWidth  :  288
더  자세한  내용은  quirksmode.org을  참조해주세요.
NARROW_COLUMNS  and  SINGLE_COLUMN  no  longer  supported
새로운  웹뷰에서는  WebSettings.LayoutAlgorithm를  위한NARROW_COLUMNS  값을  더이상  지원되지  않습니다.
이  적용사항은  4.4  및  그  이상의  버전  뿐만아니라  targetSdkVersion을  18이나  그  이하로  설정할  경우에도  동작하지  않습니다.
다음과  같은  방법으로  이러한  변화를  처리할  수  있습니다.
스타일을  변경  :
HTML  또는  CSS를  사용하고  있다면  신뢰할  수  있는  방법을  사용해야합니다.  예를  들어  싸이트에서  라이센스를  표현할때는  <pre>안에  텍스트를  넣길  원할  것입니다.  그럴경우  다음과  같이  지정하면  됩니다.
<pre  style=”word-wrap:  break-word;  white-space:  pre-wrap;”>
이것은  페이지에  대한  뷰포트  속성을  정의하지  않은  경우  특히  도움이  됩니다.
새로운  TEXT_AUTOSIZING  layout  algorithm  사용  :
다양한  기기를  지원하기  위해  narrow  columns을  사용하고  있었다면  HTML  컨텐츠에  대해  수정을  할  수  없습니다.  새로운  TEXT_AUTOSIZING  layout  algorithm은  이것에  대한  적절한  대안이  될  수  있습니다.
또한  이번  버전에서는  이전에  deprecated된  SINGLE_COLUMN도  지원하지  않습니다.
웹뷰  자체에서  뷰포트를  관리하게  된  만큼,  이전  버전에서  레이아웃이나  뷰포트에대해  옵션으로  제공하던  method  나  속성들을  모두  제거
Handling  Touch  Events  in  JavaScript
웹  페이지에  직접  WebView  터치  이벤트를  처리하는  경우,  touchcancel  이벤트를  처리하고  있는지  확인하세요.  아래에는  touchcancel를  호출했을때  수신하지  않을  경우  어떤  문제가  발생할  수  있는  시나리오가  있습니다.
화면을  터치하고(touchstart  와  touchmove가  불림)  페이지를  스크롤  했을때  touchcancel가  발생합니다.
화면을  터치했지만(touchstart가  불림)  event.preventDefault()가  안  불린경우(웹뷰에서  터치이벤트를  사용는  것을  원하지  않는다는것을  가정)  이전에  touchcancel  이벤트를  받을  것입니다.
event.preventDefault()란?
//  아래와  같이  작성한  경우  if에  조건에  맞는  키코드의  경우는  이벤트가  발생하지  않도록  하는  역할을  한다.  function  keyeventtest(event){  if(  event.keyCode  ==  ‘’  ){  alert(‘Test’);  event.preventDefault();  }  }
추천추천 : 241 추천 목록
번호 제목
1,317
 프로그램 없이 하드디스크 복사 및 백업하기
1,316
 Windows7 업데이트 기록 삭제방법
1,315
 포토샵 psd 파일 연결 레지스트리(registry) 편집
1,314
 윈도 10 최신 업데이트 후 인터넷 속도의 저하가 발생할 때 조치 사항
1,313
 Autotuning level 해제 (윈도우비스타 이상 윈도우)인터넷 속도 빠르게 하는 방법
1,312
 윈도우에서 특정프로세스를 일괄 종료하는법
1,311
 MediaPlayer 클래스 사용법
1,310
 안드로이드에서 audio player 실행하기
1,309
 [Android] MediaPlayer 음악재생기 만들기
1,308
 Eclipse와 Android NDK 연동하기
1,307
 Android Sliding Drawer Functionality 안드로이드 슬라이딩 드로우 예제 sample
1,306
 Android Speech To Text
1,305
 Android WebPageLoader with progress-bar
1,304
 Android Text To Speech(TTS)
1,303
 Android Playing Audio from a web url
1,302
 Button height different from background height in Android image design
1,301
 Android Getting Started with Material Design
1,300
 Using toast inside timertask perfect
1,299
 네트워크 상태 [Android]
1,298
 Webview source [Android]
1,297
 공유 Intent [Android]
1,296
 intent uri 모음 [Android]
1,295
 http requestWebViewClient [Android]
1,294
 캐시 삭제
1,293
 캐시 지우기 [Android]
1,292
 바로풀어(수학 문제 질의응답 SNS) 에 사용된 오픈소스 라이브러리 [Android]
 Webviw [Android]
1,290
 오픈소스 라이브러리 모음 [Android]
1,289
 Android webview 개발시 알아둬야 할 것들 [Android]
1,288
 webview 동영상 재생 [Android]
1,287
 [Android] Webview 404 에러 처리
1,286
 [Android] webview ssl 문제
1,285
 [Android] Webview url 숨기기
1,284
 [Android] AlarmManager 일정시간 이벤트 실행
1,283
 안드로이드 오픈소스 끝판
목록
인기절정뽕짝파티
트로트재생목록
인기트로트모음
지루박디스코메들리
밤무대애창곡
전자올겐경음악
종합성인가요방
못잊을옛날노래
카바레 음악
트롯디스코팡팡
관광 메들리
트롯카페
가요감상실
추억의옛노래
스페셜가요광장
BillBoard Free
추천가요모음
경음악.전자올겐
스페셜음악여행
WOLRD POPs
K-POP\BillBoard
JP\CN
POP TOP BEST
K.R.노래방

추천가요\인기
F뮤직 인기\발라드
F뮤직 애창\트로트
트로트성인가요
인기가요
프리미엄 POP
경음악\기타
프리미엄 최신가요
프리미엄 성인가요
가요축제\트롯1번지
댄스\메들리\리믹스
카페\명상\경음악\기타
뮤직트로트 부산광역시부산진구 가야동 ㅣ 개인정보취급방침
Copyright (C) musictrot All rights reserved.