mihon/app/src/main/res/layout/manga_info_header.xml
Soitora 57aefcd917
New manga info expander (#5771)
* Replace "More" with Arrows

We used to have arrows but it was set away from the description which took a lot of space.

It was changed to "More" text, but with the recent design changes I think it'd look better to get a mix between them both.

* Properly align icons

Co-Authored-By: Andreas <6576096+ghostbear@users.noreply.github.com>

* Expand support to Tablets

Get it... expand... hehe 😎

* Fix expanded width

Also fixes so that the constraint for the toggleLess is dependant on the right thing

* Give info toggles its own space

Uses its own margin now to push info rather than just being attached as a info margin.

* Remove weird duplicates I did not add

I did not add these but I don't see a reason to keep dupes

* Add bottom scrim

* Change to centered arrow under info

Anyone wanna experiment/build on top off then feel free to tweak

* Add background glow to icon for contrast

Co-Authored-By: Andreas <6576096+ghostbear@users.noreply.github.com>

Co-authored-by: Andreas <6576096+ghostbear@users.noreply.github.com>
Co-authored-by: Andreas <andreas.everos@gmail.com>
2021-08-26 22:07:30 -04:00

289 lines
12 KiB
XML

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.motion.widget.MotionLayout 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="wrap_content"
android:orientation="vertical"
app:layoutDescription="@xml/manga_info_header_scene"
tools:context=".ui.browse.source.browse.BrowseSourceController">
<ImageView
android:id="@+id/backdrop"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="-32dp"
android:alpha="0.2"
android:scaleType="centerCrop"
app:layout_constraintBottom_toBottomOf="@+id/manga_cover"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:background="@mipmap/ic_launcher"
tools:ignore="ContentDescription" />
<View
android:id="@+id/backdrop_overlay"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="@drawable/manga_backdrop_gradient"
android:backgroundTint="?android:attr/colorBackground"
app:layout_constraintBottom_toBottomOf="@+id/backdrop"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="@+id/manga_cover"
android:layout_width="100dp"
android:layout_height="0dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:background="@drawable/rounded_rectangle"
android:contentDescription="@string/description_cover"
android:maxWidth="100dp"
android:scaleType="centerCrop"
app:layout_constraintDimensionRatio="w,3:2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:layout_height="133dp"
tools:src="@mipmap/ic_launcher" />
<LinearLayout
android:id="@+id/manga_detail"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:layout_marginBottom="8dp"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="@+id/manga_cover"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/manga_cover">
<TextView
android:id="@+id/manga_full_title"
style="@style/TextAppearance.Medium.Title"
android:layout_width="match_parent"
android:layout_height="60sp"
android:layout_marginBottom="4dp"
android:gravity="bottom"
android:text="@string/manga_info_full_title_label"
android:textIsSelectable="false"
app:autoSizeMaxTextSize="20sp"
app:autoSizeMinTextSize="12sp"
app:autoSizeStepGranularity="2sp"
app:autoSizeTextType="uniform" />
<TextView
android:id="@+id/manga_author"
style="@style/TextAppearance.Regular.Body1.Secondary.Bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textIsSelectable="false"
tools:text="Author" />
<TextView
android:id="@+id/manga_artist"
style="@style/TextAppearance.Regular.Body1.Secondary.Bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textIsSelectable="false"
tools:text="Artist" />
<LinearLayout
android:id="@+id/manga_status_row"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="4dp">
<TextView
android:id="@+id/manga_status"
style="@style/TextAppearance.Regular.Body1.Secondary"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:ellipsize="end"
android:maxLines="1"
android:textIsSelectable="false"
tools:text="Status" />
<TextView
style="@style/TextAppearance.Regular.Body1.Secondary"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="4dp"
android:layout_marginEnd="4dp"
android:text="•"
android:textIsSelectable="false"
tools:ignore="HardcodedText" />
<TextView
android:id="@+id/manga_source"
style="@style/TextAppearance.Regular.Body1.Secondary"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLines="1"
android:textIsSelectable="false"
tools:text="Source" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="@+id/manga_actions"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="-24dp"
android:layout_marginEnd="16dp"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/backdrop">
<com.google.android.material.button.MaterialButton
android:id="@+id/btn_favorite"
style="@style/Widget.Tachiyomi.Button.ActionButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="@string/add_to_library"
app:icon="@drawable/ic_favorite_border_24dp" />
<com.google.android.material.button.MaterialButton
android:id="@+id/btn_tracking"
style="@style/Widget.Tachiyomi.Button.ActionButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="@string/manga_tracking_tab"
android:visibility="gone"
app:icon="@drawable/ic_sync_24dp"
tools:visibility="visible" />
<com.google.android.material.button.MaterialButton
android:id="@+id/btn_webview"
style="@style/Widget.Tachiyomi.Button.ActionButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="@string/action_web_view"
android:visibility="gone"
app:icon="@drawable/ic_public_24dp"
tools:visibility="visible" />
</LinearLayout>
<androidx.constraintlayout.motion.widget.MotionLayout
android:id="@+id/manga_summary_section"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layoutDescription="@xml/manga_summary_section_scene"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<TextView
android:id="@+id/manga_summary_text"
style="@style/TextAppearance.Regular.Body1.Secondary"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginEnd="16dp"
android:layout_marginStart="16dp"
android:clickable="true"
android:focusable="true"
android:maxLines="3"
android:ellipsize="end"
android:textIsSelectable="false"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/manga_cover"
tools:text="Collapsed summary content Collapsed summary content Collapsed summary content Collapsed summary content Collapsed summary content Collapsed summary content" />
<View
android:id="@+id/manga_info_scrim"
android:layout_width="0dp"
android:layout_height="32sp"
android:background="@drawable/manga_info_gradient"
android:backgroundTint="?android:attr/colorBackground"
app:layout_constraintBottom_toBottomOf="@+id/manga_summary_text"
app:layout_constraintEnd_toEndOf="@+id/manga_summary_text"
app:layout_constraintStart_toStartOf="@+id/manga_summary_text" />
<View
android:id="@+id/manga_info_toggle_more_scrim"
android:layout_width="36sp"
android:layout_height="18sp"
android:background="@drawable/manga_info_more_gradient"
android:backgroundTint="?android:attr/colorBackground"
app:layout_constraintBottom_toBottomOf="@+id/manga_summary_text"
app:layout_constraintEnd_toEndOf="@+id/manga_info_toggle_more"
app:layout_constraintStart_toStartOf="@+id/manga_info_toggle_more" />
<com.google.android.material.button.MaterialButton
android:id="@+id/manga_info_toggle_more"
style="@style/Widget.Tachiyomi.Button.InlineButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/ic_expand_more_24dp"
android:backgroundTint="?android:attr/textColorPrimary"
app:layout_constraintBottom_toBottomOf="@+id/manga_info_toggle_more"
app:layout_constraintEnd_toEndOf="@+id/manga_info_toggle_more"
app:layout_constraintStart_toStartOf="@+id/manga_info_toggle_more" />
<com.google.android.material.button.MaterialButton
android:id="@+id/manga_info_toggle_less"
style="@style/Widget.Tachiyomi.Button.InlineButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/ic_expand_less_24dp"
android:backgroundTint="?android:attr/textColorPrimary"
android:paddingStart="8dp"
android:paddingEnd="8dp"
android:visibility="gone"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/manga_summary_text"
tools:visibility="gone" />
<HorizontalScrollView
android:id="@+id/manga_genres_tags_compact"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:requiresFadingEdge="horizontal"
android:scrollbars="none"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/manga_info_toggle_more">
<com.google.android.material.chip.ChipGroup
android:id="@+id/manga_genres_tags_compact_chips"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingStart="16dp"
android:paddingTop="8dp"
android:paddingEnd="16dp"
android:paddingBottom="8dp"
app:chipSpacingHorizontal="4dp"
app:singleLine="true" />
</HorizontalScrollView>
<com.google.android.material.chip.ChipGroup
android:id="@+id/manga_genres_tags_full_chips"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginEnd="16dp"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:visibility="gone"
app:chipSpacingHorizontal="4dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/manga_info_toggle_less"
tools:visibility="gone" />
</androidx.constraintlayout.motion.widget.MotionLayout>
</androidx.constraintlayout.motion.widget.MotionLayout>