[안드로이드] 안드로이드스튜디오(Android Studio) 그리드뷰(GridView), numColumns, getView(), convertView, ImageView, 안드로이드 예제, 안드로이드 강좌
참고 : 이미지서명은 제 와이프 블로그 이미지서명입니다.
안녕하세요 정보처리마법사 입니다.
이번 포스팅의 주제는 그리드뷰(GridView)에 관한 내용입니다.
그리드뷰(GridView)는 격자 모양으로 아이템을 배치할 수 있는 컨테이너입니다. 보통 이미지를 격자모양으로 배치하기 위해서 사용하지만, 텍스트나 버튼 등 여러 뷰들을 배치하는 것도 가능합니다.
레이아웃 XML 디자인모드에서 그리드뷰를 하나 드래그 합니다.
그러고 나서 텍스트모드로 가보면 default 속성만 자동으로 작성이 되어있는걸 보실 수 있습니다.
그리드뷰의 속성중에 가장중요한 속성인 numColumns를 추가해 줍니다. 값으로 5가 돼있는데 의미는 이미지를 한 행에 5개만 배치하라는 의미입니다. android:numColumns="5" 를 추가하여 줍니다. 위 gravity속성은 본인의 기호에 맞게 설정해주시면 됩니다.
그리고 나서 디자인모드로 가보면 일단 화면이 이런식으로 구성됨을 알 수 있습니다.
MainActivity.java 파일로 가보면 일단 기본적으로 이런 소스코드로 이루어져 있습니다. default로 MainActivity가 AppCompatActivity를 상속받고 있는데 저 클래스는 옛날 버전을 지원해주기 위한 클래스입니다. 그냥 저는 간단하게 테스트하기 위해 프로젝트 생성시 minSDK를 높게 잡았기 때문에 굳이 저 클래스가 필요없고 그냥 Activity 클래스를 상속받았습니다.
일단 사진이 몇 장 필요합니다. 가장 쉬운 방법으로 컴퓨터에 있는 사진 몇장을 대충 그냥 드래그해서 Crtl+C 해서
res > drawable 에 우클릭해서 Paste 해서 붙여넣으면 저런식으로 이미지들이 복사가 됩니다.
윈도우 기본 이미지 Desert.jpg 등등을 그냥 가져다 썼더니 not a valid file-based resource name 어쩌구 하면서 대문자로 시작되는 이름을 쓰지말라고 에러를 띄웁니다.
파일명에 우클릭해서 Refactor > Rename 해서 이름을 고쳤습니다.
Desert.jpg 를 desert.jpg 로 나머지 이미지 이름도 이런식으로 다 고쳤습니다.
그런데 DSLR로 찍은 이미지의 용량이 너무 컸던 나머지(6000 x 4000) 메모리 관련 에러가 떠서 이미지들은 수정했습니다. 대충 300 x 200 정도의 png파일로 모두 바꿨습니다. 이름도 그냥 img01 이런식으로 통일감을 준 뒤 실행을 하니까 아주 잘 됩니다.
그러면 소스코드를 살펴보겠습니다.
BaseAdapter를 상속하여 GridView에 이미지를 보여줄 수 있는 기능을 정의하는 ImageAdapter클래스를 메인액티비티클래스 안에 그냥 정의해줍니다.
이미지 배열을 선언해서 이미지명을 drawable에 있는 이미지명과 동일하게 선언해줍니다.
getCount()메소드는 전체 이미지의 갯수를 반환해줍니다.
가장 중요한 코드는 getView() 메소드입니다. 이 메소드는 각각의 이미지를 보여주기 위해서 매번 호출이 되므로 이 메소드를 어떻게 작성하느냐에 따라 GridView의 성능이 달라집니다. 가장 쉽게 적용할 수 있는 방법은 getView() 메소드의 인자로 넘어오는 convertView가 null이 아닐 경우에는 이를 ImageView로 캐스팅하는 것입니다. convertView는 이전에 사용한 ImageView객체입니다.
디바이스 테스트 해보니 한 행에 5개의 이미지가 GridView에 잘 나타납니다.
이상으로 포스팅을 마칩니다. 감사합니다.
참고서적 : 200개의 단계별 예제로 배우는 안드로이드 4.0 [제이펍]
Fin.
잘 못 된 정보가 있으면 말씀해주세요~
공감버튼 클릭은 작성자에게 큰 힘이 됩니다. 행복한 하루 되세요.