[Android 개발] Todo List 메인 화면 제작 스타일 적용

 

 

 

저번시간에 학습했던 Todo List CSS 적용 편이다. 학습하고 있는 공부의 예제이다.

2022.11.24 - [개발 언어/Java] - [Android 개발] 안드로이드 RecyclerView(Adapter) 예제 코드 - Todo List 기본 틀

[Android 개발] 안드로이드 RecyclerView(Adapter) 예제 코드 - Todo List 기본 틀

 

 

 

일단 전체적인 배열은 아래와같다. 위에 캘린더를 누르면 달력으로 이동하는 기능을 추가할 예정이다. 

캘린더는 IMG 로 삽입했으며 체크박스는 안드로이드 내에 있는 기본 아이콘을 활용했다.

아래 여백은 View를 활용해 만들었다. 

 

 

아래 버튼의 경우 유투브에서 마음에 드는 버튼 형식을 찾은 후 따라 한 방법이다. 

https://www.youtube.com/watch?v=AZX-eI8vAps 

 

 

다음은 적용한 예제 코드이다.

<?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:background="#F6EFEF"
    android:orientation="vertical"
    tools:context="com.example.todoapplication.ListActivity">


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

        <TextView
            android:id="@+id/main_title"
            android:layout_width="238dp"
            android:layout_height="39dp"
            android:layout_marginLeft="100dp"
            android:text="TodoList"
            android:textSize="20sp" />

        <android.widget.Button
            android:id="@+id/Calendar_btn"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:accessibilityLiveRegion="none"
            android:foreground="@drawable/img"
            tools:ignore="SpeakableTextPresentCheck">

        </android.widget.Button>
    </LinearLayout>

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/main_list"
        android:layout_width="match_parent"
        android:layout_height="472dp"
        android:layout_marginTop="20dp"
        android:background="#FFFFFF">

    </androidx.recyclerview.widget.RecyclerView>

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

        <EditText
            android:id="@+id/main_input"
            android:layout_width="226dp"
            android:layout_height="60dp"
            android:layout_marginLeft="100dp"
            android:layout_marginTop="15dp"
            android:ems="10"
            android:inputType="textPersonName"
            android:minHeight="48dp"
            tools:ignore="SpeakableTextPresentCheck" />

        <android.widget.Button
            android:id="@+id/main_bnt"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_marginStart="12dp"
            android:layout_marginTop="15dp"
            android:layout_marginEnd="108dp"
            android:layout_marginBottom="17dp"
            android:accessibilityLiveRegion="none"
            android:background="@drawable/round_button"
            android:text="add"
            android:textColor="#fff"
            android:textSize="16dp" />

    </LinearLayout>

    <View
        android:id="@+id/view2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1" />

</LinearLayout>

 

 

 

RecycleView에 들어가는 아이템같은 경우 아래와 같이 사용하였다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/view"
    android:layout_width="match_parent"
    android:layout_height="60dp"
    android:padding="10dp"
    android:orientation="horizontal"
    >
    <CheckBox
        android:id="@+id/item_btn"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginLeft="20dp"
        android:layout_gravity="center"
        />

    <TextView
        android:id="@+id/item_title"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_marginLeft="10dp"
        android:textSize="18sp"
        android:paddingTop="5dp"
        android:paddingLeft="5dp"
        android:layout_gravity="center"
        android:layout_marginRight="20dp"
        android:layout_weight="1"
        />


</LinearLayout>