Implement remaining of ColorFilterSetting (#867)

Co-authored-by: GG Bond <whatever@tagkong.com>

app/src/main/kotlin/com/hippo/ehviewer/Settings.kt

@@ -198,6 +198,8 @@ object Settings : DataStorePreferences(null) {
     val readWithVolumeKeys = boolPref("reader_volume_keys", false)
     val readWithVolumeKeysInterval = intPref("reader_volume_keys_interval", 0)
     val readWithVolumeKeysInverted = boolPref("reader_volume_keys_inverted", false)
+    val grayScale = boolPref("pref_grayscale", false)
+    val invertedColors = boolPref("pref_inverted_colors", false)
 
     init {
         if ("CN" == Locale.getDefault().country) {

app/src/main/kotlin/com/hippo/ehviewer/ui/reader/ColorFilterSetting.kt

@@ -86,6 +86,14 @@ fun ColorFilterSetting() = Column {
         values = colorFilterValues,
         field = Settings.colorFilterMode.asMutableState(),
     )
+    SwitchChoice(
+        title = stringResource(id = R.string.pref_grayscale),
+        field = Settings.grayScale.asMutableState(),
+    )
+    SwitchChoice(
+        title = stringResource(id = R.string.pref_inverted_colors),
+        field = Settings.invertedColors.asMutableState(),
+    )
 }
 
 private val colorFilterValues = arrayOf("0", "1", "2", "3", "4", "5")

app/src/main/kotlin/com/hippo/ehviewer/ui/reader/PagerItem.kt

@@ -15,6 +15,8 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.graphics.ColorMatrix
 import androidx.compose.ui.graphics.asImageBitmap
 import androidx.compose.ui.graphics.painter.BitmapPainter
 import androidx.compose.ui.layout.ContentScale
@@ -26,6 +28,8 @@ import coil3.DrawableImage
 import coil3.Image
 import com.google.accompanist.drawablepainter.DrawablePainter
 import com.hippo.ehviewer.R
+import com.hippo.ehviewer.Settings
+import com.hippo.ehviewer.collectAsState
 import eu.kanade.tachiyomi.source.model.Page
 import eu.kanade.tachiyomi.ui.reader.loader.PageLoader
 import eu.kanade.tachiyomi.ui.reader.model.ReaderPage
@@ -61,11 +65,19 @@ fun PagerItem(
             val rect = page.image!!.rect
             val painter = remember(image) { image.toPainter(rect) }
             val contentScale = if (webtoon) ContentScale.FillWidth else ContentScale.Inside
+            val grayScale by Settings.grayScale.collectAsState()
+            val invert by Settings.invertedColors.collectAsState()
             Image(
                 painter = painter,
                 contentDescription = null,
                 modifier = Modifier.fillMaxSize(),
                 contentScale = contentScale,
+                colorFilter = when {
+                    grayScale && invert -> grayScaleAndInvertFilter
+                    grayScale -> grayScaleFilter
+                    invert -> invertFilter
+                    else -> null
+                },
             )
             if (!webtoon) {
                 val size = painter.intrinsicSize
@@ -105,3 +117,21 @@ private fun Image.toPainter(rect: IntRect) = when (this) {
 }
 
 private const val DEFAULT_ASPECT = 1 / 1.4125f
+
+private val invertMatrix = ColorMatrix(
+    floatArrayOf(
+        -1f, 0f, 0f, 0f, 255f,
+        0f, -1f, 0f, 0f, 255f,
+        0f, 0f, -1f, 0f, 255f,
+        0f, 0f, 0f, 1f, 0f,
+    ),
+)
+private val grayScaleMatrix = ColorMatrix().apply { setToSaturation(0f) }
+private val grayScaleAndInvertMatrix = ColorMatrix().also { mtx ->
+    mtx.setToSaturation(0f)
+    mtx *= invertMatrix
+}
+
+private val grayScaleFilter = ColorFilter.colorMatrix(grayScaleMatrix)
+private val invertFilter = ColorFilter.colorMatrix(invertMatrix)
+private val grayScaleAndInvertFilter = ColorFilter.colorMatrix(grayScaleAndInvertMatrix)