모바일 텍스트(Input) 입력시 확대/리사이징 문제
페이지 정보
작성자
오원장
쪽지보내기
메일보내기
자기소개
아이디로 검색
전체게시물
댓글 1건
조회 2,260회
작성일 15-04-20 04:54
본문
WebView에서 ViewPort Metatag를 가지고 있어도. Form이나 기타 TextField(input)을 입력할때 확대가 되는 버그가 발생하는데.
이때 viewport meta tag의 값을 아래와 같이 설정해 주면 TextField가 Focus되도 확대가 되지 않아 정상적으로(Y스크롤만 진행)됩니다.
width=device-width, initial-scale=1.0, user-scalable=no, height=device-height, maximum-scale=1.0, target-densityDpi=device-dpi
참고로 필자는 아래와 같은 WebView 세팅을 설정하였습니다.
set.setJavaScriptEnabled(true);
set.setJavaScriptCanOpenWindowsAutomatically(true);
set.setBuiltInZoomControls(false);
set.setSupportMultipleWindows(false);
set.setSupportZoom(false);
set.setBlockNetworkImage(false);
set.setLoadsImagesAutomatically(true);
set.setAllowContentAccess(true);
set.setUseWideViewPort(false);
set.setLoadWithOverviewMode(false);
set.setDomStorageEnabled(true);
set.setAppCacheEnabled(true);
위에서 굳이 필요한거만 꼽자면, setLoadWithOverviewMode, setUseWideViewPort,setSupportZoom,setBuiltInZoomControls 정도가 되겠습니다.
해당 이슈가 발생하는 이유는 WebView에서 TextField가 포커스를 잡히게되면 Soft Keyboard가 활성화되어 WebView가 Resize되기 때문입니다. 하나의 다른 해결방법으로 Manifest에 android:windowSoftInputMode="adjustPan"를 설정하면 되는데, 필자의 경우에는 Fixed 레이아웃안에 TextField가 포함되어있기 때문에, WebView가 리사이징되지 않으면 Soft Keyboard가 WebView를 가려 더욱 큰 문제가 발생하기 때문에 위와같은 Meta tag를 수정하는 방법을 사용하였습니다.
댓글목록
오원장님의 댓글
오원장
쪽지보내기
메일보내기
자기소개
아이디로 검색
전체게시물
작성일
웹뷰에 다음 속성 사용해보시죠. 두 속성 모두 디폴트가 false이니까 작성하신 웹뷰 셋팅 코드에서 지우시기만 하면 되겠네요
settings.setUseWideViewPort(false);
settings.setLoadWithOverviewMode(false);
인풋이 선택되었을때, 와드이드 뷰포트를 사용하고 있으면 줌이 발생되더라구요.
위의 코드는 와이드 뷰포트를 사용하지 않는다는 것이구요.