Computer >> 컴퓨터 >  >> 프로그래밍 >> Android

안드로이드 SearchView란? 검색 뷰 개념과 ListView 실시간 검색 구현 방법

안드로이드 SearchView란 무엇인가?

SearchView(검색 뷰)는 HTML의 검색 상자(search box)와 비슷한 역할을 하는 안드로이드 UI 위젯입니다. 사용자가 키워드를 입력하면 특정 리스트(List)의 항목들 중에서 조건에 맞는 데이터를 실시간으로 찾아 보여줄 수 있습니다.

이 글에서는 안드로이드 앱에 SearchView를 통합하고, ListView의 항목을 검색어에 따라 필터링하는 방법을 단계별로 살펴보겠습니다.

1단계 — 새 프로젝트 생성

Android Studio를 실행한 뒤 File → New Project 메뉴로 이동하여 새 프로젝트를 만들고, 프로젝트 생성에 필요한 모든 정보를 입력합니다.

2단계 — 레이아웃 파일 작성 (activity_main.xml)

res/layout/activity_main.xml 파일에 아래 코드를 추가합니다.

<?xml version = "1.0" encoding = "utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android = "https://schemas.android.com/apk/res/android" xmlns:tools = "https://schemas.android.com/tools" android:layout_width = "match_parent" android:layout_height = "match_parent">
<LinearLayout
    android:layout_width = "match_parent"
    android:layout_height = "match_parent"
    android:orientation = "vertical">
    <android.support.v7.widget.SearchView
       android:id = "@+id/search"
       android:layout_width = "match_parent"
       android:layout_height = "wrap_content" />
    <ListView
       android:id = "@+id/list"
       android:layout_width = "wrap_content"
       android:layout_height = "wrap_content"/>
</LinearLayout>
</android.support.constraint.ConstraintLayout>

위 코드에는 SearchView와 ListView가 함께 배치되어 있습니다. SearchView에서 입력한 검색어로 ListView의 요소들을 찾기 때문입니다.

3단계 — MainActivity.java 작성

src/MainActivity.java 파일에 아래 코드를 추가합니다.

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.SearchView;
import android.widget.Toast;
import java.util.ArrayList;
public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        final ListView list = findViewById(R.id.list);
        SearchView search = findViewById(R.id.search);
        search.setActivated(true);
        search.setQueryHint("Type your keyword here");
        search.onActionViewExpanded();
        search.setIconified(false);
        ArrayList<String> arrayList = new ArrayList<>();
        arrayList.add("JAVA");
        arrayList.add("ANDROID");
        arrayList.add("C Language");
        arrayList.add("CPP Language");
        arrayList.add("Go Language");
        arrayList.add("AVN SYSTEMS");
        final ArrayAdapter<String> arrayAdapter = new ArrayAdapter<String>(this,                    android.R.layout.simple_list_item_1, arrayList);
        list.setAdapter(arrayAdapter);
        search.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
            @Override
            public boolean onQueryTextSubmit(String query) {
                return false;
            }
            @Override
            public boolean onQueryTextChange(String newText) {
                arrayAdapter.getFilter().filter(newText);
                return false;
            }
        });
        list.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                String clickedItem = (String) list.getItemAtPosition(position);
                Toast.makeText(MainActivity.this, clickedItem, Toast.LENGTH_LONG).show();
            }
        });
    }
}

핵심 포인트: setOnQueryTextListener 이해하기

위 코드에서는 SearchView에 setOnQueryTextListener 리스너를 등록했습니다. 이 리스너는 사용자의 텍스트 입력 변화를 감지하며, 다음 두 가지 메서드로 구성됩니다.

  • onQueryTextSubmit(String query) — SearchView에 텍스트를 입력한 후 검색(제출)했을 때 호출됩니다. 입력된 문자열을 가지고 추가 작업을 수행하고 싶다면 이 메서드 안에서 처리하면 됩니다.

  • onQueryTextChange(String newText) — SearchView에 텍스트가 입력되는 동안, 즉 입력 내용이 바뀔 때마다 호출되어 특정 동작을 수행할 수 있습니다.

이 예제에서는 검색어가 변경될 때마다 리스트를 필터링하도록 아래와 같이 구현했습니다.

@Override
public boolean onQueryTextChange(String newText) {
    arrayAdapter.getFilter().filter(newText);
    return false;
}

앱 실행 및 결과 확인

이제 애플리케이션을 실행해 보겠습니다. 실제 안드로이드 스마트폰을 컴퓨터에 연결했다고 가정합니다. Android Studio에서 프로젝트의 액티비티 파일 중 하나를 연 뒤, 툴바의 안드로이드 SearchView란? 검색 뷰 개념과 ListView 실시간 검색 구현 방법 Run 아이콘을 클릭하세요. 실행 옵션에서 연결된 모바일 기기를 선택하면, 기본 화면이 표시됩니다.

안드로이드 SearchView란? 검색 뷰 개념과 ListView 실시간 검색 구현 방법

이제 ListView 항목과 유사한 단어를 검색창에 입력해 보세요. 입력하는 즉시 일치하는 항목만 걸러져 화면에 나타나는 것을 확인할 수 있습니다.

안드로이드 SearchView란? 검색 뷰 개념과 ListView 실시간 검색 구현 방법