본문 바로가기
www/Mobile 접근성

모바일, 해상도, 안드로이드 디바이스, 모바일웹 코딩

by 랭님 2014. 3. 12.

출처 :http://kes3583.blog.me/90149111151

 

모바일, 해상도, 안드로이드 디바이스, 모바일웹 코딩  모바일 

2012/08/06 14:34

복사 http://kes3583.blog.me/90149111151

모바일 웹 코딩시

아래와 같은 기기에 대응하기로 함.

충분한 사전지식이 필요할거 같아

3일에 걸쳐서 지인, 구글 검색, 등을 함...

결론은..픽셀보다는 퍼센트의 의존도로 가려고 함.


 

 

 

 

 갤럭시 s, s2

 480*800

 240

 320*533

 갤럭시S2 WVGA854 

 480*854

 240

 320*569

 갤럭시 s3

 720*1280

 320

 360*640

 갤럭시 tab 7인치

 600*1024

 160

 600*1024

 Galaxy Tab 7.7

 800*1280 

 160

 800*1280

 Galaxy Note

 800×1280

 320

 400*640

 

 

 

 

 3gs

 320*480

 

 

 4S 

 640* 960

 

 

 ipad

 1024*768

 

 


http://en.wikipedia.org/wiki/List_of_displays_by_pixel_density

  

안드로이드 디바이스의 경우 크게 3가지의 해상도 범주를 가지고 있는데,

LDPI(저해상도), MDPI(중해상도), HDPI(고해상도)입니다.

Density값은 LDPI가 120, MDPI가 160, HDPI가 240입니다. (각각 인치당 픽셀수를 이야기합니다.)
아래 표 (Table.1)를 참고하시면 결국 현재 디자인 하신 그림 파일의 기준은 HDPI를 기준으로 되어있는 것이고,
LDPI를 위해서는 당연히 120/240 = 1/2, 
MDPI를 위해서는 당연히 160/240 = 3/4로 길이당 픽셀수가 감소하는 셈입니다.

모든 해상도를 지원하시려면 하나의 그림 파일을 HDPI, MDPI, LDPI에 맞춰서 3개로 만들어서 개발자에게 넘기시면 됩니다.

Table 1. Screen sizes and densities of emulator skins included in the Android SDK.


<nobr style="margin: 0px; padding: 0px; ">Low density (120), ldpi</nobr><nobr style="margin: 0px; padding: 0px; ">Medium density (160), mdpi</nobr><nobr style="margin: 0px; padding: 0px; ">High density (240), hdpi</nobr><nobr style="margin: 0px; padding: 0px; "></nobr>
Small screenQVGA (240x320)

Normal screenWQVGA400 (240x400)
WQVGA432 (240x432)
HVGA (320x480)WVGA800 (480x800)
WVGA854 (480x854)
Large screen
WVGA800* (480x800)
WVGA854* (480x854)

* To emulate this configuration, specify a custom density of 160 when creating an AVD that uses a WVGA800 or WVGA854 skin.

레이아웃용 xml 파일에 기술되어야 할 dip값은 다음과 같이 계산해서 넣으시면 됩니다.

dip = px * (160/density)

density값은 HDPI, MDPI, LDPI의 값들입니다. 
결국 MDPI일때는 dip값은 px값과 같다는 것이지요.


http://www.androidpub.com/1895935


안드로이드 해상도 


http://www.androidpub.com/1895935


http://blog.naver.com/PostView.nhn?blogId=3ojhcms3&logNo=140160471228&parentCategoryNo=&categoryNo=&viewDate=&isShowPopularPosts=false&from=postView


http://blog.naver.com/PostView.nhn?blogId=cheonsu0&logNo=70100898919

이미지 해상도 결정


http://hslifestory.tistory.com/734

해상도 계산


http://valken.net/316


http://blog.naver.com/handyson/120391295


Samsung


ModelDiagonal cm (in)Resolutionppcm (PPI)Aspect ratioCSS pixel ratio
SWD-M10011 (4.3)480×80085 (217)*3:5
Epic (D700)10 (4)480×80092 (233)*3:5
Focus S11 (4.3)480×80092 (233)3:5
Jet (S8000)7.9 (3.1)480×800120 (300)**3:5
Wave (S8500)8.4 (3.3)480×800111 (282)**3:5
Nexus S SAMOLED10 (4.0)480×80093 (235)*3:51.5
Nexus S LCD10 (4.0)480×80093 (235)3:51.5
Galaxy W (I8150)9.4 (3.7)480×80099 (252)3:5
Galaxy S (I9000)10 (4.0)480×80092 (233)**3:5
Galaxy S Plus (I9001)10 (4.0)480x80092 (233)*3:51.5
Galaxy SII (I9100)10.8 (4.27)480×80086 (219)3:51.5 (undefined)
Galaxy SIII12 (4.8)720×1280120 (306)**9:16
Galaxy Nexus11.8 (4.65)720×1280124 (316)**9:162
Galaxy Tab18 (7)600×102467 (171)*75:128 (18.75:32, 9.375:16, 9:15.36, 3:5.12)1, 1.5 for older versions
Galaxy Tab 7.720 (7.7)800×128077 (196)5:8
Galaxy Tab 10.126 (10.1)800×128059 (149)5:8
Galaxy Note13 (5.3)800×1280112 (285)**5:8 (10:16)
Galaxy Ace8.9 (3.5)320×48065 (164)2:31
Galaxy Gio (GT-S5660)8.1 (3.2)320×48071 (180)2:3
Galaxy Y (S5360)7.6 (3.0)240×32052 (133)2:30.75 (1 in Opera browser)




미디어쿼리는 배경이미지에만 사용할수 있습니다..
미디어쿼리의 조건절에서 iphone4 일경우 (pixel-ratio로 분기처리) background-size 속성으로 사이즈를 지정해 줍니다. (가변사이즈 대응 안됨)

img 태그는 디멘션을 주고 스크립트로 디바이스 분기를 타서 src의 이미지 주소를 변경해 주어야 합니다.

아이폰4의 화면 해상도는 640이 맞지만, 픽셀값은 아이폰3gs와 동일한 320입니다. (pixel-ratio가 그래서 2죠)


http://mydeute.com/txp/article/631


모바일 터치이벤트

http://webstorykim.tistory.com/169


dp를 평소에 즐겨사용했지만, 확실히 무슨 개념인지를 몰라 조사하던중에 

잘 정리되어있는 블로그를 발견 !


수정(101130)

단순히 px을 dp로 변환하고자 한다면 dp = px * 0.66625로 계산한다.(해상도480*800 기준)

480*800 px => 320*533 dp이다.




출처 : http://blog.naver.com/dythmall?Redirect=Log&logNo=30096162077


dp (dip, density independent pixel) 은 안드로이드에서 여러 화면 크기를 서포트 해주기 위해서 만든 유닛이다.

만약 많은 화면에서 내가 만든 레이아웃이 제대로 보이길 원한다면 dp를 써서 화면을 만드는 것이 좋다.

우선 주의할 것은 안드로이드는 160dpi를 기본으로 생각한다.
이것은 (320 x 480) 스크린의 density를 나다내는 것이다.

그러므로 480 x 800  (240dpi)의 스크린을 dp로 나타낸다면 320 x 533 (480 / 1.5, 800 / 1.5) 이 된다.
dp를 이용해서 레이아웃을 잡을때 이 수치를 꼭 기억하고 잡자!
dp로 레이아웃을 잡을때 버튼을 4개 만들고 LinearLayout (horizontal)에 넣은뒤 
width를 80dp (80*4 = 320)로 잡으면 4개가 같은 넓이의 버튼이 된다.
하지만 480을 생각하고 120dp 라고 넓이를 잡으면 오른쪽 1개 버튼은 화면을 지나서 보이는걸 볼것 이다.

그렇다면 코드상에서 dp를 pixel로 바꾸려면 어떻게 해야할까?
식은 pixel = dp * (density / 160)

dp는 원하는 값이고 density 는 
DisplayMetrics outMetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(outMetrics);
outMetrics.densityDpi 
로 가지고 올 수 있다.

여기서 outMetrics.density 라는 변수가 있는데 이것은 (density / 160) 의 결과 값이 들어 있다.
그러므로 식은 
pixel = dp * outMetrics.density 
가 된다.

여기서 코드상에 dp를 pixel로 변한하는 식이 필요한 이유는,
안드로이드 레이아웃을 코드상에서 고치면 dp를 쓸 수 없기 때문이다.
모든 setWidth나 setHeight 등등은 인자를 pixel로 받는다.

 320×480
갤럭시 s 480×800 , 240 DPI
갤럭시 s2 480×800 , 240dpi
갤럭시 s3 720×1280, 320 DPI
Galaxy Nexus  720×1280
Galaxy Tab 600×1024
Galaxy Tab 7.7 800×1280
갤럭시 노트 800×1280



픽셀변홖공식pixels = dips * (density / 160)

160 DPI<200 DPI
240 DPI>=200 DPI and <280 DPI
320 DPI>=280 DPI



[갤럭시 넥서스] 

- RESOLUTION : 720px(360dp), 1280px(640dp)

- DENSITY: 2.0


[hTC evo 4g] 

- RESOLUTION : 540px(360dp), 960px(640dp)

- DENSITY: 1.5