[안드로이드 기초] TableLayout과 TableRow 표만들기
|
▣안드로이드 TableLayout과 TableRow를 이용해서 표만들기 |
● 어떤 문서를 작성하든 '표'는 거의 다 삽입 되잖아요. 복잡한 내용을 깔끔하게 정리하기 위해서 표를 사용하곤 하는데요. 안드로이드에서도 이런 표를 만들 수 있습니다. TableLayout과 TableRow를 이용해서 배경색과 maigin을 설정하여 구분선을 표현해서 만드는 것인데요.
이것들을 사용해서 만든 간단한 표 입니다.
● 보통 이런 표를 그리기 위해서는 "TableLayout"과 "TableRow"가 동시에 사용이 됩니다. 그리고 View를 이용하여 "행"사이의 선을 그리기도 합니다. 소스코드를 보면서 어떻게 그려졌는지 살펴보도록 하겠습니다. 
● 먼저 두 레이아웃의 상속구조를 살펴보도록 하겠습니다.
● 계층구조를 살펴보면 알 수 있듯이 두 레이아웃 모두 "LinearLayout"을 상속 받아서 만들어졌습니다. 이것이 의미하는 것은 세로와 가로의 방향성을 가지고 있다는 뜻이기도 합니다.
● 표의 레이아웃 배치가 어떻게 되었는지 살펴 볼게요.
● 전체 LinearLayout(Vertical)에 텍스트 뷰 두개를 와 TalbleLayout과 TableRow을 이용해서 배치를 한것입니다. 배경색과 margin을 이용해서 선을 그리고 있는 형태인데요. View는 첫번째 열인 (RANK, NAME, SCORE)부분의 상단에 선을 긋기 위해서 넣은 것입니다.
● xml 소스를 보면서 분석을 해보겠습니다.
● 제목과 부제목을 출력하기 위해서 두개의 텍스트뷰를 배치하고 있습니다. "gravity"를 center과 right로 설정하여 제목은 중앙에 위치하게 하고 부제목은 오른쪽으로 위치하도록 한것을 알 수 있습니다.
● 다음으로 표를 그리는 부분을 보겠습니다.
⑴ TableLayout의 배경색을 연회색(#999999)으로 설정하고, android:stretchColumns="*"으 설정하여 열 객체들이 세로 방향으로 나란히 배치하도록 한것입니다.
⑵ 테이블레이아웃의 최상단에 선을 긋기 위해서 View 객체가 있고 그 아래쪽으로 행을 출력하는 TableRow가 배치되어 있는 구조입니다. View의 높이(height)를 1dp로 해서 가로선이 그어지게 한것입니다. 이 숫자를 높여보면 선의 두께가 두꺼워지게 됩니다.
⑶ 세개의 텍스트뷰를 배치하고 왼쪽과 아래쪽 여백을 "1dp"로 설정하고 배경색을 회색으로 설정하여 테두리가 그려지게 한것입니다. 
● 같은 방법으로 나머지 행을 만듭니다. 두번째 행부터는 배경색을 검정색으로 설정하여 처리합니다.
● 배경색과 text만 바꿧을뿐 나머지는 모두 같습니다. 테이블의 색을 바꾸고 싶다면 배경색만 원하는 색으로 설정해주시면 좀 더 화려한 표가 만들어 질것입니다. 나머지 행도 같은 방법으로 만들고 싶은 만큼 만들면 되겠습니다.