Adapt the style of the image activity to the rest of the application

androidApp/build.gradle.kts

@@ -115,7 +115,6 @@ dependencies {
     implementation(project(":shared"))
     implementation("com.google.android.material:material:1.5.0")
     implementation("androidx.appcompat:appcompat:1.4.1")
-    implementation("androidx.constraintlayout:constraintlayout:2.1.3")
     implementation("org.jetbrains.kotlinx:kotlinx-coroutines-android:1.6.0")
 
     implementation("androidx.preference:preference-ktx:1.1.1")
@@ -131,7 +130,7 @@ dependencies {
     implementation("androidx.cardview:cardview:1.0.0")
     implementation("androidx.annotation:annotation:1.3.0")
     implementation("androidx.work:work-runtime-ktx:2.7.1")
-    implementation("androidx.constraintlayout:constraintlayout:2.1.3")
+    implementation("androidx.constraintlayout:constraintlayout:2.1.4")
     implementation("org.jsoup:jsoup:1.14.3")
 
     //multidex

androidApp/src/main/AndroidManifest.xml

@@ -69,7 +69,8 @@
             android:name=".ReaderActivity">
         </activity>
         <activity
-            android:name=".ImageActivity">
+            android:name=".ImageActivity"
+            android:theme="@style/Theme.AppCompat.Translucent">
         </activity>
 
         <meta-data android:name="android.webkit.WebView.MetricsOptOut"

androidApp/src/main/java/bou/amine/apps/readerforselfossv2/android/ImageActivity.kt

@@ -3,6 +3,7 @@ package bou.amine.apps.readerforselfossv2.android
 import android.os.Bundle
 import android.view.MenuItem
 import androidx.appcompat.app.AppCompatActivity
+import androidx.constraintlayout.motion.widget.MotionLayout
 import androidx.fragment.app.Fragment
 import androidx.fragment.app.FragmentActivity
 import androidx.viewpager2.adapter.FragmentStateAdapter
@@ -19,12 +20,10 @@ class ImageActivity : AppCompatActivity() {
         super.onCreate(savedInstanceState)
         binding = ActivityImageBinding.inflate(layoutInflater)
         val view = binding.root
-        binding.pager.requestDisallowInterceptTouchEvent(true)
 
         setContentView(view)
 
         setSupportActionBar(binding.toolBar)
-        supportActionBar?.setDisplayShowTitleEnabled(false)
         supportActionBar?.setDisplayHomeAsUpEnabled(true)
 
         allImages = intent.getStringArrayListExtra("allImages") as ArrayList<String>
@@ -32,12 +31,37 @@ class ImageActivity : AppCompatActivity() {
 
         binding.pager.adapter = ScreenSlidePagerAdapter(this)
         binding.pager.setCurrentItem(position, false)
+
+        val transitionListener = object : MotionLayout.TransitionListener {
+            override fun onTransitionStarted(motionLayout: MotionLayout?, startId: Int, endId: Int) {
+                binding.root.setOnClickListener {
+                }
+                // Nothing
+            }
+
+            override fun onTransitionChange(motionLayout: MotionLayout?, startId: Int, endId: Int, progress: Float
+            ) {
+                // Nothing
+            }
+
+            override fun onTransitionCompleted(motionLayout: MotionLayout?, currentId: Int) {
+                if (motionLayout?.currentState == binding.root.endState) {
+                    onBackPressedDispatcher.onBackPressed()
+                    overridePendingTransition(0, 0)
+                }
+            }
+
+            override fun onTransitionTrigger(motionLayout: MotionLayout?, triggerId: Int, positive: Boolean, progress: Float) {
+                // Nothing
+            }
+        }
+        binding.root.setTransitionListener(transitionListener)
     }
 
     override fun onOptionsItemSelected(item: MenuItem): Boolean {
         when (item.itemId) {
             android.R.id.home -> {
-                onBackPressed()
+                onBackPressedDispatcher.onBackPressed()
                 return true
             }
         }

androidApp/src/main/java/bou/amine/apps/readerforselfossv2/android/fragments/ImageFragment.kt

@@ -35,26 +35,6 @@ class ImageFragment : Fragment() {
                 .load(imageUrl)
                 .into(binding!!.photoView)
 
-        val transitionListener = object : MotionLayout.TransitionListener {
-            override fun onTransitionStarted(motionLayout: MotionLayout?, startId: Int, endId: Int) {
-                // Nothing
-            }
-
-            override fun onTransitionChange(motionLayout: MotionLayout?, startId: Int, endId: Int, progress: Float
-            ) {
-                // Nothing
-            }
-
-            override fun onTransitionCompleted(motionLayout: MotionLayout?, currentId: Int) {
-                activity?.finish()
-            }
-
-            override fun onTransitionTrigger(motionLayout: MotionLayout?, triggerId: Int, positive: Boolean, progress: Float) {
-                // Nothing
-            }
-        }
-        binding!!.root.setTransitionListener(transitionListener)
-
         return view
     }
 

androidApp/src/main/res/layout/activity_image.xml

@@ -1,33 +1,40 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<androidx.constraintlayout.motion.widget.MotionLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:id="@+id/container"
     android:layout_width="match_parent"
-    android:layout_height="match_parent">
+    android:layout_height="match_parent"
+    app:layoutDescription="@xml/image_close_scene">
 
     <com.google.android.material.appbar.AppBarLayout
         android:id="@+id/appBarLayout"
         android:layout_width="match_parent"
-        android:layout_height="wrap_content"
+        android:layout_height="wrap_content">
-        app:layout_constraintEnd_toEndOf="parent"
-        app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent">
 
-        <androidx.appcompat.widget.Toolbar
+        <androidx.appcompat.widget.Toolbar android:theme="@style/ToolBarStyle"
             android:id="@+id/toolBar"
             android:layout_width="match_parent"
             android:layout_height="?attr/actionBarSize"
 
-             />
+            />
 
     </com.google.android.material.appbar.AppBarLayout>
 
-    <androidx.viewpager2.widget.ViewPager2
+    <androidx.core.widget.NestedScrollView
-        android:id="@+id/pager"
+        android:id="@+id/scrollView"
         android:layout_width="match_parent"
-        android:layout_height="0dp"
+        android:layout_height="match_parent"
-        app:layout_constraintBottom_toBottomOf="parent"
+        android:fillViewport="true"
-        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintTop_toBottomOf="@+id/appBarLayout">
-        app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toBottomOf="@+id/appBarLayout" />
 
-</androidx.constraintlayout.widget.ConstraintLayout>
+        <androidx.viewpager2.widget.ViewPager2
+            android:id="@+id/pager"
+            android:layout_width="match_parent"
+            android:layout_height="match_parent"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent" />
+    </androidx.core.widget.NestedScrollView>
+
+
+</androidx.constraintlayout.motion.widget.MotionLayout>

androidApp/src/main/res/layout/fragment_image.xml

@@ -1,10 +1,8 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.constraintlayout.motion.widget.MotionLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
-    android:id="@+id/container"
     android:layout_width="match_parent"
-    android:layout_height="match_parent"
+    android:layout_height="match_parent">
-    app:layoutDescription="@xml/image_close_scene">
 
         <com.github.chrisbanes.photoview.PhotoView
             android:id="@+id/photoView"
@@ -15,4 +13,4 @@
             android:background="@drawable/checkerboard"
             app:srcCompat="@android:drawable/screen_background_dark" />
 
-</androidx.constraintlayout.motion.widget.MotionLayout>
+</androidx.constraintlayout.widget.ConstraintLayout>

androidApp/src/main/res/values/styles.xml

@@ -26,4 +26,8 @@
         <item name="android:textColorSecondary">@color/white</item>
         <item name="actionMenuTextColor">@color/white</item>
     </style>
+
+    <style name="Theme.AppCompat.Translucent" parent="NoBar">
+        <item name="android:windowBackground">@android:color/transparent</item>
+    </style>
 </resources>

androidApp/src/main/res/xml/image_close_scene.xml

@@ -10,26 +10,26 @@
         motion:motionInterpolator="linear">
 
         <OnSwipe
-            motion:touchRegionId="@+id/container"
+            motion:touchAnchorId="@+id/scrollView"
-            motion:dragDirection="dragDown"
+            motion:touchAnchorSide="top"
-            motion:onTouchUp="autoCompleteToStart"/>
+            motion:onTouchUp="autoCompleteToStart" />
     </Transition>
 
     <ConstraintSet android:id="@+id/start">
 
         <Constraint
-            android:id="@id/photoView"
+            android:id="@id/scrollView"
-            android:layout_width="match_parent"
-            android:layout_height="0dp"
             motion:layout_constraintBottom_toBottomOf="parent"
-            motion:layout_constraintTop_toTopOf="parent">
+            motion:layout_constraintTop_toBottomOf="@+id/appBarLayout"
+            motion:layout_constraintEnd_toEndOf="parent"
+            motion:layout_constraintStart_toStartOf="parent">
         </Constraint>
     </ConstraintSet>
 
     <ConstraintSet android:id="@+id/end">
 
         <Constraint
-            android:id="@+id/photoView"
+            android:id="@+id/scrollView"
             android:layout_width="100dp"
             android:layout_height="100dp"
             android:layout_marginBottom="32dp"