Zoom control buttons in reader

app/src/main/kotlin/org/koitharu/kotatsu/core/prefs/AppSettings.kt

@@ -90,6 +90,9 @@ class AppSettings @Inject constructor(@ApplicationContext context: Context) {
 	val readerPageSwitch: Set<String>
 		get() = prefs.getStringSet(KEY_READER_SWITCHERS, null) ?: setOf(PAGE_SWITCH_TAPS)
 
+	val isReaderZoomButtonsEnabled: Boolean
+		get() = prefs.getBoolean(KEY_READER_ZOOM_BUTTONS, false)
+
 	val isReaderTapsAdaptive: Boolean
 		get() = !prefs.getBoolean(KEY_READER_TAPS_LTR, false)
 
@@ -161,7 +164,7 @@ class AppSettings @Inject constructor(@ApplicationContext context: Context) {
 		get() = prefs.getString(KEY_APP_PASSWORD, null)
 		set(value) = prefs.edit {
 			if (value != null) putString(KEY_APP_PASSWORD, value) else remove(
-				KEY_APP_PASSWORD
+				KEY_APP_PASSWORD,
 			)
 		}
 
@@ -314,7 +317,7 @@ class AppSettings @Inject constructor(@ApplicationContext context: Context) {
 		set(@FloatRange(from = 0.0, to = 1.0) value) = prefs.edit {
 			putFloat(
 				KEY_READER_AUTOSCROLL_SPEED,
-				value
+				value,
 			)
 		}
 
@@ -325,7 +328,7 @@ class AppSettings @Inject constructor(@ApplicationContext context: Context) {
 			}
 			val policy = NetworkPolicy.from(
 				prefs.getString(KEY_PAGES_PRELOAD, null),
-				NetworkPolicy.NON_METERED
+				NetworkPolicy.NON_METERED,
 			)
 			return policy.isNetworkAllowed(connectivityManager)
 		}
@@ -409,6 +412,7 @@ class AppSettings @Inject constructor(@ApplicationContext context: Context) {
 		const val KEY_REMOTE_SOURCES = "remote_sources"
 		const val KEY_LOCAL_STORAGE = "local_storage"
 		const val KEY_READER_SWITCHERS = "reader_switchers"
+		const val KEY_READER_ZOOM_BUTTONS = "reader_zoom_buttons"
 		const val KEY_TRACKER_ENABLED = "tracker_enabled"
 		const val KEY_TRACKER_WIFI_ONLY = "tracker_wifi"
 		const val KEY_TRACK_SOURCES = "track_sources"

app/src/main/kotlin/org/koitharu/kotatsu/core/ui/widgets/ZoomControl.kt

@@ -0,0 +1,38 @@
+package org.koitharu.kotatsu.core.ui.widgets
+
+import android.content.Context
+import android.util.AttributeSet
+import android.view.LayoutInflater
+import android.view.View
+import android.widget.LinearLayout
+import org.koitharu.kotatsu.R
+import org.koitharu.kotatsu.databinding.ViewZoomBinding
+
+class ZoomControl @JvmOverloads constructor(
+	context: Context,
+	attrs: AttributeSet? = null,
+) : LinearLayout(context, attrs), View.OnClickListener {
+
+	private val binding = ViewZoomBinding.inflate(LayoutInflater.from(context), this)
+
+	var listener: ZoomControlListener? = null
+
+	init {
+		binding.buttonZoomIn.setOnClickListener(this)
+		binding.buttonZoomOut.setOnClickListener(this)
+	}
+
+	override fun onClick(v: View) {
+		when (v.id) {
+			R.id.button_zoom_in -> listener?.onZoomIn()
+			R.id.button_zoom_out -> listener?.onZoomOut()
+		}
+	}
+
+	interface ZoomControlListener {
+
+		fun onZoomIn()
+
+		fun onZoomOut()
+	}
+}

app/src/main/kotlin/org/koitharu/kotatsu/reader/ui/ReaderViewModel.kt

@@ -120,6 +120,12 @@ class ReaderViewModel @Inject constructor(
 		valueProducer = { isWebtoonZoomEnable },
 	)
 
+	val isZoomControlEnabled = settings.observeAsStateFlow(
+		scope = viewModelScope + Dispatchers.Default,
+		key = AppSettings.KEY_READER_ZOOM_BUTTONS,
+		valueProducer = { isReaderZoomButtonsEnabled },
+	)
+
 	val readerSettings = ReaderSettings(
 		parentScope = viewModelScope,
 		settings = settings,

app/src/main/kotlin/org/koitharu/kotatsu/reader/ui/config/ReaderSettings.kt

@@ -32,6 +32,9 @@ class ReaderSettings(
 	val isPagesNumbersEnabled: Boolean
 		get() = settings.isPagesNumbersEnabled
 
+	val isZoomControlsEnabled: Boolean
+		get() = settings.isReaderZoomButtonsEnabled
+
 	fun applyBackground(view: View) {
 		val bg = settings.readerBackground
 		view.background = bg.resolve(view.context)
@@ -74,6 +77,7 @@ class ReaderSettings(
 				key == AppSettings.KEY_ZOOM_MODE ||
 				key == AppSettings.KEY_PAGES_NUMBERS ||
 				key == AppSettings.KEY_WEBTOON_ZOOM ||
+				key == AppSettings.KEY_READER_ZOOM_BUTTONS ||
 				key == AppSettings.KEY_READER_BACKGROUND
 			) {
 				notifyChanged()

app/src/main/kotlin/org/koitharu/kotatsu/reader/ui/pager/BasePageHolder.kt

@@ -13,7 +13,7 @@ import org.koitharu.kotatsu.reader.ui.config.ReaderSettings
 abstract class BasePageHolder<B : ViewBinding>(
 	protected val binding: B,
 	loader: PageLoader,
-	private val settings: ReaderSettings,
+	protected val settings: ReaderSettings,
 	networkState: NetworkState,
 	exceptionResolver: ExceptionResolver,
 ) : RecyclerView.ViewHolder(binding.root), PageHolderDelegate.Callback {

app/src/main/kotlin/org/koitharu/kotatsu/reader/ui/pager/standard/PageHolder.kt

@@ -40,6 +40,12 @@ open class PageHolder(
 		@Suppress("LeakingThis")
 		bindingInfo.buttonErrorDetails.setOnClickListener(this)
 		binding.textViewNumber.isVisible = settings.isPagesNumbersEnabled
+		binding.zoomControl.listener = SsivZoomListener(binding.ssiv)
+	}
+
+	override fun onConfigChanged() {
+		super.onConfigChanged()
+		binding.zoomControl.isVisible = settings.isZoomControlsEnabled
 	}
 
 	@SuppressLint("SetTextI18n")

app/src/main/kotlin/org/koitharu/kotatsu/reader/ui/pager/standard/SsivZoomListener.kt

@@ -0,0 +1,28 @@
+package org.koitharu.kotatsu.reader.ui.pager.standard
+
+import android.view.animation.DecelerateInterpolator
+import com.davemorrissey.labs.subscaleview.SubsamplingScaleImageView
+import org.koitharu.kotatsu.core.ui.widgets.ZoomControl
+
+class SsivZoomListener(
+	private val ssiv: SubsamplingScaleImageView,
+) : ZoomControl.ZoomControlListener {
+
+	override fun onZoomIn() {
+		scaleBy(1.2f)
+	}
+
+	override fun onZoomOut() {
+		scaleBy(0.8f)
+	}
+
+	private fun scaleBy(factor: Float) {
+		val center = ssiv.getCenter() ?: return
+		val newScale = ssiv.scale * factor
+		ssiv.animateScaleAndCenter(newScale, center)?.apply {
+			withDuration(ssiv.resources.getInteger(android.R.integer.config_shortAnimTime).toLong())
+			withInterpolator(DecelerateInterpolator())
+			start()
+		}
+	}
+}

app/src/main/kotlin/org/koitharu/kotatsu/reader/ui/pager/webtoon/WebtoonReaderFragment.kt

@@ -4,6 +4,7 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.ViewGroup
 import android.view.animation.DecelerateInterpolator
+import androidx.core.view.isVisible
 import com.google.android.material.snackbar.Snackbar
 import dagger.hilt.android.AndroidEntryPoint
 import kotlinx.coroutines.async
@@ -45,10 +46,14 @@ class WebtoonReaderFragment : BaseReaderFragment<FragmentReaderWebtoonBinding>()
 			adapter = readerAdapter
 			addOnPageScrollListener(PageScrollListener())
 		}
+		binding.zoomControl.listener = binding.frame
 
 		viewModel.isWebtoonZoomEnabled.observe(viewLifecycleOwner) {
 			binding.frame.isZoomEnable = it
 		}
+		viewModel.isZoomControlEnabled.observe(viewLifecycleOwner) {
+			binding.zoomControl.isVisible = it
+		}
 	}
 
 	override fun onDestroyView() {

app/src/main/kotlin/org/koitharu/kotatsu/reader/ui/pager/webtoon/WebtoonScalingFrame.kt

@@ -18,6 +18,7 @@ import android.widget.FrameLayout
 import android.widget.OverScroller
 import androidx.core.view.GestureDetectorCompat
 import androidx.core.view.ViewConfigurationCompat
+import org.koitharu.kotatsu.core.ui.widgets.ZoomControl
 import org.koitharu.kotatsu.core.util.ext.getAnimationDuration
 
 private const val MAX_SCALE = 2.5f
@@ -27,7 +28,9 @@ class WebtoonScalingFrame @JvmOverloads constructor(
 	context: Context,
 	attrs: AttributeSet? = null,
 	defStyles: Int = 0,
-) : FrameLayout(context, attrs, defStyles), ScaleGestureDetector.OnScaleGestureListener {
+) : FrameLayout(context, attrs, defStyles),
+	ScaleGestureDetector.OnScaleGestureListener,
+	ZoomControl.ZoomControlListener {
 
 	private val targetChild by lazy(LazyThreadSafetyMode.NONE) { getChildAt(0) as WebtoonRecyclerView }
 
@@ -110,14 +113,14 @@ class WebtoonScalingFrame @JvmOverloads constructor(
 			KeyEvent.KEYCODE_ZOOM_IN,
 			KeyEvent.KEYCODE_NUMPAD_ADD,
 			KeyEvent.KEYCODE_PLUS -> {
-				smoothScaleTo(scale * 1.1f)
+				onZoomIn()
 				true
 			}
 
 			KeyEvent.KEYCODE_ZOOM_OUT,
 			KeyEvent.KEYCODE_NUMPAD_SUBTRACT,
 			KeyEvent.KEYCODE_MINUS -> {
-				smoothScaleTo(scale * 0.9f)
+				onZoomOut()
 				true
 			}
 
@@ -151,6 +154,14 @@ class WebtoonScalingFrame @JvmOverloads constructor(
 		halfHeight = h / 2f
 	}
 
+	override fun onZoomIn() {
+		smoothScaleTo(scale * 1.1f)
+	}
+
+	override fun onZoomOut() {
+		smoothScaleTo(scale * 0.9f)
+	}
+
 	private fun invalidateTarget() {
 		adjustBounds()
 		targetChild.run {

app/src/main/res/drawable/ic_zoom_in.xml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<vector
+	xmlns:android="http://schemas.android.com/apk/res/android"
+	android:width="24dp"
+	android:height="24dp"
+	android:tint="?colorControlNormal"
+	android:viewportWidth="24"
+	android:viewportHeight="24">
+	<path
+		android:fillColor="#000000"
+		android:pathData="M15.5,14L20.5,19L19,20.5L14,15.5V14.71L13.73,14.43C12.59,15.41 11.11,16 9.5,16A6.5,6.5 0 0,1 3,9.5A6.5,6.5 0 0,1 9.5,3A6.5,6.5 0 0,1 16,9.5C16,11.11 15.41,12.59 14.43,13.73L14.71,14H15.5M9.5,14C12,14 14,12 14,9.5C14,7 12,5 9.5,5C7,5 5,7 5,9.5C5,12 7,14 9.5,14M12,10H10V12H9V10H7V9H9V7H10V9H12V10Z" />
+</vector>

app/src/main/res/drawable/ic_zoom_out.xml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<vector
+	xmlns:android="http://schemas.android.com/apk/res/android"
+	android:width="24dp"
+	android:height="24dp"
+	android:tint="?colorControlNormal"
+	android:viewportWidth="24"
+	android:viewportHeight="24">
+	<path
+		android:fillColor="#000000"
+		android:pathData="M15.5,14H14.71L14.43,13.73C15.41,12.59 16,11.11 16,9.5A6.5,6.5 0 0,0 9.5,3A6.5,6.5 0 0,0 3,9.5A6.5,6.5 0 0,0 9.5,16C11.11,16 12.59,15.41 13.73,14.43L14,14.71V15.5L19,20.5L20.5,19L15.5,14M9.5,14C7,14 5,12 5,9.5C5,7 7,5 9.5,5C12,5 14,7 14,9.5C14,12 12,14 9.5,14M7,9H12V10H7V9Z" />
+</vector>

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

@@ -2,11 +2,12 @@
 <org.koitharu.kotatsu.reader.ui.pager.webtoon.WebtoonScalingFrame
 	xmlns:android="http://schemas.android.com/apk/res/android"
 	xmlns:app="http://schemas.android.com/apk/res-auto"
+	xmlns:tools="http://schemas.android.com/tools"
 	android:id="@+id/frame"
 	android:layout_width="match_parent"
 	android:layout_height="match_parent"
-	android:focusable="true"
+	android:defaultFocusHighlightEnabled="false"
-	android:defaultFocusHighlightEnabled="false">
+	android:focusable="true">
 
 	<org.koitharu.kotatsu.reader.ui.pager.webtoon.WebtoonRecyclerView
 		android:id="@+id/recyclerView"
@@ -15,4 +16,15 @@
 		android:defaultFocusHighlightEnabled="false"
 		android:orientation="vertical"
 		app:layoutManager="org.koitharu.kotatsu.reader.ui.pager.webtoon.WebtoonLayoutManager" />
+
+	<org.koitharu.kotatsu.core.ui.widgets.ZoomControl
+		android:id="@+id/zoomControl"
+		android:layout_width="wrap_content"
+		android:layout_height="wrap_content"
+		android:layout_gravity="bottom|end"
+		android:layout_margin="16dp"
+		android:orientation="vertical"
+		android:visibility="gone"
+		tools:visibility="visible" />
+
 </org.koitharu.kotatsu.reader.ui.pager.webtoon.WebtoonScalingFrame>

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

@@ -27,4 +27,14 @@
 
 	<include layout="@layout/layout_page_info" />
 
+	<org.koitharu.kotatsu.core.ui.widgets.ZoomControl
+		android:id="@+id/zoomControl"
+		android:layout_width="wrap_content"
+		android:layout_height="wrap_content"
+		android:layout_gravity="bottom|end"
+		android:layout_margin="16dp"
+		android:orientation="vertical"
+		android:visibility="gone"
+		tools:visibility="visible" />
+
 </FrameLayout>

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

@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="utf-8"?>
+<merge
+	xmlns:android="http://schemas.android.com/apk/res/android"
+	xmlns:app="http://schemas.android.com/apk/res-auto"
+	xmlns:tools="http://schemas.android.com/tools"
+	android:layout_width="match_parent"
+	android:layout_height="match_parent"
+	tools:parentTag="android.widget.LinearLayout">
+
+	<com.google.android.material.imageview.ShapeableImageView
+		android:id="@+id/button_zoom_in"
+		android:layout_width="?minTouchTargetSize"
+		android:layout_height="?minTouchTargetSize"
+		android:layout_margin="4dp"
+		android:alpha="0.8"
+		android:background="@drawable/bg_circle_button"
+		android:contentDescription="@string/zoom_in"
+		android:padding="1dp"
+		android:scaleType="centerInside"
+		android:src="@drawable/ic_zoom_in"
+		android:tooltipText="@string/zoom_in"
+		app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.Kotatsu.Circle"
+		app:strokeColor="?colorOutline"
+		app:strokeWidth="1dp" />
+
+	<com.google.android.material.imageview.ShapeableImageView
+		android:id="@+id/button_zoom_out"
+		android:layout_width="?minTouchTargetSize"
+		android:layout_height="?minTouchTargetSize"
+		android:layout_margin="4dp"
+		android:alpha="0.8"
+		android:background="@drawable/bg_circle_button"
+		android:contentDescription="@string/zoom_out"
+		android:padding="1dp"
+		android:scaleType="centerInside"
+		android:src="@drawable/ic_zoom_out"
+		android:tooltipText="@string/zoom_out"
+		app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.Kotatsu.Circle"
+		app:strokeColor="?colorOutline"
+		app:strokeWidth="1dp" />
+
+
+</merge>

app/src/main/res/values/strings.xml

@@ -485,4 +485,8 @@
 	<string name="items_limit_exceeded">No more items can be added</string>
 	<string name="to_top">To top</string>
 	<string name="moved_to_top">Moved to top</string>
+	<string name="zoom_out">Zoom out</string>
+	<string name="zoom_in">Zoom in</string>
+	<string name="reader_zoom_buttons">Show zoom buttons</string>
+	<string name="reader_zoom_buttons_summary">Whether to show zoom control buttons in the bottom right corner</string>
 </resources>

app/src/main/res/xml/pref_reader.xml

@@ -48,6 +48,12 @@
 		android:title="@string/pages_animation"
 		app:useSimpleSummaryProvider="true" />
 
+	<SwitchPreferenceCompat
+		android:defaultValue="false"
+		android:key="reader_zoom_buttons"
+		android:summary="@string/reader_zoom_buttons_summary"
+		android:title="@string/reader_zoom_buttons" />
+
 	<SwitchPreferenceCompat
 		android:defaultValue="true"
 		android:key="reader_bar"