안드로이드 - 1. 수강신청앱 수강신청앱 로그인 화면 만들기

예제 출처 : https://www.inflearn.com/course

예제 소스 : https://github.com/GaKaRi/gakari_android/tree/master/Registration_v1

첫번째 예제는 다음과 같은 화면을 구성합니다.

이번 예제는 기능상의 구현없이 단순히 xml파일로 화면구성만 합니다.

activity_login.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout 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"

    android:orientation="vertical"

    tools:context="com.example.kch.registration_v1.LoginActivity">

   

    <LinearLayout

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:orientation="vertical">

        <LinearLayout

            android:layout_width="match_parent"

            android:layout_height="225dp"

            android:orientation="vertical"

            android:background="@color/colorPrimary"

            >

            <ImageView

                android:layout_width="125dp"

                android:layout_height="125dp"

                android:layout_gravity="center"

                android:layout_marginTop="20dp"

                android:src="@drawable/univlogo"

                />

            <TextView

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:layout_gravity="center"

                android:text="Kyowon UNIV"

                android:textColor="#ffffff"

                android:textSize="25dp"

                android:textStyle="bold"

                android:layout_marginTop="10dp"

                />

            <TextView

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:layout_gravity="center"

                android:text="Registration Helper"

                android:textColor="#ffffff"

                android:textSize="18dp"

                android:textStyle="bold"

                />

        </LinearLayout>

        <LinearLayout

            android:layout_width="match_parent"

            android:layout_height="match_parent"

            android:orientation="vertical">

           

            <EditText

                android:layout_width="280dp"

                android:layout_height="wrap_content"

                android:hint="ID"

                android:layout_gravity="center"

                android:padding="10dp"

                android:textColor="#ffffff"

                android:textColorHint="#ffffff"

                android:id="@+id/idText"

                android:drawableStart="@drawable/ic_person_black_24dp"

                android:drawableLeft="@drawable/ic_person_black_24dp"

                android:layout_marginTop="50dp"

                android:background="@color/colorPrimary"

                />

            <EditText

                android:inputType="textPassword"

                android:layout_width="280dp"

                android:layout_height="wrap_content"

                android:hint="PASSWORD"

                android:layout_gravity="center"

                android:padding="10dp"

                android:textColor="#ffffff"

                android:textColorHint="#ffffff"

                android:id="@+id/passwordText"

                android:drawableStart="@drawable/ic_lock_outline_black_24dp"

                android:drawableLeft="@drawable/ic_lock_outline_black_24dp"

                android:layout_marginTop="10dp"

                android:background="@color/colorPrimary"

                />

            <Button

                android:layout_width="280dp"

                android:layout_height="wrap_content"

                android:textSize="20dp"

                android:textStyle="bold"

                android:textColor="#ffffff"

                android:background="@color/colorPrimary"

                android:text="Login"

                android:layout_marginTop="10dp"

                android:layout_gravity="center"/>

           

            <TextView

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:layout_gravity="center"

                android:textSize="18dp"

                android:layout_marginTop="10dp"

                android:text="Member Registration"

                android:id="@+id/registerButton"

                />

        </LinearLayout>

       

    </LinearLayout>

</LinearLayout>

drawable 폴더에 적당한 이미지를 구해다가 넣습니다.

또는 drawable 폴더를 오른쪽 마우스를 눌러서 New-Vector Asset으로 이미지를 골라서 선택합니다.

colors.xml

백그라운드 색을 지정하기 위한 파일입니다.

<?xml version="1.0" encoding="utf-8"?>

<resources>

    <color name="colorPrimary">#039BE5</color>

    <color name="colorPrimaryDark">#0277BD</color>

    <color name="colorAccent">#546E7A</color>

</resources>

styles.xml

여기서는 타이틀바를 없애는 작업을 합니다.

<resources>

    <!-- Base application theme. -->

    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">

        <!-- Customize your theme here. -->

        <item name="colorPrimary">@color/colorPrimary</item>

        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>

        <item name="colorAccent">@color/colorAccent</item>

    </style>

    <style name="AppTheme.NoActionBar">

        <item name="windowActionBar">false</item>

        <item name="windowNoTitle">true</item>

    </style>

</resources>

AndroidManifest.xml

메니페스트 파일에서는 위에서 설정한 스타일을 지정해줍니다.

<?xml version="1.0" encoding="utf-8"?>

<manifest xmlns:android="http://schemas.android.com/apk/res/android"

    package="com.example.kch.registration_v1">

    <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.NoActionBar">

        <activity android:name=".LoginActivity">

            <intent-filter>

                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />

            </intent-filter>

        </activity>

    </application>

</manifest>