버튼 사용하기

이 자료들은 팁스소프트에서 제공하는 [ 알짜배기 ] 프로그램을 이용하면 더 편리하게 볼수 있습니다.

* 알짜배기 프로그램 받기 - http://www.tipssoft.com/bulletin/tb.php/QnA/8406

* 안드로이드 강좌 목록 - http://www.tipssoft.com/bulletin/tb.php/old_bbs/501

이번 강좌에서는 버튼을 만드는 방법, 버튼을 사용하기 위해서 알아두어야 할 사항 그리고 버튼을

사용하는 여러가지 예제를 소개하도록 하겠습니다.

1. 버튼 만들기

버튼은 소스 파일과 리소스 파일에서 각각 생성할 수 있지만 앞으로의 강좌에서 리소스 파일을 이용한

컨트롤 생성 방법을 사용할 것이기때문에 XML 코드로 버튼을 생성하는 방법에 대하여 알아보도록

하겠습니다.

버튼을 생성할 때 리소스 파일에서 사용하는 XML 태그는 다음과 같습니다.

Button - 버튼 컨트롤을 사용한다는 요소 태그명

android:id - 버튼의 id 를 설정하는 속성

android:layout_width - 버튼의 너비를 설정하는 속성

android:layout_height - 버튼의 높이를 설정하는 속성

android:text - 버튼에 출력되는 문자열을 설정하는 속성

android:onClick - 버튼이 클릭됐을 때 실행될 메소드 이름을 설정하는 속성

버튼을 구성할 때에는 "Button" 요소명을 태그의 가장 선두에 명시하고 사용할 속성은 띄어쓰기를

구분자로하여 나열합니다. 아래의 코드는 버튼을 구성하는 간단한 리소스 코드입니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Hello Tipssoft"
/>
<Button

android:id="@+id/id_button"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

android:text="I'm Button"

/>

</LinearLayout>

위의 버튼은 id_button 이라는 ID 를 사용하고, 부모 윈도우의 너비에 상응하는 너비와 출력되는

글자를 포함할 만큼의 높이를 가지며 "I'm Button" 이라는 문자열을 출력하도록 생성되었습니다.

이렇게 구성된 리소스 파일은 다음과 같은 소스 코드를 이용하여 그대로 응용 프로그램에 출력되도록

할 수 있습니다.

public class TipssoftAppActivity extends Activity

{
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

}

}

< 실행 화면 >

2. 버튼을 사용하기 위해 알아야 할 것

일반적으로 버튼은 버튼은 텍스트뷰처럼 보여지는 것만으로 컨트롤의 역할이 끝나지 않고 사용자가

목적을 가지고 클릭같은 특정 행위를 하기위해 사용하는 컨트롤입니다. 그래서 버튼은 사용자가 어떤

행동을 했는지 판단할 수 있어야하며 버튼이 눌렸을 때에는 어떻게 행동할 것인지를 설정해주어야

합니다.

버튼은 자신이 클릭되었다는 것을 어떻게 알 수 있을까요? 대부분의 컨트롤은 View 클래스를 상속

받아서 구성되는데 이 클래스에는 행동에 관한 이벤트를 처리하는 메소드들이 존재합니다. 그래서

View 클래스를 상속받은 컨트롤 클래스가 이 메소드들을 재정의하여 컨트롤에서 어떠한 행위가

발생했을 때 안드로이드 프레임워크에 의해 호출되도록 이벤트를 처리합니다.

하지만 이러한 방식은 이벤트를 사용하는 컨트롤이 모두 컨트롤 클래스를 상속받아 사용자 정의

클래스로 구성되어서 이벤트들을 재정의해야하기 때문에 매우 번거롭고 불편해집니다. 그래서 이런

점을 개선하기 위해서 인터페이스 형태의 이벤트 리스너가 제공됩니다. 이벤트 리스너의 종류는

다음과 같으며 좌측의 xxxListener 는 인터페이스이고, 우측의 onXXX 는 해당 인터페이스의 단일

메소드 입니다.

OnClickListener - onClick() :

컨트롤을 터치하여 클릭하거나 컨트롤에 포커스가 선택되어있을 때 장치의 버튼을 클릭하는 등의

클릭 행동으로 호출된다.

OnLongClickLstener - onLongClick() :

컨트롤을 길게 누르고있거나 컨트롤에 포커스가 선택되어있을 때 장치의 버튼을 누르고 있는 등의

길게 누르고 있는 행동으로 호출된다.

OnFocusChangeListener - onFocusChange() :

장치의 터치스크린 외의 버튼으로 컨트롤의 포커스를 이동시키는 행동으로 호출된다.

OnKeyListener - onKey() :

컨트롤에 포커스가 선택되어 있을 때 장치의 버튼을 누르거나 떼는 행동으로 호출된다.

OnTouchListener - onTouch() :

컨트롤을 누르거나 떼거나 그외 움직이는 행동들로 호출된다.

OnCreateContextMenuListener - onCreateContextMenu() :

Context Menu 가 생성될 때 호출된다.

3. 버튼을 사용하는 방법

이제부터 버튼이 클릭되었을 때 텍스트뷰의 글자가 변하도록 이벤트 처리를 하는 여러가지 방법에

대하여 알아보도록 하겠습니다. 3.1 예제 ~ 3.3 예제까지는 리소스 코드가 동일하기 때문에 아래의

XML 코드로 통일겠습니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:id="@+id/id_tv"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Hello Tipssoft"
/>
<Button
android:id="@+id/id_button"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="I'm Button!!"
/>
</LinearLayout>

3.1 리스너 인터페이스를 멤버 변수로 선언하여 연결하기

소스 코드의 메인 클래스에 리스너 인터페이스를 멤버 변수로 선언 및 할당하고, 인터페이스의

메소드를 정의한 후 컨트롤에는 해당 인터페이스의 멤버 변수를 연결합니다. 정의된 인터페이스가

멤버 변수의 형태로 존재하기 때문에 여러 컨트롤에 동일한 이벤트 처리를 해야하는 경우 효과적인

방법입니다.

package com.example.tipssoft;

import android.app.Activity;
import android.os.Bundle;

// 이벤트리스너의 onClick 메소드에서 넘어오는 View 를 사용하기위해 추가

import android.view.View;
import android.widget.Button; // 버튼 클래스를 사용하기 위해 추가
import android.widget.TextView; // 텍스트뷰 클래스를 사용하기 위해 추가
import android.view.View.OnClickListener; // 리스너 인터페이스를 사용하기 위해 추가

public class TipssoftAppActivity extends Activity
{

// 이벤트 리스너 인터페이스 멤버 변수를 선언 및 정의한다.

private OnClickListener m_click_listener = new OnClickListener() {
public void onClick(View v) {

// 리소스 파일에 정의된 is_tv 라는 ID의 텍스트뷰를 얻어온다.
TextView tv = (TextView) findViewById(R.id.id_tv);

// 텍스트뷰에 문자열을 "Button Click!!" 으로 변경한다.
tv.setText("Button Click!!");
}
};

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

// 리소스 파일에 정의된 id_button 이라는 ID 의 버튼을 얻어온다.

Button button = (Button) findViewById(R.id.id_button);

// 버튼에 멤버 변수 리스너를 설정한다.
button.setOnClickListener(m_click_listener);
}

}

3.2 리스너 인터페이스를 단순 할당하여 연결하기

리스너를 연결할 때 사용하는 setOnClickListener() 메소드의 매게 변수에 new 예약어를 이용하여

인터페이스를 즉시 할당하고 메소드 정의를 하여 연결하는 것 입니다. 이 방법은 1회성으로 사용될

이벤트 처리에 사용하는 것이 좋습니다.

package com.example.tipssoft;

import android.app.Activity;
import android.os.Bundle;

import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import android.view.View.OnClickListener;

public class TipssoftAppActivity extends Activity
{
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

Button button = (Button) findViewById(R.id.id_button);

// 버튼에 리스너 인터페이스를 할당 및 정의하여 설정한다.
button.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
TextView tv = (TextView) findViewById(R.id.id_tv);
tv.setText("Button Click!!");
}
});
}

}

3.3 메인 클래스에서 리스너 인터페이스 구현(implements) 하기

소스 코드가 작성된 메인 클래스에 implement 예약어를 사용하여 리스너 인터페이스를 구현하는

방법입니다. 자바 언어는 상속시에 하나의 클래스만 상속받을 수 있는 대신 여러개의 인터페이스를

사용할 수 있기때문에 여러개의 리스너를 클래스에서 구현할 수 있습니다.

package com.example.tipssoft;

import android.app.Activity;
import android.os.Bundle;

import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import android.view.View.OnClickListener;

// TipssoftAppActivity 클래스에 OnClickListener 인터페이스를 구현한다.

public class TipssoftAppActivity extends Activity implements OnClickListener
{
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

Button button = (Button) findViewById(R.id.id_button);
button.setOnClickListener(this);
}

// OnClickListener 인터페이스의 onClick 메소드를 정의한다.

public void onClick(View v)
{
TextView tv = (TextView) findViewById(R.id.id_tv);
tv.setText("Button Click!!");
}
}

3.4 리소스에서 Button 요소의 onClick 속성 값을 소스 코드에서 메소드로 구현하기

소스 코드에서 리스너를 별도로 등록하지 않고, 리소스 코드에서 아래의 코드처럼 Button 요소의

onClick 속성에 이벤트를 처리할 메소드의 이름을 설정한 후, 소스 코드에서 해당 메소드명으로

이벤트를 처리하는 메소드를 구성하는 방법입니다.

<Button
android:id="@+id/id_button"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="I'm Button!!"
android:onClick="OnMyButtonClicked"
/>

이 방법은 다른 방법에 비해서 매우 간단하다는 장점이 있지만 프로그램의 규모가 커지면

소스 코드에 있는 메소드가 어떤 일을 하는 함수인지 알기가 힘들어진다는 단점도 있습니다.

package com.example.tipssoft;

import android.app.Activity;
import android.os.Bundle;

import android.view.View;
import android.widget.Button;
import android.widget.TextView;

public class TipssoftAppActivity extends Activity
{
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

}

// 리소스 파일에 설정한 Button 요소의 onClick 속성 값과 동일한 이름의 메소드를 선언하여

// 클릭 이벤트에 대한 처리를 해준다.

public void OnMyButtonClicked(View v)
{
TextView tv = (TextView) findViewById(R.id.id_tv);
tv.setText("Button Click!!");
}
}

< 실행 화면 : 버튼을 누른 후 >