마스터Q&A 안드로이드는 안드로이드 개발자들의 질문과 답변을 위한 지식 커뮤니티 사이트입니다. 안드로이드펍에서 운영하고 있습니다. [사용법, 운영진]

웹뷰 레이아웃이 서로 상이합니다.

0 추천

안녕하세요.

특정 php 페이지를 웹뷰로 띄워서 보여주려고 합니다.

현재 갤3(4.4) , 갤노트3(5.0) 두 기종, g3(6.0)으로 테스트 하고있는데, 

원인 모를 현상을 겪고 있습니다..

php페이지는 제가 구현한 것이 아니지만, 소스를 확인해보니 

html로 레이아웃이 구성되어있습니다. 

ex) 검색버튼.

<div class="container">

..생략

<input type="text" name="searchText" class="form-control" placeholder="검색">

저렇게 4개의 기종으로 테스트를 하고있습니다.

웹뷰 load역시 예제를 토대로 만들었구요.

문제는 노트3(5.0)기기가 A,B 두개인데, A의 레이아웃이 이상하게 나옵니다.

마치 레이아웃이 다 깨진 것 처럼 나오더군요.B도 동일한 기종,버전도 같은데 괜찮구요.

A를 제외한 나머지 기기는 정상적으로 출력됩니다.

webSetting.setJavaScriptEnabled(true); 를 줘도 깨지구요..

A기기에서 인터넷브라우저를 통해 해당 php주소로 접속하니 이땐 정상적으로 출력됩니다.

전에 듣기론 웹뷰브라우저와 앱브라우저는 다른거라 그렇다고는 하는데..

왜 A만 깨져나오는지 모르겠습니다.

여기서 레이아웃이 손상되었다는건..구성되어잇는 텍스트나 버튼,동작들도 다 양호한데..

1.버튼이미지가 안나오고 회색의 작은 버튼으로만 나옵니다.

2.체크박스/텍스트 이렇게 정렬되어있는데 체크박스 아래로 텍스트가 있는 둥 레이아웃이 뒤죽박죽.

구글링해도 딱히 해답을 찾지 못했는데..이런 경우엔 코드로 어떻게 처리할 수 없을까요.

 

 

 

흠냐 님이 2017년 9월 22일 질문

1개의 답변

0 추천

이해할 수 없는 결과군요. Webkit 버전이 다른 것인지 아니면 실제 OS 버전이 미묘하게 다른지 체크해봐야 할 듯 싶네요. 이것마저 같다면, 테스트 디바이스를 교체해야 할 것 같은데요...

PHP 서버 쪽에서 접속한 디바이스의 UserAgent를 출력하면 WebView에서 사용하는 브라우저의 버전을 확인할 수 있을 겁니다.

예시:

Mozilla/5.0 (Linux; U; Android 4.1.1; en-gb; Build/KLP) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Safari/534.30
Mozilla/5.0 (Linux; Android 4.4; Nexus 5 Build/_BuildID_) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/30.0.0.0 Mobile Safari/537.36

 

참고 자료: https://developer.chrome.com/multidevice/user-agent

Will Kim (43,170 포인트) 님이 2017년 9월 22일 답변
답변감사합니다.
레이아웃 현상으론 이 질문글과 유사합니다.
https://stackoverflow.com/questions/29588314/why-lines-of-rtl-language-are-broken-in-android-webview-but-not-in-browsers
저 질문글처럼 웹뷰에선 글씨가 밀려나와버리고,
브라우저에서는 정상적으로 출력됩니다.저 글도 답변은 없네요.
+
알려주신대로 userAgent로 출력한 결과인데..뭔가 값이 다르긴합니다만,
어느선에서 문제인지 모르겠습니다.ㅠ

문제된기기A:
Mozilla/5.0 (Linux; Android 5.0; SM-N900L Build/LRX21V; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/54.0.2840.85 Mobile Safari/537.36

A와 동일한 제품,os인 B:
Mozilla/5.0 (Linux; Android 5.0; SM-N900S Build/LRX21V; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/43.0.2357.121 Mobile Safari/537.36
...