Fixes Issue 6461: Welcome screen works only from left to right #6461

app/build.gradle.kts

@@ -231,6 +231,7 @@ dependencies {
 
     // UI
     implementation("${libs.viewpagerindicator.library.get()}@aar")
+    implementation(libs.viewpager2indicator)
     implementation(libs.photoview)
     implementation(libs.android.sdk)
     implementation(libs.android.plugin.scalebar)

app/src/main/java/fr/free/nrw/commons/WelcomeActivity.kt

@@ -5,12 +5,16 @@ import android.content.Context
 import android.content.Intent
 import android.os.Bundle
 import android.view.View
+import androidx.core.text.TextUtilsCompat
+import com.zhpan.indicator.enums.IndicatorOrientation
 import fr.free.nrw.commons.databinding.ActivityWelcomeBinding
 import fr.free.nrw.commons.databinding.PopupForCopyrightBinding
 import fr.free.nrw.commons.quiz.QuizActivity
+import fr.free.nrw.commons.settings.Prefs
 import fr.free.nrw.commons.theme.BaseActivity
 import fr.free.nrw.commons.utils.applyEdgeToEdgeAllInsets
 import fr.free.nrw.commons.utils.ConfigUtils.isBetaFlavour
+import java.util.Locale
 
 class WelcomeActivity : BaseActivity() {
     private var binding: ActivityWelcomeBinding? = null
@@ -46,7 +50,20 @@ class WelcomeActivity : BaseActivity() {
 
         val adapter = WelcomePagerAdapter()
         binding!!.welcomePager.adapter = adapter
-        binding!!.welcomePagerIndicator.setViewPager(binding!!.welcomePager)
+        binding!!.welcomePagerIndicator.setupWithViewPager(binding!!.welcomePager)
+
+        //Unfortunately, setting the page indicator direction (LTR vs RTL) must be done in Kotlin
+
+        //Assume LTR until language is checked.
+        var orientation = IndicatorOrientation.INDICATOR_HORIZONTAL
+
+        val languageCode = defaultKvStore.getString(Prefs.APP_UI_LANGUAGE)
+        if (languageCode != null && TextUtilsCompat.getLayoutDirectionFromLocale(
+                Locale(languageCode)) == View.LAYOUT_DIRECTION_RTL) {
+            orientation = IndicatorOrientation.INDICATOR_RTL
+        }
+
+        binding!!.welcomePagerIndicator.setOrientation(orientation)
         binding!!.finishTutorialButton.setOnClickListener { v: View? -> finishTutorial() }
     }
 

app/src/main/java/fr/free/nrw/commons/WelcomePagerAdapter.kt

@@ -5,59 +5,51 @@ import android.view.View
 import android.view.ViewGroup
 import android.widget.TextView
 import androidx.core.net.toUri
-import androidx.viewpager.widget.PagerAdapter
+import androidx.recyclerview.widget.RecyclerView
 import fr.free.nrw.commons.utils.UnderlineUtils.setUnderlinedText
 import fr.free.nrw.commons.utils.handleWebUrl
 
-class WelcomePagerAdapter : PagerAdapter() {
+class WelcomePagerAdapter : RecyclerView.Adapter<WelcomePagerAdapter.ViewHolder>() {
     /**
      * Gets total number of layouts
      * @return Number of layouts
      */
-    override fun getCount(): Int = PAGE_LAYOUTS.size
+    override fun getItemCount(): Int = PAGE_LAYOUTS.size
 
-    /**
-     * Compares given view with provided object
-     * @param view Adapter view
-     * @param obj Adapter object
-     * @return Equality between view and object
-     */
-    override fun isViewFromObject(view: View, obj: Any): Boolean = (view === obj)
-
-    /**
-     * Provides a way to remove an item from container
-     * @param container Adapter view group container
-     * @param position Index of item
-     * @param obj Adapter object
-     */
-    override fun destroyItem(container: ViewGroup, position: Int, obj: Any) =
-        container.removeView(obj as View)
+    override fun getItemViewType(position: Int): Int {
+        return position
+    }
 
-    override fun instantiateItem(container: ViewGroup, position: Int): Any {
+    override fun onCreateViewHolder(container: ViewGroup, type: Int): ViewHolder {
         val inflater = LayoutInflater.from(container.context)
-        val layout = inflater.inflate(PAGE_LAYOUTS[position], container, false) as ViewGroup
+        val layout = inflater.inflate(PAGE_LAYOUTS[type], container, false)
+        return ViewHolder(layout)
+    }
 
+    override fun onBindViewHolder(
+        holder: ViewHolder,
+        position: Int
+    ) {
         // If final page
         if (position == PAGE_LAYOUTS.size - 1) {
             // Add link to more information
-            val moreInfo = layout.findViewById<TextView>(R.id.welcomeInfo)
+            val moreInfo = holder.itemView.findViewById<TextView>(R.id.welcomeInfo)
             setUnderlinedText(moreInfo, R.string.welcome_help_button_text)
             moreInfo.setOnClickListener {
                 handleWebUrl(
-                    container.context,
+                    holder.itemView.context,
                     "https://commons.wikimedia.org/wiki/Help:Contents".toUri()
                 )
             }
 
             // Handle click of finishTutorialButton ("YES!" button) inside layout
-            layout.findViewById<View>(R.id.finishTutorialButton)
-                .setOnClickListener { view: View? -> (container.context as WelcomeActivity).finishTutorial() }
+            holder.itemView.findViewById<View>(R.id.finishTutorialButton).setOnClickListener {
+                view: View? -> (holder.itemView.context as WelcomeActivity).finishTutorial() }
         }
-
-        container.addView(layout)
-        return layout
     }
 
+    class ViewHolder(view: View) : RecyclerView.ViewHolder(view)
+
     companion object {
         private val PAGE_LAYOUTS = intArrayOf(
             R.layout.welcome_wikipedia,

app/src/main/res/layout/activity_welcome.xml

@@ -2,9 +2,10 @@
 <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
+    xmlns:custom="http://schemas.android.com/apk/res-auto"
     android:background="@color/primaryColor">
 
-    <androidx.viewpager.widget.ViewPager
+    <androidx.viewpager2.widget.ViewPager2
         android:id="@+id/welcomePager"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
@@ -14,19 +15,22 @@
         android:id="@+id/finishTutorialButton"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
-        android:layout_gravity="right"
+        android:layout_gravity="end"
         android:padding="@dimen/standard_gap"
         android:text="@string/welcome_skip_button"
         android:textColor="@color/white"
         android:textSize="@dimen/normal_text"
         android:textStyle="bold"
         android:visibility="gone" />
 
-    <com.viewpagerindicator.CirclePageIndicator
+    <com.zhpan.indicator.IndicatorView
         android:id="@+id/welcomePagerIndicator"
         android:layout_width="match_parent"
         android:layout_height="@dimen/half_standard_height"
-        android:layout_gravity="bottom"
-        android:padding="@dimen/tiny_padding" />
+        android:layout_gravity="bottom|center_horizontal"
+        android:padding="@dimen/tiny_padding"
+        android:layout_marginBottom="10dp"
+        custom:vpi_slider_checked_color="@color/white"
+        custom:vpi_slider_radius="3dp" />
 
 </FrameLayout>

app/src/main/res/layout/welcome_final.xml

@@ -67,7 +67,7 @@
       android:id="@+id/welcomeInfo"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
-      android:layout_alignParentRight="true"
+      android:layout_alignParentEnd="true"
       android:layout_alignParentBottom="true"
       android:layout_marginBottom="@dimen/standard_gap"
       android:padding="@dimen/standard_gap"

gradle/libs.versions.toml

@@ -69,6 +69,7 @@ slf4jApi = "1.7.25"
 soloader = "0.10.5"
 timber = "4.7.1"
 uiautomator = "2.2.0"
+viewpager2indicatorVersion = "1.2.3"
 workManager = "2.8.1"
 
 [libraries]
@@ -170,6 +171,7 @@ adapterdelegates4-pagination = { module = "com.hannesdorfmann:adapterdelegates4-
 dexter = { module = "com.karumi:dexter", version.ref = "dexterVersion" }
 recyclerview-fastscroll = { module = "com.simplecityapps:recyclerview-fastscroll", version.ref = "recyclerviewFastscroll" }
 swipelayout-library = { module = "com.daimajia.swipelayout:library", version.ref = "swipelayout" }
+viewpager2indicator = { module = "com.github.zhpanvip:viewpagerindicator", version.ref = "viewpager2indicatorVersion" }
 viewpagerindicator-library = { module = "fr.avianey.com.viewpagerindicator:library", version.ref = "viewpagerIndicator" }
 
 # Networking libraries