[Android] 안드로이드 시간, 날짜 특집4 ( Stopwatch, Calendar, TimePicker )

👼🏻 초보 안드로이드 개발자가 매번 구글링하기 싫어서 정리하는 블로그 👼🏻 

 

안녕하세요!!

안드로이드 시간, 날짜  특집 마지막!!!!!

이것 저것 위젯 많이 써서 한번 해보겠습니다!!! ㅎㅎ

사용되는 위젯은

Chronometer, RadioGroup, RadioButton, FrameLayout, CalendarView, TimePicker

이렇게 사용 될 예정이에요!! 많네용ㅎㅎ

 

위젯 간단 사용법 링크 첨부할게요! 간단한거 보고 싶으면 보고오세요!

 

[Android] 안드로이드 시간, 날짜 특집1 ( Stopwatch )

 

[Android] RadioButton 간단 사용법(feat. strings.xml)

 

 

[Android] FrameLayout 간단 사용법2

 

[Android] 안드로이드 시간, 날짜 특집2 ( Calendar )

 

[Android] 안드로이드 시간, 날짜 특집3 ( TimePicker )

 

( ❤️‍🩹 어차피 제 예제들은 다.. 간단한거라... 이 글만 봐도.. 이해.. 되실 수도.. 있어요.. )

 

자! 그럼 시작 하기 전에 이번엔 구현 연상을 먼저 볼게요!!

 

 

 

1️⃣  예약시작의 버튼을 누름과 동시에 스탑워치 시작

2️⃣  날짜설정과 시간설정은 동시 선택이 불가능하게 라디오버튼으로 진행

3️⃣  날짜설정은 캘린더뷰를 사용해서 날짜 선택

4️⃣  시간설쩡은 타임피커를 사용해서 시간 선택

5️⃣  선택완료버튼을 누름과 동시에 스탑워치 끝, 캘린더뷰와 타임피커에서 선택한 값 텍스트로 출력

 

이런 흐름으로 코드를 구현해보았습니다!

 

언제나 뷰부터 한번 그려봅시다!

반응형

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    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"
    android:padding="20dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        >
        <Chronometer
            android:id="@+id/chronometer"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:format="예약에 걸린 시간 %s"
            android:gravity="center"
            android:text="20dp"
            />
        <Button
            android:id="@+id/btn_start"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="예약시작"
            />
    </LinearLayout>

    <RadioGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        >
        <RadioButton
            android:id="@+id/rdo_Cal"
            android:layout_width="0px"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="날짜 설정"
            />
        <RadioButton
            android:id="@+id/rdo_time"
            android:layout_width="0px"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="시간 설정"
            />
    </RadioGroup>

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

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center">

            <CalendarView
                android:id="@+id/calendar"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                />

            <TimePicker
                android:id="@+id/timePicker"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:timePickerMode="spinner"
                />
        </FrameLayout>
    </LinearLayout>

    <Button
        android:id="@+id/btn_end"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="선택완료"/>

    <TextView
        android:id="@+id/tv_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#cccccc"
        android:gravity="center"
        android:text="0000년 00월 00일"
        android:textSize="20dp"
        android:padding="5dp"/>

</LinearLayout>

 

라디오버튼을 사용할거이기에 프래임레이아웃으로 처리해주었습니다!!!

 

자 이제 코드로 넘어가볼게요!

SMALL

MainActivity

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

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    // 전역변수선언
    Chronometer chronometer;
    Button btn_start, btn_end;
    RadioButton rdo_Cal, rdo_time;
    CalendarView calendar;
    TimePicker timePicker;
    TextView tv_text;

    int selectY, selectM, selectD, selectH, selectMi;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // xml 과 연결
        chronometer = findViewById(R.id.chronometer);
        btn_start = findViewById(R.id.btn_start);
        btn_end = findViewById(R.id.btn_end);
        rdo_Cal = findViewById(R.id.rdo_Cal);
        rdo_time = findViewById(R.id.rdo_time);
        calendar = findViewById(R.id.calendar);
        timePicker = findViewById(R.id.timePicker);
        tv_text = findViewById(R.id.tv_text);

        // 처음엔 안보이게
        calendar.setVisibility(View.INVISIBLE);
        timePicker.setVisibility(View.INVISIBLE);
        tv_text.setVisibility(View.GONE);

        // 버튼 클릭리스너
        btn_start.setOnClickListener(this::onClick);
        btn_end.setOnClickListener(this::onClick);

        // 라디오버튼 클릭리스너
        rdo_Cal.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                calendar.setVisibility(View.VISIBLE);
                timePicker.setVisibility(View.INVISIBLE);
            }
        });
        rdo_time.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                calendar.setVisibility(View.INVISIBLE);
                timePicker.setVisibility(View.VISIBLE);
            }
        });

        // calendar 클릭 이벤트
        calendar.setOnDateChangeListener(new CalendarView.OnDateChangeListener() {
            @Override
            public void onSelectedDayChange(@NonNull CalendarView calendarView, int year, int month, int day) {
                selectY = year;
                selectM = month + 1;
                selectD = day;
            }
        });
        
        // timePicker 클릭이벤트
        timePicker.setOnTimeChangedListener(new TimePicker.OnTimeChangedListener() {
            @Override
            public void onTimeChanged(TimePicker timePicker, int hour, int minute) {
                selectH = hour;
                selectMi = minute;
            }
        });

    }
    
    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.btn_start:
                chronometer.setBase(SystemClock.elapsedRealtime());
                chronometer.start();
                chronometer.setTextColor(Color.BLUE);
                break;
            case R.id.btn_end:
                chronometer.stop();
                chronometer.setTextColor(Color.RED);
                tv_text.setVisibility(View.VISIBLE);
                tv_text.setText(selectY + "년 " + selectM + "월 " + selectD + "일 " + selectH + "시 " + selectMi + "분 선택완료");
                break;
        }
    }
}

 

 

코드를 다 작성해보았어요!!!

이런 방식으로 예약관련 어플에 적용하면 아주 간단히 손 쉽게 할 수 있겟죠??? ㅎㅎ

 

봐주셔서 감사합니다!