함께하는 안드로이드어플개발 5 - "레이아웃과 뷰"

 

[http://mnworld.co.kr 의 shakej가 직접 작성한 글입니다]
[안드로이드 프로그래밍 정복 서적을 참고하여 쓴 글입니다]

자자 기본적인 사용법에 대해 알아봤으니, 다음은 '뷰' 레이아웃에 대해 알아보는 시간을 가질께요.

안드로이드 응용 프로그램의 화면을 구성하는 주요 단위는 액티비티이에요.

하지만 액티비티 라는 것 자체는 화면에 직접 보이지 않으며, 액티비티 안의 뷰가 사용자를 대면하는 실체에요.

뷰 여러개가 모여 액티비티 하나를 구성하고 그런 액티비티들이 모여 응용프로그램이 됩니다.

뷰는 사용자 인터페이스(UI)를 구성하는 핵심 컴포넌트로 화면을차지하며 자신의 모양을 나타내고, 사용자로부터 입력을 받아들이어요.

UI 가 최근 굉장히 중요한 요소로 부각되고 있죠?^^ 기술적인 면도 중요하지만, 컴맹 혹은 안드로이드에 대해 잘 모르는 사람도 쉽게
사용할 수 있도록 쉬운 UI 가 점차 확대되어가고 있습니다 !


view 의 파생 클래스 개수는 매우 방대해서, 그 일당들을 정복하는 데는 상당한 시간이 소요되요. 뷰는 크게 2가지로 나뉩니다.

위젯 : 직접적으로 보이며 사용자 인터페이스를 구성. 버튼, 텍스트 뷰, 에디트, 라디오 버튼 등이 위젯, 컨트롤이에요
뷰 그룹 : 직접 적으로 보이지 않으며 다른 뷰를 담는 컨테이너 라고 하고, 이름 그대로 여러개의 뷰가 모이게 되고, 이런 것을 레이아웃이라고 부릅니다.

따라서 다시 한번 정리해보면, 가장 큰 개념으로 "액티비티"가 있고 그 안에 "뷰"가 있고 이 "뷰"에는 위젯과 뷰그룹으로 나누어 져있다고 생각하면 조금 쉬울 것 같네요 ^^

이 때 "뷰"의 이름은 id로 정의하게 되요 ( html 에서는 class로 이름을 정의하고 css 에서 받아옵니다^^ )


텍스트와 이미지를 표현하기 위한 textview, imageview 가 있는데, 이에 대한 속성은 추후 다시 한번 다뤄보도록 할게요.

대부분이 html 태그와 거의 흡사하게 되어 있어서 크게 어려움은 없으실 것 같습니다.

버튼 에딧은 실제로 한번 해보도록 할게요.

버튼은 사용자가 클릭해 명령을 내릴 수 있는 위젯이에요 (다아시겠지만?^^)

텍스트 뷰가 아닌 에딧 텍스트는 문자열을 입력받는 위젯이며 간단히 줄여 에디트라고도 불러요.


맨날 닷넷이랑 html 만하다가 안드로이드 버튼 에디트 만드는 걸 하면서 히껍했네요 ㅋㅋㅋ
처음으로 한번 만들어볼까요?^^
버튼 에딧 예제를 만들기 위해서는 먼저 레이아웃을 건드려봅니다.

(XML 로 되어 있기에 조금만 틀려도 예를 들어 대소문자같은 걸 틀리면 디버깅이 되질 않습니다 !!
 XML 은 표준을 가장 잘지키는..파서가 있어서 조그마한 오류도 치명적 오류로 처리를 해서 아예 읽으려는 시도조차 안하거든요!)

자자, 먼저 layout 에 텍스트 박스와 버튼을 심어주겠습니다. 이렇게 만든 뒤에 실행을 시켜봤자 되질 않아요 ! 왜냐구요~!?
당연히 버튼을 클릭했을 때 어떤 이벤트가 발생할지 아직 명령해주지 않았기 때문에 겉으로 보이기만 그렇게 보이는 겁니다.

저 위에 부분에서 위에 넘어갔던 부분들이라 wrap_content 나 id/btn 등에 대해서 잘 모르시겠죠~!?
저도 간과하고 넘어갔다가 잘 몰라 다시한번 정리해볼게요.

fill_parent 는 부모의 주어진 크기를 다 채워버립니다 ( 즉 화면을 가득 채운다는 소리이겠죠 )
wrap_content 는 내용물의 크기만큼 채웁니다 ( 즉 글자를 미친듯이 많이 쓰면 미친듯이 커진다는 뜻이에요 )
정수 크기 는 픽셀로 고정시키는 것 처럼 정수만큼 크기를 고정시킨다는 의미입니다.

android:id = "+id/edit" 의 의미는 뷰를 칭하는 이름을 이야기합니다. 코드나 XML 문서에서 이 id를 사용하게 됩니다.
붙이는 형식은 @[+]id/ID 로 뒷부분 ID부분에 필요한 이름을 적어주면됩니다! 즉 저기 있는 버튼의 이름을 btn 으로 정의하고 소스파일에서 이벤트를 줄 때 btn 에 이벤트를 주면 성립하게 되는 것입니다 ! 이해가가셨나요?^,^

다음은 소스파일을 만져보도록 할게요!

이벤트를 주는 곳은 src 폴더에 buttonedit.java 파일에 위와 같이 기재해 줍니다.
R.layout 에 있는 buttonedit 이라는 레이아웃에 적용이 된다는 의미겠네요 ^^

간단하게 만들었으면 구동을 ! Ctrl + F11 을 눌러봅시다 !

짜잔.. 제 이름의 앞부분인 chang 이라는 글자가 입력이 되고 버튼을 누르니 chang 이 입력되었다는 팝업창이 보입니다 !

우오 신기하죠?

참고로 위에 기본적으로 '중국어'로 되어 있는데 이를 바꾸시려면 오른쪽의 menu 버튼 - Lanugage - Select Location - 한국어
로 입력해주시면 모두 한국어 버전으로 바뀝니다^^