안드로이드 프로젝트(1) UI 구현

현재까지 배운 내용을 가지고 그리고 앞으로 배울 내용을 가지고 지금부터 프로젝트(?)를 만들어 보면 굉장히 좋을 거 같아서 복습할 겸 만들어 보는 시간을 갖도록 했어요!

 

처음에는 무엇을 만들어보면 좋을까 고민을 하다가 게시판 기능을 만들어보면 서버의 흐름과 SQL 사용법에 굉장히 좋다는 이야기를 듣고 그럼 게시판을 만들겸 로그인과 회원가입외 기타 필요한 부분들을 만들어 보자! 해서 만들게 된 익명 게시판 입니다!!

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="30dp"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="vertical">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColor="@color/blue_4"
            android:textStyle="bold"
            android:textSize="30dp"
            android:text="익명 게시판"/>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColor="@color/blue_3"
            android:textSize="10dp"
            android:text="로그인을 해주세요."/>

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="vertical">

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColorHint="@color/blue_3"
            android:backgroundTint="@color/blue_5"
            android:drawableLeft="@drawable/drawable_badge"
            android:drawablePadding="10dp"
            android:textSize="15dp"
            android:layout_marginBottom="20dp"
            android:hint="아이디를 입력해주세요."/>

        <EditText
            android:id="@+id/dra"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textColorHint="@color/blue_3"
            android:backgroundTint="@color/blue_5"
            android:textSize="15dp"
            android:drawableLeft="@drawable/drawable_key"
            android:drawablePadding="10dp"
            android:inputType="textPassword"
            android:hint="비밀번호를 입력해주세요."/>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <CheckBox
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="@color/blue_3"
                android:text="로그인 상태 유지"/>

        </LinearLayout>

    </LinearLayout>


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center"
        android:orientation="vertical">

        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/blue_4"
            android:text="로그인 하기"
            android:textColor="@color/white"
            />

        <TextView
            android:id="@+id/sign_upButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="30dp"
            android:gravity="center"
            android:textColor="@color/blue_3"
            android:text="회원가입"/>

        <TextView
            android:id="@+id/finding_id"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:layout_marginTop="20dp"
            android:layout_marginBottom="20dp"
            android:textColor="@color/blue_3"
            android:text="아이디 찾기"/>

        <TextView
            android:id="@+id/finding_pass"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:textColor="@color/blue_3"
            android:text="비밀번호 찾기"/>
        
    </LinearLayout>

</LinearLayout>

잠깐 소스 코드 설명을 하자면 다른 부분은 그렇게 어렵지 않겠지만 EditText 부분에 android:drawableLeft,
android:drawablePadding 은 바로 검적색 아이콘을 넣기위해 사용하기위해 설정한 부분입니다! drawableLeft 같은 경우는 EditText의 옆에 아이콘이 놓여지게 해라 이런 의미이며 Right로 바꾸게 되면 오른쪽으로 넘어가게 됩니다! 그리고 padding은 아이콘에 padding 사이즈를 줌으로 사용자가 텍스트를 입력할때 아이콘에 너무 가깝게 붙여서 입력이 되지 않게 하기 위해 텍스트를 주었습니다!

그리고 따로 아이콘의 크기를 줄이기 위해 drawable에 xml을 추가하고 이미지 파일을 사진처럼 설정해 줘서 이미지의 크기를 줄였습니다! 

 

아직까지는 로그인, 회원가입, 아이디 찾기, 비밀번호 찾기 UI와 Intent 설정밖에 하지 못 했지만 점점 더 다양한 기능을 만들어서 소개해드리도록 할 게요!!