switch genre tags to material chips (#934)

* switch genre tags to material chips

* remove style

app/build.gradle.kts

@@ -226,7 +226,7 @@ dependencies {
 
     implementation("com.github.kizitonwose:AndroidTagGroup:1.6.0")
     implementation("com.github.chrisbanes:PhotoView:2.3.0")
-    implementation("com.github.carlosesco:DirectionalViewPager:a844dbca0a")
+    implementation("com.github.tachiyomiorg:DirectionalViewPager:1.0.0")
     implementation("com.github.florent37:viewtooltip:1.2.2")
     implementation("com.getkeepsafe.taptargetview:taptargetview:1.13.0")
 

app/src/main/java/eu/kanade/tachiyomi/ui/manga/MangaHeaderHolder.kt

@@ -3,6 +3,7 @@ package eu.kanade.tachiyomi.ui.manga
 import android.annotation.SuppressLint
 import android.content.res.ColorStateList
 import android.graphics.Color
+import android.view.LayoutInflater
 import android.view.MotionEvent
 import android.view.View
 import androidx.constraintlayout.widget.ConstraintLayout
@@ -12,6 +13,7 @@ import androidx.core.view.isInvisible
 import androidx.core.view.isVisible
 import coil.request.CachePolicy
 import com.google.android.material.button.MaterialButton
+import com.google.android.material.chip.Chip
 import eu.kanade.tachiyomi.R
 import eu.kanade.tachiyomi.data.database.models.Manga
 import eu.kanade.tachiyomi.data.image.coil.loadManga
@@ -98,9 +100,7 @@ class MangaHeaderHolder(
                 moreBgGradient.rotation = 180f
             }
             lessButton.setOnClickListener { collapseDesc() }
-            mangaGenresTags.setOnTagClickListener {
+
-                adapter.delegate.tagClicked(it)
-            }
             webviewButton.setOnClickListener { adapter.delegate.openInWebView() }
             shareButton.setOnClickListener { adapter.delegate.prepareToShareManga() }
             favoriteButton.setOnClickListener {
@@ -190,10 +190,7 @@ class MangaHeaderHolder(
         }
         binding.title.text = manga.title
 
-        if (manga.genre.isNullOrBlank().not()) binding.mangaGenresTags.setTags(
+        setGenreTags(binding, manga)
-            manga.genre?.split(",")?.map(String::trim)
-        )
-        else binding.mangaGenresTags.setTags(emptyList())
 
         if (manga.author == manga.artist || manga.artist.isNullOrBlank()) {
             binding.mangaAuthor.text = manga.author?.trim()
@@ -315,6 +312,28 @@ class MangaHeaderHolder(
         updateCover(manga)
     }
 
+    private fun setGenreTags(binding: MangaHeaderItemBinding, manga: Manga) {
+        with(binding.mangaGenresTags) {
+            removeAllViews()
+            if (manga.genre.isNullOrBlank().not()) {
+                (manga.getGenres() ?: emptyList()).map { genreText ->
+                    val chip = LayoutInflater.from(binding.root.context).inflate(
+                        R.layout.genre_chip,
+                        this,
+                        false
+                    ) as Chip
+                    val id = View.generateViewId()
+                    chip.id = id
+                    chip.text = genreText
+                    chip.setOnClickListener {
+                        adapter.delegate.tagClicked(genreText)
+                    }
+                    this.addView(chip)
+                }
+            }
+        }
+    }
+
     fun clearDescFocus() {
         binding ?: return
         binding.mangaSummary.setTextIsSelectable(false)

app/src/main/res/layout-sw600dp-land/manga_header_item.xml

@@ -296,19 +296,14 @@
         android:layout_height="wrap_content"
         app:constraint_referenced_ids="manga_summary,manga_summary_label,sub_button_scroll" />
 
-    <me.gujun.android.taggroup.TagGroup
+    <com.google.android.material.chip.ChipGroup
         android:id="@+id/manga_genres_tags"
-        style="@style/TagGroup"
         android:layout_width="0dp"
         android:layout_height="wrap_content"
         android:layout_marginStart="16dp"
         android:layout_marginTop="8dp"
         android:layout_marginEnd="16dp"
         android:visibility="gone"
-        app:atg_backgroundColor="@android:color/transparent"
-        app:atg_borderColor="?colorAccent"
-        app:atg_borderStrokeWidth="1dp"
-        app:atg_textColor="?colorAccent"
         app:layout_constrainedHeight="true"
         app:layout_constraintBottom_toTopOf="@id/manga_summary"
         app:layout_constraintEnd_toEndOf="parent"

app/src/main/res/layout-sw600dp-port/manga_header_item.xml

@@ -295,19 +295,14 @@
         android:layout_height="wrap_content"
         app:constraint_referenced_ids="manga_summary,manga_summary_label,sub_button_scroll" />
 
-    <me.gujun.android.taggroup.TagGroup
+    <com.google.android.material.chip.ChipGroup
         android:id="@+id/manga_genres_tags"
-        style="@style/TagGroup"
         android:layout_width="0dp"
         android:layout_height="wrap_content"
         android:layout_marginStart="16dp"
         android:layout_marginTop="8dp"
         android:layout_marginEnd="16dp"
         android:visibility="gone"
-        app:atg_backgroundColor="@android:color/transparent"
-        app:atg_borderColor="?colorAccent"
-        app:atg_borderStrokeWidth="1dp"
-        app:atg_textColor="?colorAccent"
         app:layout_constrainedHeight="true"
         app:layout_constraintBottom_toTopOf="@id/less_button"
         app:layout_constraintEnd_toEndOf="parent"

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

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<com.google.android.material.chip.Chip xmlns:android="http://schemas.android.com/apk/res/android"
+    android:id="@+id/action_chip"
+    style="@style/Theme.Widget.Chip.Outline"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    xmlns:tools="http://schemas.android.com/tools"
+    tools:layout_width="wrap_content"
+    tools:layout_height="30dp"
+    tools:text="This is A Test" />

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

@@ -295,19 +295,14 @@
         android:layout_height="wrap_content"
         app:constraint_referenced_ids="manga_summary,manga_summary_label,sub_button_scroll" />
 
-    <me.gujun.android.taggroup.TagGroup
+    <com.google.android.material.chip.ChipGroup
         android:id="@+id/manga_genres_tags"
-        style="@style/TagGroup"
         android:layout_width="0dp"
         android:layout_height="wrap_content"
         android:layout_marginStart="16dp"
         android:layout_marginTop="8dp"
         android:layout_marginEnd="16dp"
         android:visibility="gone"
-        app:atg_backgroundColor="@android:color/transparent"
-        app:atg_borderColor="?colorAccent"
-        app:atg_borderStrokeWidth="1dp"
-        app:atg_textColor="?colorAccent"
         app:layout_constrainedHeight="true"
         app:layout_constraintBottom_toTopOf="@id/less_button"
         app:layout_constraintEnd_toEndOf="parent"

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

@@ -297,6 +297,14 @@
         <item name="android:tint">?colorAccent</item>
     </style>
 
+    <style name="Theme.Widget.Chip.Outline" parent="Widget.MaterialComponents.Chip.Action">
+        <item name="chipBackgroundColor">?attr/colorSecondary</item>
+        <item name="android:textColor">?attr/colorAccent</item>
+        <item name="chipStrokeColor">?attr/colorAccent</item>
+        <item name="chipStrokeWidth">1dp</item>
+        <item name="android:checkable">false</item>
+    </style>
+
 
     <!--===-->
     <!--OLD-->