1. MainActivity.java
아래는 각 버튼을 눌렀을 때, 배경색을 변경하는 기능을 구현한 MainActivity 클래스입니다.
package com.example.app_0131;
import androidx.appcompat.app.AppCompatActivity;
import androidx.constraintlayout.widget.ConstraintLayout;
import android.graphics.Color;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
// 각 버튼을 눌렀을 때, 배경색을 변경하는 기능을 구현하기!
//1. view.OnClickListener 를 인터페이스로 구현
//2. onClick()를 오버라이딩
//3. onClick() 메소드 내 버튼을 구별하는 조건문 만들기
//4. c_layout의 배경색을 변경하는 기능 구현
// View.OnClickListener 인터페이스 구현
// : 여러 개의 버튼이 공통된 기능으로 구현할 경우에 적합
public class MainActivity extends AppCompatActivity implements View.OnClickListener{
ConstraintLayout c_layout;
Button btn_red, btn_green, btn_blue;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// view를 초기화하기!
c_layout = findViewById(R.id.c_layout);
btn_red = findViewById((R.id.btn_red));
btn_green = findViewById(R.id.btn_green);
btn_blue = findViewById(R.id.btn_blue);
// 각 버튼에 onClick() 메소드 연결해주기!
btn_red.setOnClickListener(this);
btn_green.setOnClickListener(this);
btn_blue.setOnClickListener(this);
}
@Override
public void onClick(View view) {
Log.v("status","버튼 클릭!");
// 클릭이 발생한 View 의 id를 가져오는 메소드
int viewId = view.getId();
if(viewId == R.id.btn_red){
Log.v("status","빨간색 버튼 클릭!");
c_layout.setBackgroundColor(Color.RED);
} else if (viewId == R.id.btn_green){
Log.v("status","초록색 버튼 클릭!");
c_layout.setBackgroundColor(Color.GREEN);
} else if(viewId == R.id.btn_blue){
Log.v("status","파란색 버튼 클릭!");
c_layout.setBackgroundColor(Color.BLUE);
}
}
}
이 코드는 view.OnClickListener 인터페이스를 구현하여 여러 개의 버튼이 공통된 기능으로 구현하는 예시입니다. 또한, onClick() 메소드 내에서 버튼을 구별하는 조건문을 작성하여 각 버튼에 따라 배경색을 변경하는 기능을 구현했습니다.
2. activity_main
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/c_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<Button
android:id="@+id/btn_blue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/btn_blue"
app:layout_constraintBottom_toBottomOf="@+id/btn_green"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/btn_green"
app:layout_constraintTop_toTopOf="@+id/btn_green"
app:layout_constraintVertical_bias="0.0" />
<Button
android:id="@+id/btn_red"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="44dp"
android:text="@string/btn_red"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/btn_green"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintHorizontal_chainStyle="spread_inside"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="@+id/btn_green"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/btn_green"
app:layout_constraintBottom_toBottomOf="@+id/btn_red"
app:layout_constraintEnd_toStartOf="@+id/btn_blue"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/btn_red"
app:layout_constraintTop_toTopOf="@+id/btn_red"
app:layout_constraintVertical_bias="0.0" />
</androidx.constraintlayout.widget.ConstraintLayout>
이 코드는 ConstraintLayout 안에 버튼 3개를 배치하고, 각각의 버튼을 클릭하면 배경색이 바뀌도록 구현된 XML 레이아웃 파일입니다.
코드의 구성은 다음과 같습니다.
- ConstraintLayout: 화면 전체를 차지하는 레이아웃
- Button btn_red: 배경색을 빨간색으로 바꾸는 버튼
- Button btn_green: 배경색을 초록색으로 바꾸는 버튼
- Button btn_blue: 배경색을 파란색으로 바꾸는 버튼
버튼들은 ConstraintLayout 내에 위치하며, ConstraintLayout 내에서의 위치와 크기는 ConstraintLayout.LayoutParams 속성을 이용해 지정합니다. 버튼들은 각각의 id값으로 구별할 수 있으며, 각 버튼의 onClick() 메소드에서 id값을 비교하여 버튼 클릭 이벤트를 처리합니다.
3. MainActivity2.java
package com.example.app_0131;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;
// 버트을 눌렀을 때, 유저가 입력한 값을 TextView에 출력하기
// 1. 익명클래스 방식으로 이벤트 적용
// 2. 유저가 입력한 값을 가져오기! (EditText)
// 3. 가져온 값을 화면에 출력하기! (TextView)
public class MainActivity2 extends AppCompatActivity {
TextView tv_text;
EditText edt_text;
Button btn;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main2);
// 레이아웃의 View와 Java의 View 객체 연결
edt_text = findViewById(R.id.edt_text);
tv_text = findViewById(R.id.tv_text);
btn = findViewById(R.id.btn);
// 익명클래스로 이벤트 처리하기!
// 독립적인 이벤트를 View에 적용할 때 사용
btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
String text = edt_text.getText().toString();
tv_text.setText(text);
edt_text.setText("");
// Toast : 유저에게 알림메시지를 보여줄 때 사용
// makeTest() : 유저에게 보여줄 메시지 생성
// show() : 생성된 메시지를 앱 화면에 출력
Toast.makeText(MainActivity2.this, "입력 완료!", Toast.LENGTH_SHORT).show();
}
});
}
}
위 코드는 유저가 입력한 값을 가져와서 화면에 출력하는 간단한 예제 코드입니다. 주석을 추가하여 각 부분의 역할과 설명을 자세히 알려주고 있습니다.
주요 포인트는 EditText와 TextView를 초기화하고, Button을 눌렀을 때 OnClickListener 인터페이스를 익명 클래스로 구현하여 버튼 클릭 이벤트를 처리하는 부분입니다.
이때 edt_text에서 유저가 입력한 값을 가져와서 tv_text에 출력하고, edt_text를 비워주는 코드를 포함하고 있습니다.
마지막으로 Toast를 이용하여 유저에게 입력 완료 알림 메시지를 보여주는 코드도 함께 포함되어 있습니다.
4. activity_main2.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity2">
<!-- 입력한 값을 보여줄 TextView -->
<TextView
android:id="@+id/edt_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="204dp"
android:textSize="34sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.461"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<!-- 입력할 값을 받을 EditText -->
<EditText
android:id="@+id/tv_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="92dp"
android:ems="10"
android:hint="내용을 작성해주세요"
android:inputType="textPersonName"
app:layout_constraintEnd_toEndOf="@+id/edt_text"
app:layout_constraintHorizontal_bias="0.361"
app:layout_constraintStart_toStartOf="@+id/edt_text"
app:layout_constraintTop_toBottomOf="@+id/edt_text" />
<!-- 입력한 값을 TextView에 출력할 버튼 -->
<Button
android:id="@+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="56dp"
android:text="텍스트변경하기"
app:layout_constraintEnd_toEndOf="@+id/tv_text"
app:layout_constraintHorizontal_bias="0.491"
app:layout_constraintStart_toStartOf="@+id/tv_text"
app:layout_constraintTop_toBottomOf="@+id/tv_text" />
</androidx.constraintlayout.widget.ConstraintLayout>
- MainActivity2에서 EditText에 입력된 값을 TextView에 출력하는 예제 코드입니다.
- ConstraintLayout을 이용하여 TextView, EditText, Button을 배치하였습니다.
- EditText와 Button의 layout_constraintEnd_toEndOf 속성을 같은 TextView의 id로 설정하여, 화면 크기에 상관없이 중앙 정렬되도록 하였습니다.
5. MainActivity3.java
package com.example.app_0131;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
// 각 버튼을 눌렀을 때, 이미지가 바뀌는 기능을 구현하기!
// 1. "다음" 버튼을 누르면 이미지가 순서대로 넘어간다.
// 2. "이전" 버튼을 누르면 이미지가 역순으로 넘어간다.
// 3. 이미지를 무한으로 넘어간다. ex) 1 -> 2 -> 3 -> 1 -> 2 -> 3 -> ...
public class MainActivity3 extends AppCompatActivity {
ImageView img;
Button btn_pre, btn_next;
// 이미지를 보관하는 배열 생성
int[] imgArray = {R.drawable.muscle, R.drawable.muscle2, R.drawable.muscle3};
int pos; // 자동으로 0으로 초기화됨
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main3);
img = findViewById(R.id.img);
btn_pre = findViewById(R.id.btn_pre);
btn_next = findViewById(R.id.btn_next);
// ImageView의 이미지를 변경할 때 사용!
// R.drawable.파일명
img.setImageResource(R.drawable.muscle);
// 각 버튼을 눌렀을 때, 이미지가 바뀌도록 구현
// 현재 이미지 : 파일명1
// "다음" 버튼 클릭 -> 파일명2
// "이전" 버튼 클릭 -> 파일명3
btn_pre.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (pos == 0) {
pos = imgArray.length - 1;
} else {
pos -= 1;
}
img.setImageResource(imgArray[pos]);
}
});
btn_next.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (pos == imgArray.length - 1) {
pos = 0;
} else {
pos += 1;
}
img.setImageResource(imgArray[pos]);
}
});
}
}
위 코드는 다음과 같은 내용을 구현한 앱입니다.
- 버튼 클릭 시, 이미지가 변경되는 기능 구현
- "다음" 버튼 클릭 시, 이미지가 순서대로 넘어감
- "이전" 버튼 클릭 시, 이미지가 역순으로 넘어감
- 이미지를 무한으로 넘어감 (1 -> 2 -> 3 -> 1 -> 2 -> 3 -> ...)
6. activity_main2.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity3">
<!-- 이미지를 보여줄 ImageView -->
<ImageView
android:id="@+id/img"
android:layout_width="130dp"
android:layout_height="182dp"
android:layout_marginStart="28dp"
app:layout_constraintBottom_toBottomOf="@+id/btn_pre"
app:layout_constraintStart_toEndOf="@+id/btn_pre"
app:layout_constraintTop_toTopOf="@+id/btn_pre"
app:layout_constraintVertical_bias="0.537"
app:srcCompat="@drawable/muscle3" />
<!-- 이전 버튼 -->
<Button
android:id="@+id/btn_pre"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:text="이전"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.522" />
<!-- 다음 버튼 -->
<Button
android:id="@+id/btn_next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="76dp"
android:layout_marginBottom="58dp"
android:text="다음"
app:layout_constraintBottom_toBottomOf="@+id/img"
app:layout_constraintStart_toEndOf="@+id/img"
app:layout_constraintTop_toTopOf="@+id/img"
app:layout_constraintVertical_bias="0.0" />
</androidx.constraintlayout.widget.ConstraintLayout>
7. AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<application
android:allowBackup="true"
android:dataExtractionRules="@xml/data_extraction_rules"
android:fullBackupContent="@xml/backup_rules"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/Theme.App_0131"
tools:targetApi="31">
<!-- MainActivity2 -->
<activity
android:name=".MainActivity2"
android:exported="false" />
<!-- MainActivity -->
<activity
android:name=".MainActivity"
android:exported="false" />
<!-- MainActivity3 -->
<activity
android:name=".MainActivity3"
android:exported="true">
<!-- 앱 실행시 첫 화면으로 설정 -->
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
- AndroidManifest.xml 파일은 앱의 정보와 설정을 담고 있으며, 앱에서 사용하는 모든 컴포넌트들(Activity, Service, BroadcastReceiver, Provider)을 등록해야 한다.
- 앱의 컴포넌트가 실행될 때, 안드로이드 운영체제는 AndroidManifest.xml 파일을 읽어 해당 컴포넌트의 실행 권한이 있는지 확인한다.
- 위 코드에서는 세 개의 Activity를 등록하였으며, MainActivity3가 실행될 때 앱의 첫 화면으로 설정되도록 <intent-filter>를 추가하였다.
'안드로이드' 카테고리의 다른 글
안드로이드 - 6 로그인 0202 (0) | 2023.03.07 |
---|---|
안드로이드 - 5 주사위 App0201 (0) | 2023.03.07 |
안드로이드 -3 카카오구현 0127 (0) | 2023.03.07 |
안드로이드 -2 TextView의 텍스트와 배경색을 변경 0126 (0) | 2023.03.07 |
안드로이드 - 1 TextView의 텍스트를 변경 0125 (0) | 2023.03.07 |