GUI 개발시 위지윅 에디터를 거의 사용하지 않는 버릇 때문에, 대부분의 UI 개발을 코드만으로 해오고 있었습니다. 복잡한 GUI 만들 때는 코드로 하면 더 어렵지 않느냐 생각하실 수도 있지만 결코 그렇지 않습니다. 복잡도가 높으면 높을수록 코드로 GUI를 뽑아내는 것이 더 높은 생산성을 보입니다. 컴포넌트들을 적절한 범주로 묶어 collection에 넣어 일괄처리할 수도 있고, 화면은 1장이여도 논리적인 기능 단위로 클래스를 분리할 수 있어 편리하기 때문입니다. 예를 들어 계산기를 만든다고 할 때, 버튼이 여러개가 있는데 이것들을 디자이너로 배치하고, 각 아이디를 할당하고 이벤트 핸들러를 붙이는 것은 곤욕입니다. for loop으로 생성하고 화면 resolution에 따라 적절히 컴포넌트의 크기위 위치를 할당하는 것이 개발속도가 더 빠릅니다. UI 생성 코드 로직들을 다 기억한다는 전제하에 유지보수하기도 훨씬 더 편리해집니다. 아주 오랜 시간이 지나, 어떻게 만들었었는지 기억을 거의 못할 때면, 디자이너를 열어서 버튼을 더블클릭하여 어느 핸들러와 연결되어있는지 확인하는 것도 더 편하겠지만, 우리는 문서 작성능력이 있고 기억해야할 것을 어딘가 노트해둘 수 있는 능력을 가진 인간입니다. (게다가 우리에겐 Swing, SWT, JavaFX를 지원하는 MiG Layout이 있습니다.
)
안드로이드는 UI 생성을 XML 말고도 코드로도 생성할 수 있게 해줍니다. 하지만 그 지원이 생각만큼 높지 않습니다. 문서가 부족하기 때문입니다.
수십년동안 많은 프로그래머들이 XML로 분리된 UI 없이도 가변 사이즈를 지원하는 UI를 코드로 작성해왔었고, 다국어 지원을 추가함에도 아무런 문제가 없었다.
코드가 더 복잡해지는 것은 아닙니다.
그러면 왜 코드로 UI 만들기가 어렵다고 했나요?
그 이유는, Android가 XML로 UI 만들기를 권장하고 있기 때문입니다. 코드로 UI 만드는 사람을 위한 친절한 문서가 거의 없기 때문입니다.
위의 TextView 생성 코드를 보시면, 수직 중앙 정렬과 우측 정렬을 하기 위해 android.view.Gravity 의 상수를 가져다 쓰고 있습니다. API 문서에는 setGravity(int)로만 되어 있고, See also 섹션에 Gravity 클래스의 링크가 있습니다. 후다닥 찾기가 애매합니다. XML에서는 그저 android:gravity="center_vertical|right" 라고 입력해주면 되는데 말입니다.
LinearLayout을 쓰고 싶은데, d.android.com 에서 제공하는 문서는 오직 XML 뿐입니다. 위의 코드를 보면 child 컴포넌트에setLayoutParams(new LinearLayout.LayoutParams(FILL_PARENT, WRAP_CONTENT, 0.0f))를 실행하여android:layout_width="fill_parent", android:layout_height="wrap_content", android:layout_weight="0"과 똑같은 동작을 하도록 했습니다.
가장 큰 어려움은 TextView 클래스에 setLayoutWidth 나 setLayoutHeight, setLayoutWeight 같은 이름을 가진 메서드가 존재하지 않는다는 것입니다. 결국, XML 문서만을 보고 추측하여 쉽게 코드로 옮길 수 없다는 문제가 있습니다.
XML에서 할 수 있는 모든 기능을 API로도 할 수 있습니다. 하지만쉽게 찾을 수 없는 것이지요.
코드로 UI를 만드는 것이 어렵다고 했는데, 왜 구지 코드로 UI를 만들려고 하나요?
동일한 속성을 가지는 컴포넌트를 여러개 만들려고 할 때, XML 에서는 copy and paste가 불가피합니다. 계산기 앱의 경우 버튼이 4x4로 16개가 있습니다. 버튼의 배경색을 검정색에서 회색으로 바꾸고자 한다면 16번 손을 움직여야 합니다. 코드로 하면 루프 몇 번 돌아서 해결할 수 있는데 말입니다.
private void createButtons() {
for (int i = 0; i < nums.length; i++) {
final int number = i;
nums[i] = new Button(getContext());
nums[i].setText(String.valueOf(number));
nums[i].setGravity(gravity);
nums[i].setTextSize(textSize);
nums[i].setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
action.processNumber(number);
}
});
}
for (final Operator op: Operator.values()) {
Button button = new Button(getContext());
button.setText(op.text());
button.setGravity(gravity);
button.setTextSize(textSize);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
action.processOperator(op);
}
});
operatorButtons.put(op, button);
}
}
이렇게.. 안드로이드 계산기가 만들어져가고 있습니다.
////의견
리소스가 부족한 경우는 코드로 UI를 짜는것도 나쁘다고 할 순 없겠지만, 기본적으로는 어플리케이션의 성능을 위해서 XML로 UI를 만드는게 좋다고 합니다.
LinearLayout 사용하면서 하면, 그렇게 오래걸리지도 않더라구요 ㅋ id만 알아보기 좋게 잘 지정해주면, 요것도 편하게 쓸 수 있습니다.
문서에도 xml view inflate 비용이 크다고 나와있는데 실행시 성능이 좋아진다는 말은 이해하기 어렵네요.
좋은 글 잘봤습니다. 현재 나오는 안드로이드 폰 같은 경우는 xml 을 이용하나 소스코딩을 이용하나 퍼포먼스나 메모리 문제가 별차이가 없다고만 설명이 되어있는데 이차이점을 설명해 주는 사이트는 없는건가요??ㅠㅠ 찾기가 쉽지 않군요 저도 UI 소스코딩을 하는 쪽으로 생각하고 있는데 이부분도 찾기가 쉽지 않군요.. 혹시 제질문에 대한 답이 있으시면 멜로 좀 부탁드려도 될까요?? 이미지 폴더를 만들어서 이미지를 불러서 사용할려고 하는데 가능할지요~~
Preston July 27th, 2010 - 15:01좋은 내용 감사합니다.그리고 윈도우처럼 이미지폴더를 생성 하고 거기서 이미지를 불러다 쓰는 방법을 알고 계시는지요가능하시다면 메일로도 좀 부탁드립니다. 너무 질문만 하고 가네요.
감사합니다.
이런 내용 포스팅 가능하신가요?? 사이트를 뒤지면서 찾고 있는데 생각보다 찾기 쉽지 않네요.
정말 Android sdk 2 되면서 에뮬레이터든 디바이스든 부팅 속도 장난 아니게 느려졌어요 ㅎㅎ 영록님 말씀대로 프로그램적인 부분을 제외한 스타일적인 부분의 테스트 효율성을 위해서는 XML 활용하는 장점도 있는 것 같아요. (레스님 블로그에 댓글 첨 다는듯
레이아웃 관련 속성은 LayoutParams라는 클래스를 만들고 setLayoutParams로 넣어주면 됨. 하나 골치아픈 것은 LayoutParams의 클래스를 부모 레이아웃에 맞게 골라줘야 한다는.XML에 이벤트 리스너를 지정할 수 없는 것은 코딩 스타일에 따라 별로 불편하지 않을 수도. MVC 모델에서 XML을 뷰로 쓰고 Activity나 POJO를 컨트롤러로 쓴다면 컨트롤러에서 이벤트 리스너 등록을 하기 때문에 어차피 필요한 코드들은 잘 모여 있어서 별로 문제가 안된다는…
뭐 사실 안드로이드 레이아웃 디자이너는 개판이라서 위지윅의 장점을 별로 살릴 수 없긴 하지만, 안드로이드 에뮬레이터가 워낙 느려서 바로바로 결과를 볼 수 있는 XML이 좀더 생산성이 높은 듯.
근데 사실 스타일 중복은 Style과 Theme라는 게 있어서 어느 정도 해결이 가능하기 때문에 동적으로 추가되어야 하는 컴포넌트가 아니라면 중복 문제는 그리 크지 않다는. 나도 달력 만들 때 달력의 날짜 셀들은 XML로 쭉 copy&paste로 넣고 숫자 집어넣는 것만 for로 돌리는데 그러면 로직과 뷰가 잘 분리되서 코드 양도 줄고 가독성도 좋은 듯.
저희팀에선 그래서, mxml의 onClick 비슷한 식으로, 메소드 이름을 xml 안에 적어주면, 리플렉션으로 찾아가는 커스텀 클래스를 만들어서 쓰고 있어요;;; 상속 받아서 클래스 만들고, 생성자에서 attrs.getAttribute*() 로 태그에 있는 값을 가져올 수 있더라구요.
댓글 영역