'비율'에 해당되는 글 2건

  1. 2010.08.17 [Android] 안드로이드폰 기기별 DB (첨부 Exel File) (19)
  2. 2010.07.27 [Android] layout 비율 (3)
posted by By훈트 2010.08.17 13:42
[훈트 2010-08-17 화요일]

구글의 안드로이드OS를 탑제한 스마트폰인 안드로이드폰.
경쟁사인 애플의 아이폰과 상반되는 여러가지 특징 중 다음 특징에 대해 이야기하고자 한다.
  • 다양한 회사제품
  • 다양한 디자인 및 해상도
스터디 위주로 안드로이드 프로젝트를 하던중 치과 솔루션 업체에 취업을 하게 되었다. 
이번에 취업된 회사에서 C#기반으로 제작된 치과솔루션 프로그램을 안드로이드폰과 곧 추가될 안드로이드 OS를 탑제한 타블렛을 겨냥해 안드로이드 버젼으로 개발하는 프로젝트를 진행하게 되었다.
테스트 데모버젼을 만들기위해 그동안 스터디 위주의 학습에선 간과했던 안드로이드폰의 다양한 해상도에 고민을 하게됬다.

현재 국내에 출시되어 있는 핸드폰 기기와 출시예정인 폰중 인기 폰들만 해도 10여종에 이른다. 최고의 인기를 얻고있는 
  • 삼성 - 갤럭시A, 갤럭시S
  • 팬텍 - 시리우스, 이자르, 베가
  • HTC - 디자이어, 넥서스원
  • 모토로라 - 드로이드, 모토글램, 드로이드x

위에 폰 외에도 여러가지 출시및 출시예정된 폰들이 있는데 이들은 각각 지원하는 해상도가 다르다.
WVGA, HVGA, FWVGA 등 지원 해상도에 따라서 가로와 세로의 비율 등이 차이가 나게되어 어플 개발시 UI설계에 고민이된다.

해상도 UI에  대해서 알고 싶다면 안드로이드펍의 운영을 맡고있는 회색님의 글의 첨부 PDF파일을 참고하자.


위의 해상도관련 PDF를 보면 안드로이드의 UI 를 위해 XML코드 작성시 px 단위가 아닌 dip 라는 단위의 사용을 권장하고있다.

예를들어 로고화면을 메인에 ImageView로 넣고싶다고 가정하자. 
일단 테스트로 필자가 가지고있는 WVGA(480x800)해상도를 지원하는 팬텍의 시리우스에 테스트를 목적으로 작성한다고 하자.
가로 480px 세로 800px 이므로 로고의 크기를 가로 360px 세로 300px의 크기로 만들어 화면에 상단에 배치하고 싶다.

위에 링크의 PDF파일을 읽었다면 실제 xml 작성시 이 ImageView에 가로와 세로 속성을 dip단위로 작성해야 하는데..
문제는 여기서 생긴다, 그렇다면 이 px와 dip의 단위는 보통 1:1로 매핑되지 않기때문에 변환 작업을 거쳐야한다. 그렇기 때문에
로고 이미지를 제작할때 이미지의 px 크기에 맞춰 xml에 dip크기를 주기가 쉽지않다. 
물론 HVGA의 경우에는 dpi(dots per inch)의 크기가 기본 px과 1:1로 매핑되는 160dpi 이기 때문에 이미지 px의 크기 그대로 xml의 dip 크기로 작성이 가능하지만,
갤럭시S나 시리우스가 지원하는 WVGA의 경우는 240dpi를 지원하기 때문에 이미지의 px을 그대로 xml의 dip로 가져올수 없다.
쉽게 말해서 360x300의 px단위의 이미지를 xml에 ImageView의 크기를 width: 360dip, height: 300dip 로 가져올수 없다.
dpi를 고려하여 변환을 거쳐 width: 240dip, height: 200dip 으로 설정해야 이미지가 일그러지거나 깨지지 않고 그대로 보여줄수 있게 된다.

이런 작업을 위해서 다양한 해상도의 기기별로 변환식에 px을 대입해 해당 매치되는 dip값을 얻어야 하는데 다양한 해상도 별로 모두 하기에 상당히 번거로운 과정이다. 그래서 점심시간을이용해서 간단하게 엑셀로 안드로이드 폰 DB 라는 이름으로 작성을 해보았다.


엑셀을 처음 사용해보는거라 많이 부족하지만 필요한것 위주로 만들어보았다.
왼쪽 파란색 타이틀은 기본 폰 정보이고 
오른쪽 보라색 타이틀은 xml에서 사용하기위한 변환 수치 정보이다.

입력 dip, 입력 px에 수치를 적으면 결과px, 결과dip에 왼쪽에 기기의 해상도 정보에 맞춰 변환되어 나온다.
기기및 해상도를 추가하고싶다면 한 행의 셀을 복사해서 제일 아래 추가하고
  • 스크린타입
  • 스크린크기(px) - 가로, 세로
  • 스크린 밀도(dpi)
위의 3가지 수치 정보만 바꿔주고 
선택사항으로 기타정보인 제조사,기종,통신사,스크린타입만 바꾸어주면 
원하는 기기를 등록하여 활용할수 있다.

해당 Exel 파일은 따로 이 글에 첨부하였다.


안드로이드 화면사이즈 DB.xlsx 파일은 만약 저장이 알집형태로 저장된다면 뒤에 알집 확장자를 지우면된다.
안드로이드 화면사이즈 DB.xlsx.zip 으로 저장된다면 이름바꾸기에서 .zip을 지운후 열면된다


Ps. 엑셀파일 작성이 처음이라 작성및 데이터입력까지 1시간넘게걸렸다. 거기에 글쓰는데 점심시간 30분..
힘내라고 코맨트 달아주면 앞으로 힘내서 더 좋은정보 공유하겠습니다 ㅋ



신고
크리에이티브 커먼즈 라이선스
Creative Commons License
posted by By훈트 2010.07.27 14:42
계속 속썩여온 비율 문제...
아이폰은 가로 세로 사이즈라도 고정되어 있지만..
안드롱은 지 맘대로니..어떻게 해서든 비율 문제를 풀어야 했다.
계속 끙끙거리다 드디어 정리됨 -_-;;

리스트의 한 로우는 2줄로 구성되어 있다.
첫번째 줄은 3칸, 두번째 줄은 1칸이고 첫번째 줄으니 비율은 1:1:2 이다.
이 에 대한 코드는 다음과 같다.

 
 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical">
    
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">
        
        <TextView android:id="@+id/wordlist_row_level"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#66CCFF"
            android:textSize="20px"            
            android:gravity="center"/>
    
        <TextView android:id="@+id/wordlist_row_word"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="#FF9900"
            android:textSize="20px"/>
            
        <TextView android:id="@+id/wordlist_row_date"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="2"
            android:background="#FFCCFF"
            android:textSize="20px"
            android:gravity="center"/>            
    </LinearLayout>
        
    <TextView android:id="@+id/wordlist_row_meaning"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#00FF00"
        android:textSize="20px"
        android:gravity="center"/>        
</LinearLayout>

android:layout_width를 fill_parent나 wrap_content로 주면 안된다.
반드시 "0dp" 로 정해주자.
그리고 비율은 android:layout_weight 로 정해주면 된다.

[출처] [Android] layout 비율|작성자 로사


신고
크리에이티브 커먼즈 라이선스
Creative Commons License

티스토리 툴바