[모바일 프로그래밍 과제] - 5주차 (직접풀어보기 6 - 1)

1. 과제 안내문, 예시 출력화면

---

과제 #5

직접 풀어보기 6-1 (자세한 사항은 교재를 참고할 것)

실습 6-1을 다음과 같이 수정하라.

1) 캘린더뷰 대신 데이트피커를 사용하여 날짜를 설정한다.

2) <예약시작>과 <예약완료> 버튼을 제거한다. 대신 <예약시작> 기능은 크로노미터를 클릭하면 동작하게 하고, <예약완료> 기능은 아래쪽 연도를 롱클릭하면 동작하게 한다.

3) 처음에는 라디오버튼, 데이트피커, 타임피커가 안 보이도록 설정하고, 크로노미터를 클릭하면 라디오버튼이 나타난다. 라디오버튼을 클릭하면 피커가 표시된다. 아래쪽 연도를 롱클릭하면 라디오버튼, 데이트피커, 타임피커가 사라진다.

구현방법 참고:

- <예약시작> 버튼에서 했던 작업은 크로노미터의 리스너를 만들어 거기로 이동함

- <예약완료> 버튼의 작업은 tvYear에 OnLongClickListener를 작성하여 거기로 이동함

- CalendarView에 작성했던 OnDateChangeListener는 불필요함

- 대신 날짜를 얻기 위해서는 DatePicker에 대해 getYear(), getMonth(), getDayOfMonth() 등의 메소드를 사용하면 됨

(제출방법: activity_main.xml, MainActivity.java 파일 및 실행하여 단계별로 캡춰한 사진들을 zip 포맷으로 압축하여 제출함)

---

  이번 과제는 교수님이 대놓고 말씀하셨다. "모르는 지식을 찾는 능력도 코딩에 필요한 능력입니다." 이 말에는 전적으로 동의한다.  때문에 이번 과제에 사용되는 데이트 피커에 관한 내용은 구글링을 통해 해결하였다. 다음은 풀이 과정이다.

 

2. 풀이과정

 

 레이아웃 부분으로 특이한 점은 없다고 생각한다. 조금 중요한 점은 FrameLayout을 이용해 두개의 위젯을 겹치게 배치하고 라디오 버튼의 선택 유무에 따라 보여줄지 안 보여줄지를 설정해야 한다는 것이다. 다음은 배치코드이다.

 

- 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=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#CCCCCC"
        android:orientation="vertical">

        <Chronometer
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/chronometer1"
            android:format="예약에 걸린 시간 %s"
            android:gravity="center"
            android:textSize="20dp"
            />

    </LinearLayout>
    <RadioGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
        <RadioButton
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/rdoCal"
            android:text="날짜 설정 (캘린더 뷰)"/>
        <RadioButton
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/rdoTime"
            android:text="시간 설정"/>
    </RadioGroup>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center">

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <DatePicker
                android:id="@+id/datePicker1"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:datePickerMode="spinner" />

            <TimePicker
                android:id="@+id/timePicker1"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:timePickerMode="spinner" />
        </FrameLayout>
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#CCCCCC"
        android:gravity="center"
        android:orientation="horizontal">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/tvYear"
            android:text="0000"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="년"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/tvMon"
            android:text="00"
            />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="월"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="00"
            android:id="@+id/tvDate"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="일"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="00"
            android:id="@+id/tvTime"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="시"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/tvMin"
            android:text="00"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="분"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text=" 예약됨"/>
    </LinearLayout>
</LinearLayout>

 

 아직 프레임레이아웃과 리너레이앙ㅅ에 대한 이해가 부족하다는 것을 알게 되었다. 정리해서 다른 카테고리에 올렸으면 좋겠다. 다음은 자바 코드이다.

 

  자바코드에서 추가한 부분은, 현재 앱이 작동한 당일 날짜를 데이터 피커의 디폴트 값으로 설정한 것이다. 당일 날짜를 불러오는 코드는 다음과 같다.

 

Date currentTime = Calendar.getInstance().getTime();
SimpleDateFormat dayFormat = new SimpleDateFormat("dd", Locale.getDefault());
SimpleDateFormat monthFormat = new SimpleDateFormat("MM", Locale.getDefault());
SimpleDateFormat yearFormat = new SimpleDateFormat("yyyy", Locale.getDefault());

int year = Integer.parseInt(yearFormat.format(currentTime));
int month = Integer.parseInt(monthFormat.format(currentTime));
int day = Integer.parseInt(dayFormat.format(currentTime));

 

 참고할 점이 있다면 yearFormat.format(currentTume)의 반환형은 문자열이다. 그러나 데이터피커의 init()메소드의 인자로 넣어야하는 값은 정수임으로 자료형을 정수로 변경하였다.다음은 전체 코드이다.

 

- Java코드

 

package com.cookandroid.do6_1;

import androidx.appcompat.app.AppCompatActivity;

import android.graphics.Color;
import android.os.Bundle;
import android.os.SystemClock;
import android.view.View;
import android.widget.Chronometer;
import android.widget.DatePicker;
import android.widget.RadioButton;
import android.widget.TextView;
import android.widget.TimePicker;

import java.text.SimpleDateFormat;
import java.util.Calendar;
import java.util.Date;
import java.util.Locale;

public class MainActivity extends AppCompatActivity {

    Chronometer chro;
    RadioButton rdoCalender, rdoTime;
    DatePicker datePicker;
    TimePicker timePicker;
    TextView tvYear, tvMonth, tvDay, tvHour, tvMinute;
    int selectYear, selectMonth, selectDay;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        chro = (Chronometer)findViewById(R.id.chronometer1);
        rdoCalender = (RadioButton)findViewById(R.id.rdoCal);
        rdoTime = (RadioButton)findViewById(R.id.rdoTime);
        datePicker = (DatePicker)findViewById(R.id.datePicker1);
        timePicker = (TimePicker)findViewById(R.id.timePicker1);
        tvYear = (TextView)findViewById(R.id.tvYear);
        tvDay = (TextView)findViewById(R.id.tvDate);
        tvHour = (TextView)findViewById(R.id.tvTime);
        tvMinute = (TextView)findViewById(R.id.tvMin);
        tvMonth = (TextView)findViewById(R.id.tvMon);

        timePicker.setVisibility(View.INVISIBLE);
        datePicker.setVisibility(View.INVISIBLE);
        rdoCalender.setVisibility(View.INVISIBLE);
        rdoTime.setVisibility(View.INVISIBLE);

        chro.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                rdoCalender.setVisibility(View.VISIBLE);
                rdoTime.setVisibility(View.VISIBLE);
                chro.start();
                chro.setBase(SystemClock.elapsedRealtime());
                chro.setTextColor(Color.RED);
            }
        });

        rdoTime.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                timePicker.setVisibility(View.VISIBLE);
                datePicker.setVisibility(View.INVISIBLE);
            }
        });

        rdoCalender.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                timePicker.setVisibility(View.INVISIBLE);
                datePicker.setVisibility(View.VISIBLE);
            }
        });

        Date currentTime = Calendar.getInstance().getTime();
        SimpleDateFormat dayFormat = new SimpleDateFormat("dd", Locale.getDefault());
        SimpleDateFormat monthFormat = new SimpleDateFormat("MM", Locale.getDefault());
        SimpleDateFormat yearFormat = new SimpleDateFormat("yyyy", Locale.getDefault());

        int year = Integer.parseInt(yearFormat.format(currentTime));
        int month = Integer.parseInt(monthFormat.format(currentTime));
        int day = Integer.parseInt(dayFormat.format(currentTime));

        datePicker.init(year, month - 1, day, new DatePicker.OnDateChangedListener() {
            @Override
            public void onDateChanged(DatePicker datePicker, int i, int i1, int i2) {
                selectYear = i;
                selectMonth = i1 + 1;
                selectDay = i2;
            }
        });

        tvYear.setOnLongClickListener(new View.OnLongClickListener() {
            @Override
            public boolean onLongClick(View view) {
                chro.stop();
                chro.setTextColor(Color.BLUE);
                tvYear.setText(Integer.toString(selectYear));
                tvMonth.setText(Integer.toString(selectMonth));
                tvDay.setText(Integer.toString(selectDay));
                tvHour.setText(Integer.toString(timePicker.getCurrentHour()));
                tvMinute.setText(Integer.toString(timePicker.getCurrentMinute()));
                timePicker.setVisibility(View.INVISIBLE);
                datePicker.setVisibility(View.INVISIBLE);
                rdoCalender.setVisibility(View.INVISIBLE);
                rdoTime.setVisibility(View.INVISIBLE);
                return false;
            }
        });

    }
}

 

 다음은 실행 결과이다.

 

- 실행화면

 

다음은 단계별로 캡쳐한 실행 결과이다.

---

---