안드로이드스튜디오

안드로이드 주요 UI 요소 및 활용 방법

연습노트 2024. 9. 15. 22:48

안드로이드 주요 UI 요소 및 활용 방법

1. 이미지와 비디오 추가

  • ImageView (이미지뷰)
    • 이미지를 표시하는 기본 요소.
    • android:src 속성을 사용하여 이미지를 설정하며, scaleType으로 이미지 크기 조정 방법을 지정할 수 있습니다.
    xml
    코드 복사
    <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/sample_image" android:scaleType="centerCrop"/>
  • VideoView (비디오뷰)
    • 동영상 재생을 위한 UI 요소.
    • setVideoURI() 메서드를 통해 비디오 파일의 경로를 설정하고 재생할 수 있습니다.
    xml
    코드 복사
    <VideoView android:layout_width="match_parent" android:layout_height="wrap_content"/>

2. 슬라이더 (SeekBar)

  • SeekBar (시크바)
    • 슬라이더 형태의 UI 요소로, 값을 조정할 때 사용합니다. 볼륨 조절, 진행 바 등으로 활용 가능합니다.
    xml
    코드 복사
    <SeekBar android:id="@+id/seekBar" android:layout_width="match_parent" android:layout_height="wrap_content" android:max="100"/>
  • SeekBar 사용 방법
    • 슬라이더의 값이 변경될 때 이벤트를 처리할 수 있습니다.
    java
    코드 복사
    SeekBar seekBar = findViewById(R.id.seekBar); seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() { @Override public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) { // 슬라이더 값이 변경될 때 호출됩니다. } @Override public void onStartTrackingTouch(SeekBar seekBar) { // 슬라이더를 누를 때 호출됩니다. } @Override public void onStopTrackingTouch(SeekBar seekBar) { // 슬라이더를 놓을 때 호출됩니다. } });

3. 스위치와 체크박스

  • Switch (스위치)
    • 설정의 On/Off를 관리할 수 있는 UI 요소로, 토글 형태로 작동합니다.
    xml
    코드 복사
    <Switch android:id="@+id/switch1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Switch"/>
  • Checkbox (체크박스)
    • 선택 항목을 체크하는데 사용하는 UI 요소입니다.
    xml
    코드 복사
    <CheckBox android:id="@+id/checkBox" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Check me"/>

4. 프로그레스 바 (ProgressBar)

  • ProgressBar (프로그레스 바)
    • 작업의 진행 상황을 시각적으로 나타내는 바입니다.
    • indeterminate 속성을 사용하여 로딩 중 상태를 표시할 수 있습니다.
    xml
    코드 복사
    <ProgressBar android:id="@+id/progressBar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:indeterminate="true"/>

5. 드롭다운과 스피너 (Spinner)

  • Spinner (스피너)
    • 여러 선택지 중 하나를 선택할 수 있는 드롭다운 메뉴입니다.
    xml
    코드 복사
    <Spinner android:id="@+id/spinner" android:layout_width="wrap_content" android:layout_height="wrap_content"/>
  • Spinner 사용 방법
    • 배열이나 리스트 데이터를 사용하여 Spinner의 항목을 설정할 수 있습니다.
    java
    코드 복사
    Spinner spinner = findViewById(R.id.spinner); ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this, R.array.planets_array, android.R.layout.simple_spinner_item); adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item); spinner.setAdapter(adapter);

6. 카드뷰와 리스트뷰

  • CardView (카드뷰)
    • 카드 형태의 UI 요소로, 정보를 시각적으로 구분하는데 사용됩니다.
    xml
    코드 복사
    <androidx.cardview.widget.CardView android:layout_width="match_parent" android:layout_height="wrap_content" app:cardCornerRadius="8dp" app:cardElevation="4dp"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="CardView Example"/> </androidx.cardview.widget.CardView>
  • ListView (리스트뷰)
    • 다수의 데이터를 리스트 형태로 표시하는 UI 요소입니다.
    xml
    코드 복사
    <ListView android:id="@+id/listView" android:layout_width="match_parent" android:layout_height="wrap_content"/>

7. 팝업 메뉴와 다이얼로그

  • Popup Menu (팝업 메뉴)
    • 사용자가 클릭할 때 작은 메뉴를 표시하는 UI 요소입니다.
    java
    코드 복사
    PopupMenu popup = new PopupMenu(this, findViewById(R.id.button)); popup.getMenuInflater().inflate(R.menu.popup_menu, popup.getMenu()); popup.show();
  • Dialog (다이얼로그)
    • 사용자에게 정보를 전달하거나, 입력을 받는 작은 창입니다.
    java
    코드 복사
    new AlertDialog.Builder(this) .setTitle("알림") .setMessage("메시지 내용") .setPositiveButton("확인", null) .show();

8. 탭과 네비게이션 바

  • TabLayout (탭 레이아웃)
    • 화면을 여러 탭으로 구분하여 제공할 수 있는 UI 요소입니다.
    xml
    코드 복사
    <com.google.android.material.tabs.TabLayout android:id="@+id/tabLayout" android:layout_width="match_parent" android:layout_height="wrap_content"/>
  • BottomNavigationView (하단 네비게이션 바)
    • 하단에 고정된 네비게이션 메뉴를 제공하여 화면 간 이동을 관리합니다.
    xml
    코드 복사
    <com.google.android.material.bottomnavigation.BottomNavigationView android:id="@+id/bottomNavigationView" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_gravity="bottom"/>