[Kotlin][Android] 안드로이드 회원가입/로그인/전화 바로걸기 버튼 클릭 만들기

안드로이드 코틀린 로그인 / 회원가입 / 전화 바로걸기 버튼 클릭 만들기

이번 예제에서는 아이디 중복확인이나 정규식 사용과 같은 과정은 생략하고 아주 간단한 회원가입 / 로그인 기능을 구현해볼 예정이다. 

 

빌드 스크립트 설정(build.gradle(:app))

코틀린 안드로이드 익스텐션을 사용하려면 프로젝트에 코틀린 개발 환경 또는 코틀린 빌드 플러그인 적용 및 프로젝트 의존성에 코틀린 표준 라이브러리 추가가 되어 있어야 한다.

plugins {
    id 'kotlin-android-extensions'
}

 

로그인 / 회원가입 전화걸기 버튼 XML 만들기

우선 로그인/회원가입에 필요한 간단한 XML을 만들었다. 

메인 화면은 로그인/회원가입으로 들어가는 화면을 만들었다. 

 

activity_main.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=".MainActivity">
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    <TableLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        tools:ignore="MissingConstraints">

        <TextView
            android:id="@+id/mainView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="128dp"
            android:layout_marginLeft="128dp"
            android:layout_marginTop="16dp"
            android:text="메인제목"
            android:textSize="24sp"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />


        <TextView
            android:id="@+id/buttonView"
            android:layout_width="70dp"
            android:layout_height="20dp"
            android:layout_marginLeft="254dp"
            android:layout_marginTop="20dp"
            android:text="[신규]"
            android:textSize="15sp"
            app:layout_constraintTop_toBottomOf="@+id/mainView" />


        <TextView
            android:id="@+id/textView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="4dp"
            android:layout_marginLeft="4dp"
            android:text="부제목"
            android:textSize="20sp"
            app:layout_constraintTop_toBottomOf="@+id/buttonView" />

        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">


            <ImageView
                android:id="@+id/imageView"
                android:layout_width="wrap_content"
                android:layout_height="140dp"
                android:layout_marginLeft="5dp"
                android:layout_marginTop="25dp"
                android:gravity="center"
                android:src="@drawable/boy" />

            <Button
                android:id="@+id/button_next"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="30dp"
                android:layout_marginTop="200dp"
                android:text="회원가입/등록"
                android:textSize="24sp"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.245"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/imageView" />

            <Button
                android:id="@+id/button_next2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="20dp"
                android:layout_marginTop="200dp"
                android:layout_toRightOf="@id/button_next"
                android:text="로그인"
                android:textSize="24sp" />


        </RelativeLayout>
        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

            <TextView
                android:id="@+id/ContactView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="70dp"
                android:text="전화번호 : "
                android:textSize="24sp"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.016"
                app:layout_constraintStart_toStartOf="parent" />

            <TextView
                android:id="@+id/NumberView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="58dp"
                android:layout_marginLeft="108dp"
                android:layout_marginTop="110dp"
                android:text="Tel.000-000-0000"
                android:textSize="24sp"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/ContactView"
                app:layout_constraintTop_toTopOf="parent" />

            <Button
                android:id="@+id/CallButton"
                android:layout_width="wrap_content"
                android:layout_height="40dp"
                android:layout_marginLeft="9dp"
                android:layout_marginTop="110dp"
                android:layout_toRightOf="@id/NumberView"

                android:text="바로 걸기"
                android:textSize="15sp"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintHorizontal_bias="0.915"
                app:layout_constraintStart_toStartOf="parent"
                tools:layout_editor_absoluteY="676dp" />


        </RelativeLayout>
    </TableLayout>
    </ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

 

MainActivity.kt 전체 코드

package com.example.test

import android.content.Intent
import android.net.Uri
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.util.Log
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {
    val TAG: String = "Register"

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        button_next.setOnClickListener {
            Log.d(TAG, "회원가입 버튼 클릭")

                // 회원가입 화면으로 이동
                val intent = Intent(this, InputActivity::class.java)
                startActivity(intent)

            }
        button_next2.setOnClickListener {
            Log.d(TAG, "로그인 버튼 클릭")
            // 로그인 화면으로 이동
            val intent = Intent(this, LoginActivity::class.java)
            startActivity(intent)

        }
        CallButton.setOnClickListener{
            var intent = Intent(Intent.ACTION_DIAL)
            intent.data = Uri.parse("tel:01000000000")
            if(intent.resolveActivity(packageManager) != null){
                startActivity(intent)
            }
        }

    }
}

완성된 화면이다.

회원가입/ 등록을 누르면 회원가입 페이지로

로그인 버튼을 누르면 로그인 페이지로 이동한다.

전화번호는 바로 걸기 버튼을 누르면 바로 전화를 걸을 수 있게 이동한다.

 

안드로이드 Intent을 이용해서 화면 이동을 만들었다.

안드로이드 Log를 활용하여 작업내역이  print 될 수 있도록 구성했다.