Computer >> 컴퓨터 >  >> 프로그래밍 >> Android

코틀린(Kotlin)으로 안드로이드 버튼 숨기기·제거하기: 단계별 완벽 가이드

Kotlin으로 Android 버튼 숨기기·제거하기

이 튜토리얼에서는 Kotlin을 사용하여 Android 앱에서 버튼을 화면에서 숨기거나 제거하는 방법을 단계별로 알아봅니다. 예제에서는 버튼을 클릭하면 해당 버튼이 화면에서 사라지도록 구현합니다.

INVISIBLE과 GONE의 차이점

Android에서 뷰(View)를 숨기는 대표적인 방법은 두 가지이며, 상황에 맞게 선택하는 것이 중요합니다.

  • View.INVISIBLE — 뷰가 화면에 보이지 않지만 원래 차지하던 공간은 그대로 유지됩니다. 따라서 주변 뷰의 위치는 변하지 않습니다.
  • View.GONE — 뷰가 보이지 않을 뿐만 아니라 레이아웃에서 완전히 제거된 것처럼 공간까지 사라지므로, 주변 뷰가 그 자리를 채우며 재배치됩니다.

이번 예제에서는 View.INVISIBLE을 사용해 버튼을 숨깁니다. 버튼을 완전히 제거하고 싶다면 View.GONE으로 변경하면 됩니다.

1단계: 새 프로젝트 만들기

Android Studio에서 File → New Project를 선택한 후, 프로젝트 생성에 필요한 세부 정보를 모두 입력하여 새 프로젝트를 만듭니다.

2단계: 레이아웃 작성 — activity_main.xml

res/layout/activity_main.xml 파일에 아래 코드를 추가합니다. 화면 상단에는 제목용 TextView를, 중앙에는 클릭하면 사라질 Button을 배치했습니다.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:tools="https://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="50dp"
        android:text="Tutorials Point"
        android:textAlignment="center"
        android:textColor="@android:color/holo_green_dark"
        android:textSize="32sp"
        android:textStyle="bold" />
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:background="@android:color/white"
        android:padding="4dp"
        android:text="Click to hide me "
        android:textColor="@android:color/holo_red_dark"
        android:textSize="24sp"
        android:textStyle="bold" />
</RelativeLayout>

3단계: MainActivity.kt 작성

src/MainActivity.kt 파일에 아래 코드를 추가합니다. 버튼에 클릭 리스너를 등록하고, 클릭 시 visibility 속성을 INVISIBLE로 변경한 뒤 토스트(Toast) 메시지를 표시합니다.

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.Button
import android.widget.Toast

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        title = "KotlinApp"
        val button: Button = findViewById(R.id.button)
        button.setOnClickListener {
            button.visibility = View.INVISIBLE
            Toast.makeText(baseContext, "Button is hidden", Toast.LENGTH_SHORT).show()
        }
    }
}

4단계: AndroidManifest.xml 설정

androidManifest.xml에는 아래 코드를 사용합니다. 새 프로젝트 생성 시 자동으로 만들어지는 기본 매니페스트와 동일하므로, 특별히 수정할 부분은 없습니다.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
    package="com.example.q11">
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

앱 실행 및 결과 확인

이제 애플리케이션을 실행해 결과를 확인해 보겠습니다. 실제 Android 기기가 컴퓨터에 연결되어 있다고 가정합니다. Android Studio에서 프로젝트의 액티비티 파일 중 하나를 연 뒤 툴바의 Run 아이콘을 클릭하고, 목록에서 본인의 모바일 기기를 선택하세요. 그러면 기기 화면에 앱의 기본 화면이 표시됩니다.

화면 중앙의 Click to hide me 버튼을 누르면 버튼이 즉시 사라지면서 Button is hidden이라는 토스트 메시지가 잠깐 나타납니다. 버튼이 사라진 후에도 원래 자리의 공간은 유지되는 것을 확인할 수 있습니다.

코틀린(Kotlin)으로 안드로이드 버튼 숨기기·제거하기: 단계별 완벽 가이드

코틀린(Kotlin)으로 안드로이드 버튼 숨기기·제거하기: 단계별 완벽 가이드