짱짱해커가 되고 싶은 나

06-1. 시간 관련 위젯 본문

모바일

06-1. 시간 관련 위젯

동로시 2021. 2. 17. 16:39

오우~ 고~급 위젯..!😋

 

* 아날로그 시계 & 디지털 시계

화면에 시간을 표시하는 위젯 (widget.AnalogClock/ widget.TextView-widget.DigitalClock)

 

아날로그 시계 & 디지털 시계

 

* 크로노미터(Chronometer)

타이머 형식의 위젯이며 보통 시간을 측정할 때 많이 사용. (widget.TextView)

- format : 타이머 앞의 문자열 지정 (%s = 분:초/시:분:초 형식으로 출력) ex)format="시간 = %s"

 

* 타임피커 & 데이트피커 & 캘린더뷰

타임피커(TimePicker) : 시간을 표시하고 조절

데이트피커(DatePicker) : 날짜를 표시하고 조절

캘린더뷰(CalenderView) : 날짜를 표시하고 조절

- showWeekNumber : 현재 몇 주 차인지 맨 앞에 출력 (default: true)

TimePicker & DatePicker

 

프로젝트1 : 날짜/시간 예약

예약에 걸린 시간 : 예약 시간, 예약 완료를 클릭하면 타이머 동작

날짜/시간 설정 : 해당 버튼을 누르면 예약한 날짜와 시간 변경 가능(택1)

예약 완료: 설정한 날짜와 시간 결정

 

LinearLayout1(예약시작) , 라디오그룹,  LinearLayout2(FrameLayout - CalenderView, TimePicker), LinearLayout3(예약 완료)

Chronometer 1개

Button 2개 - 예약 시작, 예약 완료

RadioGroup 1개 - RadioButton2(날짜 설정/시간 설정)

TextView 10개 - 예약된 날짜와 시간 출력 (YYYY) (년) (M) (월) (D) (일) (S) (시) (MM) (분 예약함)

 

<activity_main.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:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

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

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

        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="예약 시작"
            android:layout_margin="5dp"
            android:gravity="center"
            android:id="@+id/start"/>

    </LinearLayout>

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

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

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <CalendarView
                android:id="@+id/cal"
                android:showWeekNumber="false"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"/>
            <TimePicker
                android:id="@+id/timePicker"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"/>
        </FrameLayout>
    </LinearLayout>

    <LinearLayout
        android:background="#cccccc"
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="예약 완료"
            android:padding="5dp"
            android:id="@+id/end"/>

        <TextView
        	android:paddingLeft="5dp"
            android:id="@+id/t1"
            android:text="0000"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:text="년"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:id="@+id/t2"
            android:text="00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="월"/>
        <TextView
            android:id="@+id/t3"
            android:text="00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="일"/>
        <TextView
            android:id="@+id/t4"
            android:text="00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="시"/>
        <TextView
            android:id="@+id/t5"
            android:text="00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="분에 예약됨"/>

    </LinearLayout>
</LinearLayout>

FrameLayout의 크기가 마지막에 예약완료(height는 wrap_content) 그 한 줄을 빼고 나머지 부분의 높이를 모두 다 채우게 하기 위해서

FrameLayout을 포함한 리니어레이아웃의 height를 parent로 하고, weight=1을 준다.

 

<MainActivity.java>

package com.example.widget4;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;

import android.graphics.Color;
import android.os.Bundle;
import android.os.SystemClock;
import android.view.MotionEvent;
import android.view.View;
import android.widget.Button;
import android.widget.CalendarView;
import android.widget.Chronometer;
import android.widget.EditText;
import android.widget.LinearLayout;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.TextView;
import android.widget.TimePicker;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
    Chronometer timer;
    Button start, end;
    RadioGroup rGroup;
    RadioButton rbtn1, rbtn2;
    CalendarView cal;
    TimePicker timePicker;
    TextView[] textViews = new TextView[5];
    Integer[] textViewId = {R.id.t1, R.id.t2, R.id.t3, R.id.t4, R.id.t5};
    Integer t_year, t_month, t_day;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        setTitle("시간 예약");

        timer = (Chronometer)findViewById(R.id.timer);
        start = (Button)findViewById(R.id.start);
        end = (Button)findViewById(R.id.end);
        rGroup = (RadioGroup)findViewById(R.id.rGroup);
        rbtn1 = (RadioButton)findViewById(R.id.rbtn1);
        rbtn2 = (RadioButton)findViewById(R.id.rbtn2);
        cal = (CalendarView)findViewById(R.id.cal);
        timePicker = (TimePicker)findViewById(R.id.timePicker);
        for(int i=0; i<textViewId.length; i++)
            textViews[i] = (TextView)findViewById(textViewId[i]);

        cal.setVisibility(View.INVISIBLE);
        timePicker.setVisibility(View.INVISIBLE);
        rGroup.clearCheck();

        rGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                if(checkedId == R.id.rbtn1){
                    cal.setVisibility(View.VISIBLE);
                    timePicker.setVisibility(View.INVISIBLE);
                }
                else if(checkedId == R.id.rbtn2){
                    cal.setVisibility(View.INVISIBLE);
                    timePicker.setVisibility(View.VISIBLE);
                } else{
                    cal.setVisibility(View.INVISIBLE);
                    timePicker.setVisibility(View.INVISIBLE);
                }
            }
        });

        start.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                timer.setBase(SystemClock.elapsedRealtime());
                timer.start();
                timer.setTextColor(Color.RED);
            }
        });

        end.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                timer.stop();
                timer.setTextColor(Color.BLUE);
                textViews[0].setText(Integer.toString(t_year));
                textViews[1].setText(Integer.toString(t_month));
                textViews[2].setText(Integer.toString(t_day));
                textViews[3].setText(Integer.toString(timePicker.getCurrentHour()));
                textViews[4].setText(Integer.toString(timePicker.getCurrentMinute()));
            }
        });

        cal.setOnDateChangeListener(new CalendarView.OnDateChangeListener() {
            @Override
            public void onSelectedDayChange(@NonNull CalendarView view, int year, int month, int dayOfMonth) {
                t_year = year;
                t_month = month+1;
                t_day = dayOfMonth;
            }
        });

    }
}

Cronometer를 시작할 때는 base를 현재 시간으로 설정하고 start()를 하면 된다. 종료할 때는 end()

calendarView에서 달은 0부터 시작하기 때문에 실제 달을 가져올때는 +1을 해야한다.

 

프로젝트1

 

프로젝트2 : 날짜/시간 예약 수정

데이터피커 : 날짜 설정/ 타임 피커 : 시간 설정

크로노미터 클릭 (시작) -> 텍스트뷰의 연도를 길게 누름 (종료)

크로노미터 클릭 전: 설정/버튼 안보임

연도 길게 누른 후: 설전/버튼 안보임

 

<activity_main.java>

<?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:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

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

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

    </LinearLayout>

    <RadioGroup
        android:id="@+id/rGroup"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <RadioButton
            android:id="@+id/rbtn1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="날짜 설정">
        </RadioButton>
        <RadioButton
            android:id="@+id/rbtn2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="시간 설정">
        </RadioButton>
    </RadioGroup>

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

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <DatePicker
                android:layout_gravity="center"
                android:datePickerMode="spinner"
                android:id="@+id/datePicker"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>
            <TimePicker
                android:layout_gravity="center"
                android:timePickerMode="spinner"
                android:id="@+id/timePicker"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>
        </FrameLayout>
    </LinearLayout>

    <LinearLayout
        android:gravity="center"
        android:background="#cccccc"
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <TextView
            android:id="@+id/t1"
            android:text="0000"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:text="년"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:id="@+id/t2"
            android:text="00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="월"/>
        <TextView
            android:id="@+id/t3"
            android:text="00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="일"/>
        <TextView
            android:id="@+id/t4"
            android:text="00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="시"/>
        <TextView
            android:id="@+id/t5"
            android:text="00"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="분에 예약됨"/>

    </LinearLayout>
</LinearLayout>

 

<MainActivity.java>

package com.example.widget4;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;

import android.graphics.Color;
import android.os.Bundle;
import android.os.SystemClock;
import android.view.MotionEvent;
import android.view.View;
import android.widget.Button;
import android.widget.CalendarView;
import android.widget.Chronometer;
import android.widget.DatePicker;
import android.widget.EditText;
import android.widget.LinearLayout;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.TextView;
import android.widget.TimePicker;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
    Chronometer timer;
    RadioGroup rGroup;
    RadioButton rbtn1, rbtn2;
    DatePicker datePicker;
    TimePicker timePicker;
    TextView[] textViews = new TextView[5];
    Integer[] textViewId = {R.id.t1, R.id.t2, R.id.t3, R.id.t4, R.id.t5};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        setTitle("시간 예약(수정)");

        timer = (Chronometer)findViewById(R.id.timer);
        rGroup = (RadioGroup)findViewById(R.id.rGroup);
        rbtn1 = (RadioButton)findViewById(R.id.rbtn1);
        rbtn2 = (RadioButton)findViewById(R.id.rbtn2);
        datePicker = (DatePicker)findViewById(R.id.datePicker);
        timePicker = (TimePicker)findViewById(R.id.timePicker);
        for(int i=0; i<textViewId.length; i++)
            textViews[i] = (TextView)findViewById(textViewId[i]);

        rGroup.clearCheck();
        rGroup.setVisibility(View.INVISIBLE);
        datePicker.setVisibility(View.INVISIBLE);
        timePicker.setVisibility(View.INVISIBLE);

        rGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                if(checkedId == R.id.rbtn1){
                    datePicker.setVisibility(View.VISIBLE);
                    timePicker.setVisibility(View.INVISIBLE);
                }
                else if(checkedId == R.id.rbtn2){
                    datePicker.setVisibility(View.INVISIBLE);
                    timePicker.setVisibility(View.VISIBLE);
                } else{
                    datePicker.setVisibility(View.INVISIBLE);
                    timePicker.setVisibility(View.INVISIBLE);
                }
            }
        });

        timer.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                timer.setBase(SystemClock.elapsedRealtime());
                timer.start();
                timer.setTextColor(Color.RED);
                rGroup.setVisibility(View.VISIBLE);
            }
        });

        textViews[0].setOnLongClickListener(new View.OnLongClickListener() {
            @Override
            public boolean onLongClick(View v) {
                timer.stop();
                timer.setTextColor(Color.BLUE);
                textViews[0].setText(Integer.toString(datePicker.getYear()));
                textViews[1].setText(Integer.toString(datePicker.getMonth()+1));
                textViews[2].setText(Integer.toString(datePicker.getDayOfMonth()));
                textViews[3].setText(Integer.toString(timePicker.getCurrentHour()));
                textViews[4].setText(Integer.toString(timePicker.getCurrentMinute()));
                rGroup.setVisibility(View.INVISIBLE);
                rGroup.clearCheck();
                return false;
            }
        });
    }
}

예약 시작
예약 완료

'모바일' 카테고리의 다른 글

06-3. 뷰 컨테이너  (0) 2021.02.19
06-2. 기타 위젯  (0) 2021.02.17
05-1. 레이아웃  (0) 2021.02.17
04-5. 위젯3  (0) 2021.02.16
04-4. 위젯2  (0) 2021.02.16
Comments