Android SearchView példa oktatóanyag DataBinding használatával
A SearchView* egy erős Android widget, amely lehetővé teszi a felhasználók számára, hogy gyorsan és egyszerűen keressenek az alkalmazás tartalmában. A *DataBinding egy erőteljes eszköz az Android-alkalmazásokban az adatkötés és az UI-komponensek közötti összeköttetés létrehozásához. Ebben az oktatóanyagban bemutatjuk, hogyan használhatja a DataBinding-et a SearchView-vel Android-alkalmazásokban.
Tartalomjegyzék
Bevezetés
A DataBinding egy Android Jetpack könyvtár, amely lehetővé teszi a fejlesztők számára, hogy az xml-elrendezéseiket közvetlenül az alkalmazásuk modelljeihez kössék. Ez leegyszerűsíti a nézetfrissítéseket és kiküszöböli a kazánház kódolás szükségességét. Összekapcsolva a SearchView-vel a DataBinding nagy rugalmasságot és ellenőrzést biztosít az alkalmazás keresési felhasználói felületének felett.
Előfeltételek
Az oktatóanyag elkezdése előtt szüksége lesz:
* Android Studio 4.1 vagy újabb
* Egy Android-eszköz vagy emulátor
* Alapvető Android-fejlesztési ismeretek
lépésről lépésre
1. lépés: Új projekt létrehozása
Nyissa meg az Android Studio-t, és hozzon létre egy új Android-projektet. Adjon nevet a projektnek, és válassza a „Üres tevékenység” sablont.
2. lépés: A DataBinding engedélyezése
A DataBinding alapértelmezés szerint nincs engedélyezve az új Android-projektekben. Engedélyezéséhez nyissa meg a build.gradle fájlt az alkalmazásmodulban, és adja hozzá a következő függőséget:
gradle
dependencies {
implementation 'androidx.databinding:databinding-compiler:4.2.0'
}
3. lépés: Az adatmodell létrehozása
Hozzon létre egy új Kotlin-osztályt az „Adatok” névvel az alkalmazáscsomagjában. Ez az osztály tárolja az alkalmazás kereshető adatait.
kotlin
class Adatok(val nev: String)
4. lépés: A tevékenység XML elrendezésének létrehozása
Nyissa meg az activity_main.xml fájlt, és adja hozzá a következő kódot a keresősáv létrehozásához:
xml
<androidx.appcompat.widget.SearchView
android:id="@+id/searchView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:queryHint="Keresés..." />
5. lépés: A DataBinding elrendezés létrehozása
Hozzon létre egy új xml fájlt az „activity_main_binding.xml” névvel a res/layout mappában. Ez a fájl a DataBinding-et használja a SearchView-hez való csatlakozáshoz.
xml
<layout xmlns:android="http://schemas.android.com/apk/res/android">
<data>
<import type="java.util.List" />
<variable
name="adatok"
type="List<com.example.androidsearchviewdatabinding.Adatok>" />
</data>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.appcompat.widget.SearchView
android:id="@+id/searchView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:queryHint="Keresés..."
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:queryTextChanged="@{viewModel.onQueryTextChanged}" />
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
6. lépés: A viewModel létrehozása
Hozzon létre egy új Kotlin-osztályt az „ViewModel” névvel az alkalmazáscsomagjában. Ez az osztály kezeli az alkalmazás logikáját, beleértve a keresést is.
kotlin
class ViewModel(private val adatok: List<Adatok>) {
private var keresesiSzoveg: ObservableField<String> = ObservableField("")
fun onQueryTextChanged(newText: String) {
keresesiSzoveg.set(newText)
}
val keresettAdatok: LiveData<List<Adatok>> = Transformations.switchMap(keresesiSzoveg) { query ->
filterResults(query)
}
private fun filterResults(query: String): LiveData<List<Adatok>> {
return MutableLiveData(adatok.filter { it.nev.contains(query) })
}
}
7. lépés: Az aktivitás létrehozása
Hozzon létre egy új Kotlin-osztályt az „MainActivity” névvel az alkalmazáscsomagjában. Ez az osztály a tevékenység logikáját kezeli.
kotlin
class MainActivity : AppCompatActivity() {
private val viewModel by lazy { ViewModel(loadData()) }
private val searchView by lazy { findViewById<SearchView>(R.id.searchView) }
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
setupSearchView()
setupObservers()
}
private fun loadData(): List<Adatok> {
return listOf(
Adatok("Alma"),
Adatok("Körte"),
Adatok("Szőlő"),
Adatok("Eper")
)
}
private fun setupSearchView() {
searchView.setOnQueryTextListener(object : SearchView.OnQueryTextListener {
override fun onQueryTextSubmit(query: String): Boolean {
return false
}
override fun onQueryTextChange(newText: String): Boolean {
viewModel.onQueryTextChanged(newText)
return false
}
})
}
private fun setupObservers() {
viewModel.keresettAdatok.observe(this) { adatok ->
// Frissítse az UI-t a keresési eredményekkel
}
}
}
8. lépés: A projekt összeállítása és futtatása
Miután létrehozta az összes szükséges fájlt, állítsa össze a projektet, és futtassa azt egy emulátorban vagy egy valódi eszközön. A keresősávnak most meg kell jelennie a tevékenységben, és a keresési lekérdezések megadásakor meg kell szűrnie az alkalmazás adatait.
Következtetés
A DataBinding használata a SearchView-vel egy hatékony módja annak, hogy erős és testreszabható keresési felhasználói felületeket hozzon létre Android-alkalmazásokban. A DataBinding és a LiveData kombinációja lehetővé teszi a fejlesztők számára, hogy zökkenőmentesen frissítsék az UI-t, amikor a keresési lekérdezések változnak, ami reszponzív és felhasználóbarát élményt eredményez.
Gyakran ismételt kérdések
1. Szükséges-e a DataBinding engedélyezése egy Android-projektben a SearchView használatához?
Nem, a DataBinding nem szükséges a SearchView használatához. Azonban a DataBinding használata jelentős előnyöket kínál az adatkötés és a nézetfrissítések kezelése terén.
2. Hogyan lehet a DataBinding-et használni a SearchView-vel?
Használja az app:queryTextChange attribútumot a SearchView xml elrendezésében, és kösse össze egy ViewModel metódussal, amely a keresési lekérdezések változásaira reagál.
3. Hogyan lehet szűrni az alkalmazás adatait a keresési lekérdezések alapján?
Hozzon létre egy ViewModel metódust, amely szűri az adatokat a keresési lekérdezés alapján, majd LiveData-objektumként teszi elérhetővé a szűrt eredményeket.
4. Hogyan lehet a keresési eredményeket megjeleníteni az UI-ban?
Használja az LiveData observereket a keresési eredmények megfigyeléséhez és a UI-frissítések kezeléséhez az eredmények változásakor.
5. Hogyan lehet az automatikus kiegészítést engedélyezni a SearchView-ben?
Adjon hozzá egy ArrayAdaptert az alkalmazásához