[Android Studio] 날씨와 시간 위젯 | 자동완성 텍스트뷰 위젯 | 진행상태 표시 위젯

---

1.  날짜와 시간 관련 위젯

날짜와 시간과 관련된 위젯으로는 타임피커, 데이트피커, 캘린더뷰, 크로노미터, 아날로그시계, 디지털시계 등이 있음

 

1)  아날로그시계와 디지털시계

 

🤓  아날로그 시계 AnalogClock와 디지털시계 DigitalClock는 화면에 시간을 표시하는 위젯으로 시계를 표현하는 용도로 쓰임. 이 둘은 View 클래스에서 상속받기 때문에 background 속성들을 설정할 수 있음. 디지털 시계는 textColor 같은 속성도 설정할 수 있음.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <AnalogClock
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <DigitalClock
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center" />

</LinearLayout>

 

---

2)  크로노미터

 

크로노미터 Chronometer는 타이머 형식의 위젯이며 일반적으로 시간을 측정할 때 많이 사용
사용되는 메서드로는 start(), stop(), reset() 등이 있는데 이는 각각 크로노미터를 시작, 정지, 초기화.

 

android:format="시간 측정 : %s"
  ➡️ format 속성에서 타이머 앞의 문자열을 지정

<Chronometer
        android:id="@+id/chronometer1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:format="시간 측정 : %s"
        android:gravity="center"
        android:textSize="30dp" />

 

---

3) 타임피커, 데이트피커, 캘린더뷰

타임피커 TimePicker는 시간을, 데이트피커 DatePicker와 캘린더뷰 CalendarView는 날짜를 표시하고 조절하는 기능을
함
    ⚡️  캘린더뷰는 XML 속성이 여러가지인데, 그중에서 디폴트가 true인 showWeekNumber 속성은 현재 몇 주 차인지를 각주
의 맨 앞에 출력. 하지만 showWeekNumber 속성은 false로 하는 것이 더 깔끔하고 보기 좋음

롤리팝 API21 이후부터 타임피커와 데이트피커의 모양이 대폭 변경

 

  📍  이전 모양의 버전을 사용하려면
        타임피커는 android:timePickerMode="spinner" 속성을,
        데이트피커는 android:datePickerMode="spinner" 속성을 추가

    <TimePicker
        android:timePickerMode="spinner"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

    <DatePicker
        android:datePickerMode="spinner"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

---

2.  기타 위젯

1)  자동완성텍스트뷰와 멀티자동완성텍스트뷰

 

자동완성텍스트뷰 AutoCompleteTextView와 멀티자동완성텍스트뷰 MultiAutoCompleteTextView는 텍스트뷰 보다는 에디트텍스트 속성이 더 강함.  사용자가 단어의 일부만 입력해도 자동 완성되는데, 자동완성텍스트뷰는 단어 1개가 자동 완성되고, 멀티자동완성텍스트뷰는 쉼표(,)로 구분하여 여러 개의 단어가 자동 완성.

  ✓  자동 완성 단어는 주로 Java 코드에서 배열로 설정하며 setAdapter() 메서드를 사용
  ✓  completionHint : XML 속성 줌 목록에 나타날 힌트

  ✓  completionThreshold : 자동 완성 시작되기 전에 사용자가입력해야 하는 최소 문자 수

   <AutoCompleteTextView
        android:id="@+id/autoCompleteTextView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:completionHint="선택하세요"
        android:completionThreshold="2"
        android:hint="자동완성텍스트뷰">
    </AutoCompleteTextView>

    <MultiAutoCompleteTextView
        android:id="@+id/multiAutoCompleteTextView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:completionHint="선택하세요"
        android:completionThreshold="2"
        android:hint="멀티자동완성텍스트뷰">
    </MultiAutoCompleteTextView>

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.layout_04)

        // 자동완성텍스트뷰의 Java코드
        val items = arrayOf("CSI-뉴욕", "CSI-라스베가스", "CSI-마이애미", "Friend", "Fringe", "Lost")
        val auto = findViewById<AutoCompleteTextView>(R.id.autoCompleteTextView1)
        val adapter = ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, items)
        auto.setAdapter(adapter)

        val multi = findViewById<MultiAutoCompleteTextView>(R.id.multiAutoCompleteTextView1)
        val tokenizer = MultiAutoCompleteTextView.CommaTokenizer()
        multi.setTokenizer(tokenizer)
        multi.setAdapter(adapter)

    }
}

 

val items = arrayOf("CSI-뉴욕", "CSI-라스베가스", "CSI-마이애미", "Friend", "Fringe", "Lost")

     > 자동 완성될 문자열을 배열로 정의

val adapter = ArrayAdapter<String>(this, android.R.layout.simple_dropdown_item_1line, items)

    > ArrayAdapter는 뷰와 데이터를 연결

    > 자동완성텍스트뷰와 items를 연결하는 역할을 하여 자동완성텍스트뷰에 items 배열의 내용이 출력
    > 생성자의 두 번째 파라미터는 목록이 출력될 모양을 결정. simple_dropdown_item_1line 외에도 다양한 모양을 선택할 수 있음

val tokenizer = MultiAutoCompleteTextView.CommaTokenizer()
multi.setTokenizer(tokenizer)
multi.setAdapter(adapter)

    > 쉼표로 구분하기 위한 객체를 생성하고 멀티자동완성텍스트 뷰에 설정

 

 

---

 

2) 프로그레스바, 시크바, 레이팅바

 

프로그레스바, 시크바, 레이팅바는 진행 상태를 표시하는 기능

 

 프로그레스바 ProgressBar

 

  🚀  작업의 진행 상태를 바 Bar 또는 원 형태로 제공
  🚀  바 형태는 어느 정도 진행되었는지를 확인할 수 있지만, 원 형태는 현재 진행 중이라는 상태만 보여줌
  🚀  주로 사용되는 XML 속성에는 범위를 지정하는 max, 시작 지점을 지정하는 progress,
         두 번째 프로그레스바를 지정하는 secondaryProgress 등이 있음

 

시크바 SeekBar

  🚀  프로그레스바의 하위 클래스로, 프로그레스바와 대부분 비슷하며 사용자가 터치로 임의 조절이 가능
  🚀  음량을 조정하거나 동영상 재생 시 사용자가 재생 위치를 지정하는 용도로 사용할 수 있음

 

레이팅바 RatingBar

  🚀  진행 상태를 별 모양으로 표시. 프로그레스바의 하위 클래스이므로 사용법이 비슷하며 서적, 음악, 영화 등에 대한 선호도를 나타낼 때 주로 사용
  🚀  별의 개수를 정하는 numStars, 초깃값을 지정하는 rating, 한 번에 채워지는 개수를 정하는 stepSize 속성이 주로 사용

 

   <ProgressBar style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="20dp"
        android:max="100"
        android:progress="20"
        android:secondaryProgress="50" />

    <SeekBar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="20dp"
        android:progress="20" />

    <RatingBar
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"    
        android:layout_margin="20dp"
        android:numStars="5"
        android:rating="1.5"
        android:stepSize="0.5" />

 

style="?android:attr/progressBarStyleHorizontal"
> 프로그레스바의 모양을 지정. 이 스타일을 생략하면 원 모양이 나타남

    

android:max="100"
android:progress="20"
 > 프로그레스바의 범위를 최대 100으로 설정하고, 초깃값을 20으로 설정.

   

android:secondaryProgress="50"
> 프로그레스바의 보조 프로세스 초깃값을 50으로 설정. 메인 프로그레스보다 흐리게 표시.

    

android:numStars="5"
> 별의 개수를 설정. 디폴트는 5개.

 

android:rating="1.5"
> 초깃값을 설정. 1.5개가 채워진 상태로 표현.

 

android:stepSize="0.5"
> 한 스탭의 크기를 지정. 이 경우에는 별이 5개이므로 총 열 번의 스탭으로 구성.

 

 

 

 

 

[ 내용 참고 : IT 학원 강의 ]