New tablet layouts for manga details

Portrait: Bigger cover
Landscape:
* flipped summary items. From top to bottom: Start Reading, Tags, Summary
* Tags will always show in this layout, and summary will always be expanded
This commit is contained in:
Jays2Kings 2021-07-05 13:17:49 -04:00
parent 183f984cc5
commit 11f05133af
3 changed files with 831 additions and 10 deletions

View File

@ -127,17 +127,20 @@ class MangaHeaderHolder(
trackButton.setOnClickListener { adapter.delegate.showTrackingSheet() } trackButton.setOnClickListener { adapter.delegate.showTrackingSheet() }
if (startExpanded) expandDesc() if (startExpanded) expandDesc()
else collapseDesc() else collapseDesc()
if (isTablet) chapterLayout.isVisible = false if (isTablet) {
chapterLayout.isVisible = false
expandDesc()
}
} }
} }
private fun expandDesc() { private fun expandDesc() {
binding ?: return binding ?: return
if (binding.moreButton.visibility == View.VISIBLE) { if (binding.moreButton.visibility == View.VISIBLE || isTablet) {
binding.mangaSummary.maxLines = Integer.MAX_VALUE binding.mangaSummary.maxLines = Integer.MAX_VALUE
binding.mangaSummary.setTextIsSelectable(true) binding.mangaSummary.setTextIsSelectable(true)
binding.mangaGenresTags.isVisible = true binding.mangaGenresTags.isVisible = true
binding.lessButton.isVisible = true binding.lessButton.isVisible = !isTablet
binding.moreButtonGroup.isVisible = false binding.moreButtonGroup.isVisible = false
binding.title.maxLines = Integer.MAX_VALUE binding.title.maxLines = Integer.MAX_VALUE
binding.mangaSummary.requestFocus() binding.mangaSummary.requestFocus()
@ -146,12 +149,13 @@ class MangaHeaderHolder(
private fun collapseDesc() { private fun collapseDesc() {
binding ?: return binding ?: return
if (isTablet) return
binding.mangaSummary.setTextIsSelectable(false) binding.mangaSummary.setTextIsSelectable(false)
binding.mangaSummary.isClickable = true binding.mangaSummary.isClickable = true
binding.mangaSummary.maxLines = 3 binding.mangaSummary.maxLines = 3
binding.mangaGenresTags.isVisible = false binding.mangaGenresTags.isVisible = isTablet
binding.lessButton.isVisible = false binding.lessButton.isVisible = false
binding.moreButtonGroup.isVisible = true binding.moreButtonGroup.isVisible = !isTablet
binding.title.maxLines = 4 binding.title.maxLines = 4
adapter.recyclerView.post { adapter.recyclerView.post {
adapter.delegate.updateScroll() adapter.delegate.updateScroll()
@ -370,10 +374,10 @@ class MangaHeaderHolder(
binding.subItemGroup.isVisible = false binding.subItemGroup.isVisible = false
binding.startReadingButton.isVisible = false binding.startReadingButton.isVisible = false
if (binding.moreButton.isVisible || binding.moreButton.isInvisible) { if (binding.moreButton.isVisible || binding.moreButton.isInvisible) {
binding.moreButtonGroup.isInvisible = true binding.moreButtonGroup.isInvisible = !isTablet
} else { } else {
binding.lessButton.isVisible = false binding.lessButton.isVisible = false
binding.mangaGenresTags.isVisible = false binding.mangaGenresTags.isVisible = isTablet
} }
} }
@ -406,9 +410,10 @@ class MangaHeaderHolder(
binding.subItemGroup.isVisible = true binding.subItemGroup.isVisible = true
if (!showMoreButton) binding.moreButtonGroup.isVisible = false if (!showMoreButton) binding.moreButtonGroup.isVisible = false
else { else {
if (binding.mangaSummary.maxLines != Integer.MAX_VALUE) binding.moreButtonGroup.isVisible = true if (binding.mangaSummary.maxLines != Integer.MAX_VALUE) {
else { binding.moreButtonGroup.isVisible = !isTablet
binding.lessButton.isVisible = true } else {
binding.lessButton.isVisible = !isTablet
binding.mangaGenresTags.isVisible = true binding.mangaGenresTags.isVisible = true
} }
} }

View File

@ -0,0 +1,408 @@
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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/manga_header_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:id="@+id/true_backdrop"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="@id/bottom_line"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_min="200dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0"
tools:background="@color/material_red_400" />
<ImageView
android:id="@+id/backdrop"
android:layout_width="0dp"
android:layout_height="0dp"
android:alpha="0.1"
android:scaleType="centerCrop"
app:layout_constraintBottom_toBottomOf="@+id/true_backdrop"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/true_backdrop"
tools:src="@mipmap/ic_launcher" />
<View
android:id="@+id/backdrop_gradient"
android:layout_width="match_parent"
android:layout_height="300dp"
android:background="@drawable/gradient_shape"
android:backgroundTint="?android:attr/colorBackground"
app:layout_constraintBottom_toBottomOf="@+id/true_backdrop" />
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="?android:attr/colorBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="@id/backdrop_gradient" />
<View
android:id="@+id/top_view"
android:layout_width="match_parent"
android:layout_height="100dp"
app:layout_constraintBottom_toTopOf="@id/cover_card"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.google.android.material.card.MaterialCardView
android:id="@+id/cover_card"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="12dp"
android:layout_marginBottom="16dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/top_view"
app:layout_constraintVertical_bias="1.0">
<ImageView
android:id="@+id/manga_cover"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:clickable="true"
android:contentDescription="@string/cover_of_image"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
android:maxHeight="300dp"
tools:background="@color/material_grey_700"
tools:src="@mipmap/ic_launcher" />
</com.google.android.material.card.MaterialCardView>
<TextView
android:id="@+id/title"
style="@style/TextAppearance.MaterialComponents.Headline6"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="12dp"
android:layout_marginEnd="16dp"
android:ellipsize="end"
android:maxLines="4"
android:text="@string/title"
android:textIsSelectable="false"
android:textSize="20sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/cover_card"
app:layout_constraintTop_toTopOf="@id/cover_card"
tools:text="Title Example" />
<TextView
android:id="@+id/manga_author"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:ellipsize="end"
android:maxLines="2"
android:text="@string/author"
android:textAppearance="@style/TextAppearance.Regular.Body1.SemiBold"
android:textColor="?android:attr/textColorSecondary"
android:textIsSelectable="false"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@id/title"
app:layout_constraintTop_toBottomOf="@+id/title" />
<TextView
android:id="@+id/manga_status"
style="@style/TextAppearance.Regular.Body1.Secondary"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_marginEnd="16dp"
android:text="@string/unknown_status"
android:textIsSelectable="false"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@id/title"
app:layout_constraintTop_toBottomOf="@+id/manga_author" />
<com.google.android.material.textview.MaterialTextView
android:id="@+id/manga_source"
style="@style/TextAppearance.Regular.Body1.Secondary"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:ellipsize="end"
android:maxLines="1"
android:textIsSelectable="false"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@id/title"
app:layout_constraintTop_toBottomOf="@id/manga_status"
tools:text="Mangadex (EN)" />
<androidx.constraintlayout.widget.Barrier
android:id="@+id/bottom_line"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="6dp"
android:orientation="horizontal"
app:barrierDirection="bottom"
app:constraint_referenced_ids="manga_source,cover_card" />
<HorizontalScrollView
android:id="@+id/sub_button_scroll"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:requiresFadingEdge="horizontal"
android:scrollbars="none"
app:layout_constraintBottom_toTopOf="@id/start_reading_button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/bottom_line">
<LinearLayout
android:id="@+id/button_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="14dp"
android:orientation="horizontal"
android:paddingStart="16dp"
android:paddingEnd="16dp">
<com.google.android.material.button.MaterialButton
android:id="@+id/favorite_button"
style="@style/Theme.Widget.Button.RoundedOutline"
android:text="@string/add_to_library"
app:icon="@drawable/ic_heart_outline_24dp" />
<com.google.android.material.button.MaterialButton
android:id="@+id/track_button"
style="@style/Theme.Widget.Button.RoundedOutline"
android:layout_marginStart="6dp"
android:text="@string/tracking"
app:icon="@drawable/ic_sync_24dp" />
<ImageView
android:id="@+id/webview_button"
style="@style/Theme.Widget.CustomImageButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="6dp"
android:layout_marginEnd="6dp"
android:contentDescription="@string/open_in_webview"
android:padding="5dp"
android:src="@drawable/ic_open_in_webview_24dp"
android:tooltipText="@string/open_in_webview" />
<ImageView
android:id="@+id/share_button"
style="@style/Theme.Widget.CustomImageButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="0dp"
android:layout_marginEnd="6dp"
android:contentDescription="@string/share"
android:padding="5dp"
android:src="@drawable/ic_share_24dp"
android:tooltipText="@string/share" />
</LinearLayout>
</HorizontalScrollView>
<com.google.android.material.textview.MaterialTextView
android:id="@+id/manga_summary_label"
style="@style/TextAppearance.MaterialComponents.Headline6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="6dp"
android:layout_marginEnd="16dp"
android:text="@string/description"
android:textIsSelectable="false"
android:textSize="17sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/start_reading_button"
app:layout_constraintBottom_toTopOf="@id/manga_genres_tags"
tools:text="About this manga" />
<TextView
android:id="@+id/manga_summary"
style="@style/TextAppearance.Regular.Body1.Secondary"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="16dp"
android:clickable="true"
android:focusable="true"
android:maxLines="3"
app:layout_constraintBottom_toTopOf="@id/less_button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/manga_genres_tags"
tools:maxLines="10"
tools:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." />
<View
android:id="@+id/more_bg_gradient"
android:layout_width="60dp"
android:layout_height="16sp"
android:layout_marginEnd="30dp"
android:background="@drawable/full_gradient"
android:backgroundTint="?android:attr/colorBackground"
app:layout_constraintBottom_toBottomOf="@id/manga_summary"
app:layout_constraintEnd_toEndOf="@id/more_button" />
<View
android:id="@+id/more_bg_solid"
android:layout_width="0dp"
android:layout_height="16sp"
android:layout_marginStart="45dp"
android:background="?android:attr/colorBackground"
app:layout_constraintBottom_toBottomOf="@id/manga_summary"
app:layout_constraintEnd_toEndOf="@id/more_button"
app:layout_constraintStart_toStartOf="@id/more_button" />
<View
android:id="@+id/more_guide"
android:layout_width="1dp"
android:layout_height="15sp"
app:layout_constraintEnd_toEndOf="@id/manga_summary"
app:layout_constraintTop_toBottomOf="@id/manga_summary" />
<com.google.android.material.button.MaterialButton
android:id="@+id/more_button"
style="@style/Theme.Widget.Button.TextButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:text="@string/more"
android:textAlignment="viewEnd"
app:layout_constraintBottom_toBottomOf="@id/more_guide"
app:layout_constraintEnd_toEndOf="parent"
app:rippleColor="@null" />
<androidx.constraintlayout.widget.Group
android:id="@+id/more_button_group"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:constraint_referenced_ids="more_button,more_bg_gradient,more_bg_solid" />
<androidx.constraintlayout.widget.Group
android:id="@+id/sub_item_group"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:constraint_referenced_ids="manga_summary,manga_summary_label,sub_button_scroll" />
<me.gujun.android.taggroup.TagGroup
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:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/manga_summary_label"
tools:layout_height="100dp" />
<com.google.android.material.button.MaterialButton
android:id="@+id/less_button"
style="@style/Theme.Widget.Button.TextButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:text="@string/less"
android:textAlignment="textEnd"
android:visibility="gone"
app:layout_constraintBottom_toTopOf="@id/start_reading_button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/manga_summary"
app:rippleColor="@null" />
<com.google.android.material.button.MaterialButton
android:id="@+id/start_reading_button"
style="@style/Theme.Widget.Button.Primary"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="12dp"
android:layout_marginEnd="16dp"
android:text="@string/start_reading"
app:layout_constraintBottom_toTopOf="@id/manga_summary_label"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/sub_button_scroll"
tools:text="Continue Reading Chapter 17.1" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/chapter_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:background="@drawable/list_item_selector"
android:tooltipText="@string/sort_and_filter"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="@id/less_button">
<com.google.android.material.textview.MaterialTextView
android:id="@+id/chapters_title"
style="@style/TextAppearance.MaterialComponents.Headline6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="12dp"
android:layout_marginBottom="12dp"
android:maxLines="1"
android:text="@string/chapters"
android:textSize="17sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@id/filters_text"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="@+id/filter_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="12dp"
android:background="@null"
android:padding="5dp"
android:src="@drawable/ic_filter_list_24dp"
app:tint="?colorAccent"
app:layout_constraintBottom_toBottomOf="@id/chapters_title"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="@id/chapters_title" />
<com.google.android.material.textview.MaterialTextView
android:id="@+id/filters_text"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="6dp"
android:maxLines="2"
android:padding="5dp"
android:textAlignment="textEnd"
android:textColor="?android:textColorHint"
app:layout_constraintBaseline_toBaselineOf="@id/chapters_title"
app:layout_constraintBottom_toBottomOf="@id/filter_button"
app:layout_constraintEnd_toStartOf="@id/filter_button"
app:layout_constraintStart_toEndOf="@+id/chapters_title"
app:layout_constraintTop_toTopOf="@id/filter_button"
tools:text="Read, Unread, Bookmarked, Downloaded, All" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -0,0 +1,408 @@
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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/manga_header_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:id="@+id/true_backdrop"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="@id/bottom_line"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_min="200dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0"
tools:background="@color/material_red_400" />
<ImageView
android:id="@+id/backdrop"
android:layout_width="0dp"
android:layout_height="0dp"
android:alpha="0.1"
android:scaleType="centerCrop"
app:layout_constraintBottom_toBottomOf="@+id/true_backdrop"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/true_backdrop"
tools:src="@mipmap/ic_launcher" />
<View
android:id="@+id/backdrop_gradient"
android:layout_width="match_parent"
android:layout_height="300dp"
android:background="@drawable/gradient_shape"
android:backgroundTint="?android:attr/colorBackground"
app:layout_constraintBottom_toBottomOf="@+id/true_backdrop" />
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="?android:attr/colorBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="@id/backdrop_gradient" />
<View
android:id="@+id/top_view"
android:layout_width="match_parent"
android:layout_height="100dp"
app:layout_constraintBottom_toTopOf="@id/cover_card"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.google.android.material.card.MaterialCardView
android:id="@+id/cover_card"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="12dp"
android:layout_marginBottom="16dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/top_view"
app:layout_constraintVertical_bias="1.0">
<ImageView
android:id="@+id/manga_cover"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:clickable="true"
android:contentDescription="@string/cover_of_image"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
android:maxHeight="500dp"
tools:background="@color/material_grey_700"
tools:src="@mipmap/ic_launcher" />
</com.google.android.material.card.MaterialCardView>
<TextView
android:id="@+id/title"
style="@style/TextAppearance.MaterialComponents.Headline6"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="12dp"
android:layout_marginEnd="16dp"
android:ellipsize="end"
android:maxLines="4"
android:text="@string/title"
android:textIsSelectable="false"
android:textSize="20sp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/cover_card"
app:layout_constraintTop_toTopOf="@id/cover_card"
tools:text="Title Example" />
<TextView
android:id="@+id/manga_author"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:ellipsize="end"
android:maxLines="2"
android:text="@string/author"
android:textAppearance="@style/TextAppearance.Regular.Body1.SemiBold"
android:textColor="?android:attr/textColorSecondary"
android:textIsSelectable="false"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@id/title"
app:layout_constraintTop_toBottomOf="@+id/title" />
<TextView
android:id="@+id/manga_status"
style="@style/TextAppearance.Regular.Body1.Secondary"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_marginEnd="16dp"
android:text="@string/unknown_status"
android:textIsSelectable="false"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@id/title"
app:layout_constraintTop_toBottomOf="@+id/manga_author" />
<com.google.android.material.textview.MaterialTextView
android:id="@+id/manga_source"
style="@style/TextAppearance.Regular.Body1.Secondary"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:ellipsize="end"
android:maxLines="1"
android:textIsSelectable="false"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@id/title"
app:layout_constraintTop_toBottomOf="@id/manga_status"
tools:text="Mangadex (EN)" />
<androidx.constraintlayout.widget.Barrier
android:id="@+id/bottom_line"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="6dp"
android:orientation="horizontal"
app:barrierDirection="bottom"
app:constraint_referenced_ids="manga_source,cover_card" />
<HorizontalScrollView
android:id="@+id/sub_button_scroll"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:requiresFadingEdge="horizontal"
android:scrollbars="none"
app:layout_constraintBottom_toTopOf="@id/manga_summary_label"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/bottom_line">
<LinearLayout
android:id="@+id/button_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="14dp"
android:orientation="horizontal"
android:paddingStart="16dp"
android:paddingEnd="16dp">
<com.google.android.material.button.MaterialButton
android:id="@+id/favorite_button"
style="@style/Theme.Widget.Button.RoundedOutline"
android:text="@string/add_to_library"
app:icon="@drawable/ic_heart_outline_24dp" />
<com.google.android.material.button.MaterialButton
android:id="@+id/track_button"
style="@style/Theme.Widget.Button.RoundedOutline"
android:layout_marginStart="6dp"
android:text="@string/tracking"
app:icon="@drawable/ic_sync_24dp" />
<ImageView
android:id="@+id/webview_button"
style="@style/Theme.Widget.CustomImageButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="6dp"
android:layout_marginEnd="6dp"
android:contentDescription="@string/open_in_webview"
android:padding="5dp"
android:src="@drawable/ic_open_in_webview_24dp"
android:tooltipText="@string/open_in_webview" />
<ImageView
android:id="@+id/share_button"
style="@style/Theme.Widget.CustomImageButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginStart="0dp"
android:layout_marginEnd="6dp"
android:contentDescription="@string/share"
android:padding="5dp"
android:src="@drawable/ic_share_24dp"
android:tooltipText="@string/share" />
</LinearLayout>
</HorizontalScrollView>
<com.google.android.material.textview.MaterialTextView
android:id="@+id/manga_summary_label"
style="@style/TextAppearance.MaterialComponents.Headline6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="6dp"
android:layout_marginEnd="16dp"
android:text="@string/description"
android:textIsSelectable="false"
android:textSize="17sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/sub_button_scroll"
tools:text="About this manga" />
<TextView
android:id="@+id/manga_summary"
style="@style/TextAppearance.Regular.Body1.Secondary"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="16dp"
android:clickable="true"
android:focusable="true"
android:maxLines="3"
app:layout_constraintBottom_toTopOf="@id/manga_genres_tags"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/manga_summary_label"
tools:maxLines="10"
tools:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." />
<View
android:id="@+id/more_bg_gradient"
android:layout_width="60dp"
android:layout_height="16sp"
android:layout_marginEnd="30dp"
android:background="@drawable/full_gradient"
android:backgroundTint="?android:attr/colorBackground"
app:layout_constraintBottom_toBottomOf="@id/manga_summary"
app:layout_constraintEnd_toEndOf="@id/more_button" />
<View
android:id="@+id/more_bg_solid"
android:layout_width="0dp"
android:layout_height="16sp"
android:layout_marginStart="45dp"
android:background="?android:attr/colorBackground"
app:layout_constraintBottom_toBottomOf="@id/manga_summary"
app:layout_constraintEnd_toEndOf="@id/more_button"
app:layout_constraintStart_toStartOf="@id/more_button" />
<View
android:id="@+id/more_guide"
android:layout_width="1dp"
android:layout_height="15sp"
app:layout_constraintEnd_toEndOf="@id/manga_summary"
app:layout_constraintTop_toBottomOf="@id/manga_summary" />
<com.google.android.material.button.MaterialButton
android:id="@+id/more_button"
style="@style/Theme.Widget.Button.TextButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
android:text="@string/more"
android:textAlignment="viewEnd"
app:layout_constraintBottom_toBottomOf="@id/more_guide"
app:layout_constraintEnd_toEndOf="parent"
app:rippleColor="@null" />
<androidx.constraintlayout.widget.Group
android:id="@+id/more_button_group"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:constraint_referenced_ids="more_button,more_bg_gradient,more_bg_solid" />
<androidx.constraintlayout.widget.Group
android:id="@+id/sub_item_group"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:constraint_referenced_ids="manga_summary,manga_summary_label,sub_button_scroll" />
<me.gujun.android.taggroup.TagGroup
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:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/manga_summary"
tools:layout_height="100dp" />
<com.google.android.material.button.MaterialButton
android:id="@+id/less_button"
style="@style/Theme.Widget.Button.TextButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:text="@string/less"
android:textAlignment="textEnd"
android:visibility="gone"
app:layout_constraintBottom_toTopOf="@id/start_reading_button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/manga_genres_tags"
app:rippleColor="@null"
tools:visibility="visible" />
<com.google.android.material.button.MaterialButton
android:id="@+id/start_reading_button"
style="@style/Theme.Widget.Button.Primary"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="12dp"
android:layout_marginEnd="16dp"
android:text="@string/start_reading"
app:layout_constraintBottom_toTopOf="@id/chapter_layout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/less_button"
tools:text="Continue Reading Chapter 17.1" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/chapter_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:background="@drawable/list_item_selector"
android:tooltipText="@string/sort_and_filter"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="@id/start_reading_button">
<com.google.android.material.textview.MaterialTextView
android:id="@+id/chapters_title"
style="@style/TextAppearance.MaterialComponents.Headline6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="12dp"
android:layout_marginBottom="12dp"
android:maxLines="1"
android:text="@string/chapters"
android:textSize="17sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@id/filters_text"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="@+id/filter_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="12dp"
android:background="@null"
android:padding="5dp"
android:src="@drawable/ic_filter_list_24dp"
app:tint="?colorAccent"
app:layout_constraintBottom_toBottomOf="@id/chapters_title"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="@id/chapters_title" />
<com.google.android.material.textview.MaterialTextView
android:id="@+id/filters_text"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="6dp"
android:maxLines="2"
android:padding="5dp"
android:textAlignment="textEnd"
android:textColor="?android:textColorHint"
app:layout_constraintBaseline_toBaselineOf="@id/chapters_title"
app:layout_constraintBottom_toBottomOf="@id/filter_button"
app:layout_constraintEnd_toStartOf="@id/filter_button"
app:layout_constraintStart_toEndOf="@+id/chapters_title"
app:layout_constraintTop_toTopOf="@id/filter_button"
tools:text="Read, Unread, Bookmarked, Downloaded, All" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>