Seit dem 7. Februar 2019 ist nicht viel Zeit vergangen. Google hat die Alpha-Version von Android ViewPager2 veröffentlicht . Weitere Informationen zu dieser Version finden Sie hier . Nun wollen wir sehen, worum es bei ViewPager2 geht.
Neue Funktionen
- Unterstützungslayout von rechts nach links,
- Vertikale Ausrichtung unterstützen,
- Verbesserter
PageChangeListener .
Was hat sich geändert?
ViewPager2 ist für Android X freigegeben. Wenn Sie es also verwenden möchten, sollte Ihr Projekt Android X verwenden. Mal sehen, wie wir diesen neuen ViewPager2 verwenden können.
Abhängigkeit hinzufügen
Fügen Sie der Datei build.gradle auf Anwendungsebene die folgende Abhängigkeit build.gradle :
dependencies { implementation "androidx.viewpager2:viewpager2:1.0.0-alpha01" }
Synchronisieren Sie danach Ihr Projekt.
Anpassung
Fügen Sie das ViewPager2 Widget zu Ihrer Aktivität oder Ihrem Fragment hinzu:
<androidx.viewpager2.widget.ViewPager2 android:id="@+id/viewPager2" android:layout_width="match_parent" android:layout_height="match_parent"/>
Erstellen wir ein Layout für die Seite, die in ViewPager2 angezeigt wird:
item_page.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/container" android:layout_width="match_parent" android:layout_height="match_parent"> <androidx.appcompat.widget.AppCompatTextView android:id="@+id/tvTitle" android:textColor="@android:color/white" android:layout_width="wrap_content" android:layout_centerInParent="true" tools:text= "item" android:textSize="32sp" android:layout_height="wrap_content" /> </RelativeLayout>
Als nächstes müssen wir einen Adapter für ViewPager2 erstellen. Das ist das interessanteste. Hierfür können wir RecyclerView.Adapter . Ist das nicht cool?
ViewPagerAdapter.kt
class ViewPagerAdapter : RecyclerView.Adapter<PagerVH>() { private val colors = intArrayOf( android.R.color.black, android.R.color.holo_red_light, android.R.color.holo_blue_dark, android.R.color.holo_purple ) override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): PagerVH = PagerVH(LayoutInflater.from(parent.context).inflate(R.layout.item_page, parent, false)) override fun getItemCount(): Int = colors.size override fun onBindViewHolder(holder: PagerVH, position: Int) = holder.itemView.run { tvTitle.text = "item $position" container.setBackgroundResource(colors[position]) } } class PagerVH(itemView: View) : RecyclerView.ViewHolder(itemView)
Dies ist derselbe Adapter, den wir für eine normale RecyclerView verwenden, und er funktioniert genauso gut mit ViewPager2.
Letzter Schritt: Installieren Sie den Adapter für ViewPager2:
class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) viewPager2.adapter = ViewPagerAdapter() } }
Das ist alles! Wir erhalten das gleiche Ergebnis wie bei Verwendung des alten ViewPager mit dem PagerAdapter:
Vertikales Scrollen
Bisher mussten Sie Bibliotheken von Drittanbietern verwenden, um vertikales Scrollen zu implementieren, da Bisher hat Google eine solche Möglichkeit nicht sofort bereitgestellt. Dieser neue ViewPager2 unterstützt jetzt das vertikale Scrollen. Ändern Sie einfach die Ausrichtung in ViewPager2 und das vertikale Scrollen wird aktiviert. Sehr einfach!
viewPager2.orientation = ViewPager2.ORIENTATION_VERTICAL
Hier ist das Ergebnis:
FragmentStateAdapter verwenden
Sie können Fragmente auch wie im alten ViewPager als Seiten verwenden. Hierfür gibt es einen FragmentStateAdapter. Mal sehen, wie wir es nutzen können.
Zunächst müssen wir ein Fragment erstellen:
class PagerFragment : Fragment() { override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? { return inflater.inflate(R.layout.item_page, container, false) } override fun onViewCreated(view: View, savedInstanceState: Bundle?) { arguments?.let { container.setBackgroundResource(it.getInt("color")) tvTitle.text = "Item ${it.getInt("position")}" } } }
Jetzt erstellen wir einen Adapter für ViewPager2. Wir werden den FragmentManager an seinen Konstruktor übergeben, der die Fragmente verwaltet:
class ViewPagerFragmentStateAdapter(fm: FragmentManager) : FragmentStateAdapter(fm) { private val colors = intArrayOf( android.R.color.black, android.R.color.holo_red_light, android.R.color.holo_blue_dark, android.R.color.holo_purple ) override fun getItem(position: Int): Fragment = PagerFragment().apply { arguments = bundleOf( "color" to colors[position], "position" to position ) } override fun getItemCount(): Int = colors.size }
Installieren Sie nun diesen neuen Adapter in ViewPager2 und Sie sind fertig:
viewPager2.adapter = ViewPagerFragmentStateAdapter(supportFragmentManager)
Verbesserter OnPageChangeCallback
Im alten ViewPager wurde die OnPageChangeListner-Oberfläche so konzipiert, dass sie Seitenwechsel- / Bildlaufereignisse empfängt. Und es war sehr unpraktisch, weil Wir mussten alle drei Methoden überschreiben ( onPageScrollStateChanged , onPageScrolled , onPageSelected ), auch wenn wir dies nicht wollten.
oldViewPager.addOnPageChangeListener(object:ViewPager.OnPageChangeListener{ override fun onPageScrollStateChanged(state: Int) {
Jetzt haben wir OnPageChangeCallback , eine abstrakte Klasse mit nicht abstrakten Methoden. Was wörtlich bedeutet, dass wir nicht alle diese Methoden neu definieren müssen, können wir einfach diejenigen neu definieren, die wir benötigen oder die wir verwenden möchten. So können wir beispielsweise Seitenänderungsereignisse verfolgen:
viewPager2.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback() { override fun onPageSelected(position: Int) { super.onPageSelected(position)
Achtung!
Da ViewPager2 in der Alpha-Version vorliegt, gibt es einige Funktionen des alten ViewPager, die in dieser Version noch nicht implementiert wurden oder nicht ordnungsgemäß funktionieren.
Bekannte Probleme gemäß Dokumentation:
- ClipToPadding,
- Keine Integration mit TabLayout,
- Es gibt keine Steuerung außerhalb des Bildschirms.
- Seitenbreite kann nicht eingestellt werden (standardmäßig 100%)
Weitere Informationen zu bekannten Problemen finden Sie hier . Ich hoffe, dass all dies in den nächsten Updates behoben wird. Ich freue mich auf eine stabile Version dieses neuen ViewPager2. Bis dahin guter Code an alle!