Konfigurowanie interfejsu wyszukiwania

Wypróbuj tworzenie wiadomości

Jetpack Compose to zalecany zestaw narzędzi interfejsu na Androida. Dowiedz się, jak dodać funkcję wyszukiwania w oknie tworzenia wiadomości.

Filtrowanie listy →

Zalecamy użycie widżetu SearchView jako elementu na pasku aplikacji, aby udostępnić w aplikacji funkcję wyszukiwania. Podobnie jak w przypadku innych elementów na pasku aplikacji, możesz określić, czy widżet SearchView ma być widoczny cały czas, czy tylko wtedy, gdy jest miejsce. Możesz też zdefiniować je jako składane działanie, które początkowo wyświetla ikonę SearchView, a potem, gdy użytkownik kliknie tę ikonę, zajmuje cały pasek aplikacji jako pole wyszukiwania.

Dodawanie SearchView do paska aplikacji

Aby dodać widżet SearchView do paska aplikacji, utwórz w projekcie plik o nazwie res/menu/options_menu.xml i dodaj do niego podany niżej kod. Ten kod określa sposób tworzenia elementu wyszukiwania, np. ikonę i tytuł. Atrybut collapseActionView pozwala SearchView rozszerzyć się na cały pasek aplikacji, a także zwinąć się z powrotem do normalnego elementu paska aplikacji, gdy nie jest używany. Ze względu na ograniczoną przestrzeń na pasku aplikacji na urządzeniach mobilnych zalecamy użycie atrybutu collapsibleActionView, aby zapewnić użytkownikom lepsze wrażenia.

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+id/search"
        android:title="@string/search_title"
        android:icon="@drawable/ic_search"
        android:showAsAction="collapseActionView|ifRoom"
        android:actionViewClass="androidx.appcompat.widget.SearchView" />
</menu>

Jeśli chcesz ułatwić dostęp do ikony wyszukiwarki, utwórz plik ic_search.xml w folderze /res/drawable i dodaj do niego ten kod:

<vector
    android:height="24dp"
    android:tint="#000000"
    android:viewportHeight="24"
    android:viewportWidth="24"
    android:width="24dp"
    xmlns:android="http://schemas.android.com/apk/res/android">
        <path android:fillColor="@android:color/white" android:pathData="M15.5,14h-0.79l-0.28,-0.27C15.41,12.59 16,11.11 16,9.5 16,5.91 13.09,3 9.5,3S3,5.91 3,9.5 5.91,16 9.5,16c1.61,0 3.09,-0.59 4.23,-1.57l0.27,0.28v0.79l5,4.99L20.49,19l-4.99,-5zM9.5,14C7.01,14 5,11.99 5,9.5S7.01,5 9.5,5 14,7.01 14,9.5 11.99,14 9.5,14z"/>
</vector>

Aby wyświetlić element SearchView na pasku aplikacji, na potrzeby metody aktywności onCreateOptionsMenu() napisz kod XML zasobu menu res/menu/options_menu.xml:

override fun onCreateOptionsMenu(menu: Menu): Boolean {
    menuInflater.inflate(R.menu.options_menu, menu)

    return true
}

Uruchomienie aplikacji powoduje wyświetlenie informacji w takiej formie:

Na pasku aplikacji pojawia się ikona SearchView, ale nie można jej użyć. Gdy klikniesz ikonę wyszukiwania, zobaczysz coś takiego:

Aby SearchView działał, musisz określić jego zachowanie.SearchView

Tworzenie konfiguracji wyszukiwania

Konfiguracja wyszukiwania określa zachowanie SearchView i jest definiowana w pliku res/xml/searchable.xml. Konfiguracja wyszukiwania musi zawierać co najmniej atrybut android:label o tej samej wartości co atrybut android:label w elemencie <application> lub <activity> w pliku manifestu Androida. Zalecamy jednak też dodanie atrybutu android:hint, aby poinformować użytkownika, co należy wpisać w polu wyszukiwania.

<?xml version="1.0" encoding="utf-8"?>

<searchable xmlns:android="http://schemas.android.com/apk/res/android"
        android:label="@string/app_name"
        android:hint="@string/search_hint" />

W pliku manifestu aplikacji zadeklaruj element <meta-data>, który wskazuje na plik res/xml/searchable.xml. Zadeklaruj element w elementach <activity>, w których chcesz wyświetlać element SearchView.

<activity
android:name=".SearchResultsActivity"
android:exported="false"
android:label="@string/title_activity_search_results"
android:launchMode="singleTop"
android:theme="@style/Theme.AppCompat.Light">
    <intent-filter>
        <action android:name="android.intent.action.SEARCH" />
    </intent-filter>
    <meta-data
        android:name="android.app.searchable"
        android:resource="@xml/searchable" />
</activity>

W stworzonej metodzie onCreateOptionsMenu() powiązaj konfigurację wyszukiwania z elementem SearchView, wywołując funkcję setSearchableInfo(SearchableInfo):

override fun onCreateOptionsMenu(menu: Menu): Boolean {
    menuInflater.inflate(R.menu.options_menu, menu)

    val searchManager = getSystemService(Context.SEARCH_SERVICE) as SearchManager
    val searchView = menu.findItem(R.id.search).actionView as SearchView
    val component = ComponentName(this, SearchResultsActivity::class.java)
    val searchableInfo = searchManager.getSearchableInfo(component)
    searchView.setSearchableInfo(searchableInfo)
    return true
}

Wywołanie funkcji getSearchableInfo()pobiera obiekt SearchableInfo, który jest tworzony na podstawie pliku XML konfiguracji wyszukiwania. Gdy konfiguracja wyszukiwania jest prawidłowo powiązana z Twoim SearchView, a użytkownik przesyła zapytanie, SearchView rozpoczyna aktywność z intencją ACTION_SEARCH. Następnie potrzebujesz aktywności, która może filtrować według tej intencji i obsługiwać zapytanie wyszukiwania.

Tworzenie aktywności z możliwością wyszukiwania

Aktywność do wyszukiwania filtruje intencję ACTION_SEARCH i wyszukuje zapytanie w zbiorze danych. Aby utworzyć aktywność, którą można wyszukiwać, zadeklaruj wybraną aktywność, aby filtrować według inencji ACTION_SEARCH:

<activity android:name=".SearchResultsActivity" ... >
    ...
    <intent-filter>
        <action android:name="android.intent.action.SEARCH" />
    </intent-filter>
    ...
</activity>

W aktywności umożliwiającej wyszukiwanie obsłuż intencję ACTION_SEARCH, sprawdzając ją w metodzie onCreate().

class SearchResultsActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_search_results)
        handleIntent(intent)
    }

    override fun onNewIntent(intent: Intent) {
        super.onNewIntent(intent)
        handleIntent(intent)
    }

    private fun handleIntent(intent: Intent) {
        if (Intent.ACTION_SEARCH == intent.action) {
            val query = intent.getStringExtra(SearchManager.QUERY)
            Log.d("SEARCH", "Search query was: $query")
        }
    }
}

Teraz usługa SearchView może przyjąć zapytanie użytkownika i rozpocząć aktywność możliwą do wyszukania z zapytaniem ACTION_SEARCH.

Po uzyskaniu zapytania możesz je przekazać do usługi ViewModel, gdzie możesz go użyć na innych poziomach architektury, aby pobrać wyniki wyszukiwania do wyświetlenia.