#04. 예제로 알아보는 GUI 디자인 - (3) 리스너 추가 및 마무리하기

지난 강좌에서, 사용자가 입력한 할 일이 저장되어있는 ArrayList와 입력된 할 일을 화면에 표시해주는 ListView를 ArrayAdapter를 통해 연결시켜주는 코드까지 작성하였습니다. 

이번 강좌에서는, 키패드의 CENTER 버튼을 누르면 EditText를 통해 입력된 할일이 ArrayList에 저장되게끔 하는 코드, 즉 KeyListener를 작성하여 예제 어플리케이션을 완성해보도록 하겠습니다.

그나저나, 왼쪽 화면에서 뭔가 차이점을 느끼셨나요?
아마 저번 강좌 화면에서는 못보던 "키패드"를 보실 수 있으실 겁니다. 아시는 분은 다 아시겠지만, 아직까지 안드로이드 SDK에는 터치 키보드가 적용이 되어있지 않은데, 안드로이드 컵케익에는 이 터치 키보드가 적용되어있습니다.

요새 제가 컵케익을 적용시켜서 이것저것 만져보느라, 본의 아니게 화면이 바뀌게 되어버렸네요. :) 뭐, 예제도 설명하면서 겸사겸사 컵케익에 관련된 것도 소개하니, 어떻게 보면 일석이조라고 할 수도 있나요? ^^;;

안드로이드 컵케익에 관한 정보 및 설치법은 (2009/01/29 - [안드로이드/이거, 알고있니?] - 안드로이드 Cupcake 업데이트, 직접 체험해보자!)를 참조하세요.

그럼, 이제부터 본격적으로 마무리를 지어가도록 하겠습니다.

사용자로부터 입력받은 할일을 ArrayList로 넘기는 역할을 해주는 코드도 짜야 하고, 사용자의 특정 입력, 이 예제에서는 CENTER 버튼이 눌렸을 때 입력받은 정보를 ArrayList로 넘겨주는 KeyListner의 작성, 즉 이 두 가지를 이번 강좌에서 다루도록 하겠습니다. 일단, 코드부터 보겠습니다.

package com.androidhuman.ToDoList;

import android.app.Activity;
import android.os.Bundle;
import android.widget.ListView;
import android.widget.EditText;
import java.util.ArrayList;
import android.widget.ArrayAdapter;
import android.view.*; // View객체를 사용하기 위해 import합니다.
import android.view.View.OnKeyListener; // 키 리스너를 사용하기 위해 import 합니다.

public class HelloWorld extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        ListView myListView = (ListView)findViewById(R.id.myListView);
        final EditText myEditText = (EditText)findViewById(R.id.myEditText);
        
        final ArrayList<String> todoItems = new ArrayList<string>(); // java
        
        final ArrayAdapter<String> aa; // android
        aa=new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, todoItems);
        
        myListView.setAdapter(aa);
        
        myEditText.setOnKeyListener(new OnKeyListener(){ // (1) 
         public boolean onKey(View v, int keyCode, KeyEvent event) { // (2)
          if(event.getAction()==KeyEvent.ACTION_DOWN)  // (3)
          {
           if(keyCode==KeyEvent.KEYCODE_DPAD_CENTER) {
                       
           todoItems.add(0, myEditText.getText().toString()); // (4) 
           aa.notifyDataSetChanged(); // (5) 
           myEditText.setText(""); //(6) 
           return true;
           }
          }
          return false;
         }
        });
    }
}

으음... 상당히 복잡한 모습을 갖추고 있습니다(....)
저도 처음에 저걸 봤을때 (사실 지금도 무서워요...) 뭐 저래.. 했는데, 하나하나씩 차근차근 풀어나가다 보니 많이 복잡한 구조를 가지고 있지는 않았습니다. 하지만, 코드 자체가 좀 복잡하고, 중괄호 하나하나도 헷갈리기 쉬우므로 잘 보세요.
헷갈리지 마시라고 색깔로 구분해 두었습니다. :)

키 리스너를 가지는 객체는 실질적으로 객체가 가지고 있는 데이터를 "가지고 있는" 객체, 즉 EditText 객체가 가져야 합니다. 그래야 EditText 에 입력한 할 일을 ArrayList에 저장할 수 있겠죠??

(1)번을 보시면, EditText에 OnKeyListner를 추가해주는 것을 볼 수 있습니다(setOnKeyListner). 그와 동시에, OnKeyListner를 추가해주고 있는데, 이 생김새 자체가 저는 너무 어색했습니다. 그래서 아직 저도 완벽하게 이해한 상태가 아니라, 일단은 "무작정 따라하고" 있는 중입니다. ^^;; 일단은 따라하시고, 나중에 제가 리스너 인터페이스에 대해서 좀 더 공부한 이후에 포스팅할테니, 그때까지 기다려주세요~~ (물론, 이 쪽에 대해 잘 아시는 분은 개념 정도라도 설명해주신다면 감사하겠습니다 :)

(2)에서 보면, 키가 입력되었을 때 반응하는 메소드인 OnKey() 메소드 안에 우리가 필요한 내용들을 추가하고 있습니다. (3) 을 보면, 키카 눌렸을 때 반응하도록 되어있습니다. 

키가 눌렸을 때에는 어떤 키가 눌렸는지를 알려주는 keyCode를 인식하게 됩니다. 입력받은 키는 코드 형태로 KeyListener에 전달되게 되는데, 이렇게 전달된 키코드에 따라 어떻게 반응할 지 정할 수 있습니다.

이 예제에서는 CENTER 버튼을 눌렀을 때 반응해야 하므로, keyCode가 KEYCODE_DPAD_CENTER일 때, 즉 가운데 버튼을 눌렀을 때 반응하도록 되어있습니다.

다음은, 원하는 키가 눌렸을 때 해 줄 작업을 추가하였습니다. 즉, EditText에 입력된 내용을 ArrayList에 넣어주는 작업입니다.
이 과정은 의외로 간단합니다. (4)에서, EditText에 있는 텍스트를 String형태로 ArrayList(todoItems)에 바로 전달합니다. 이는, ArrayList에 항목을 추가하는 메소드인 add()를 통해서 이루어집니다.

그리고, ArrayList의 내용이 변경되었으므로 이를 ListView에 알려서 내용을 갱신해야 합니다. 이를 수행하기 위하여, ListView와 ArrayList를 연결해주는 ArrayAdapter(aa)의 notifyDataSetChanged()메소드를 이용하여 변경된 사실을 ListView에 알려줍니다. 그렇게 되면, ListView는 화면을 갱신해주어 사용자가 입력한 할 일이 리스트에 추가되어 화면에 나오게 됩니다 (5).

마지막으로, 사용자로부터 추가적으로 할 일 입력을 받기 위해 EditText에 입력된 내용을 지워줍니다(6).
마지막으로, OnKey 메소드가 boolean 이므로, 모든 과정이 정상적으로 작동하였다면 true를 반환하여 메소드를 종료합니다.

이 과정을 제데로 따라오셨다면, 다음 화면과 같이 작동할 것입니다. :)

이로서, 꽤 오랜 시간동안 쉬었다 다시 시작한 입문 강좌의 한 단원이 끝났습니다. 다음 강좌는 언제 쓸 수 있을지 모르겠지만, 공부 좀 더 열심히 해서 가급적 빠른 시일 내에 올릴 수 있도록 하겠습니다.

Hint. 다음 강좌는 아마도 Intent를 다룰 듯 합니다. :)