Tap to enlarge cover (#5256)

* Convert manga_info_header to use ContraintLayout

Will help with MotionLayout and tablet layout

* Convert to MotionLayout to be able to enlarge cover art

* Add keyframes to animations

* Remove keyframes

Alexa play Despacito

* Add back manga_summary_section
This commit is contained in:
Andreas
2021-06-01 23:59:38 +02:00
committed by GitHub
parent b41ac355a0
commit 3db85c7274
3 changed files with 453 additions and 239 deletions

View File

@@ -0,0 +1,221 @@
<?xml version="1.0" encoding="utf-8"?>
<MotionScene
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:motion="http://schemas.android.com/apk/res-auto">
<Transition
motion:constraintSetEnd="@+id/end"
motion:constraintSetStart="@id/start"
motion:duration="@android:integer/config_mediumAnimTime">
<KeyFrameSet>
<KeyPosition
motion:motionTarget="@+id/manga_detail"
motion:keyPositionType="pathRelative" />
</KeyFrameSet>
<OnClick motion:targetId="@+id/manga_cover" />
</Transition>
<ConstraintSet android:id="@+id/start">
<Constraint
android:id="@+id/manga_info_toggle_more"
motion:layout_constraintEnd_toEndOf="parent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
motion:layout_constraintBottom_toBottomOf="@+id/manga_summary_text"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/manga_genres_tags_compact"
motion:layout_constraintEnd_toEndOf="parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
motion:layout_constraintTop_toBottomOf="@+id/manga_summary_text"
motion:layout_constraintStart_toStartOf="parent"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/manga_info_toggle_more_scrim"
motion:layout_constraintEnd_toStartOf="@+id/manga_info_toggle_more"
android:layout_width="20dp"
android:layout_height="0dp"
motion:layout_constraintBottom_toBottomOf="@+id/manga_info_toggle_more"
motion:layout_constraintTop_toTopOf="@+id/manga_info_toggle_more"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/manga_info_toggle_less"
motion:layout_constraintEnd_toEndOf="parent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
motion:layout_constraintTop_toBottomOf="@+id/manga_summary_text"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/manga_genres_tags_full_chips"
motion:layout_constraintEnd_toEndOf="parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
android:layout_marginEnd="16dp"
motion:layout_constraintTop_toBottomOf="@id/manga_info_toggle_less"
android:layout_marginStart="16dp"
motion:layout_constraintStart_toStartOf="parent"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/btn_tracking"
motion:layout_constraintEnd_toStartOf="@+id/btn_webview"
motion:layout_constraintStart_toEndOf="@+id/btn_favorite"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:visibility="visible"
motion:layout_constraintHorizontal_bias="0.5"
motion:layout_constraintTop_toTopOf="@+id/btn_favorite"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/btn_webview"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toEndOf="@+id/btn_tracking"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:visibility="visible"
motion:layout_constraintHorizontal_bias="0.5"
motion:layout_constraintTop_toTopOf="@+id/btn_favorite"
motion:visibilityMode="ignore" />
</ConstraintSet>
<ConstraintSet android:id="@+id/end">
<Constraint
android:id="@+id/backdrop"
motion:layout_constraintEnd_toEndOf="parent"
android:layout_width="0dp"
android:layout_height="0dp"
motion:layout_constraintBottom_toBottomOf="@+id/manga_cover"
android:layout_marginBottom="-8dp"
android:alpha="0"
motion:layout_constraintTop_toTopOf="parent"
motion:layout_constraintStart_toStartOf="parent"
motion:transitionEasing="cubic(0,1,0,1)" />
<Constraint
android:id="@+id/backdrop_overlay"
android:layout_width="match_parent"
android:layout_height="160dp"
motion:layout_constraintBottom_toBottomOf="@+id/backdrop"
android:layout_marginBottom="-16dp"
android:alpha="0"
motion:transitionEasing="cubic(0,1,0,1)" />
<Constraint
android:layout_marginStart="0dp"
motion:layout_constraintTop_toTopOf="parent"
motion:layout_constraintStart_toStartOf="parent"
android:layout_marginTop="0dp"
android:id="@+id/manga_cover"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintDimensionRatio="2:3" />
<Constraint
android:id="@+id/btn_favorite"
motion:layout_constraintEnd_toStartOf="@+id/btn_tracking"
android:layout_width="0dp"
android:layout_height="wrap_content"
motion:layout_constraintTop_toBottomOf="@id/manga_detail"
motion:layout_constraintHorizontal_bias="0.5"
motion:layout_constraintStart_toStartOf="parent" />
<Constraint
android:id="@+id/btn_favorite"
motion:layout_constraintEnd_toStartOf="@+id/btn_tracking"
android:layout_width="0dp"
android:layout_height="wrap_content"
motion:layout_constraintTop_toBottomOf="@id/manga_detail"
motion:layout_constraintHorizontal_bias="0.5"
motion:layout_constraintStart_toStartOf="parent"
android:layout_marginTop="8dp" />
<Constraint
android:id="@+id/manga_detail"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
motion:layout_constraintTop_toBottomOf="@id/manga_cover"
motion:layout_constraintStart_toStartOf="parent"
motion:layout_constraintEnd_toEndOf="parent"
android:layout_marginEnd="16dp"
android:layout_marginTop="24dp" />
<Constraint
android:id="@+id/manga_info_toggle_less"
motion:layout_constraintEnd_toEndOf="parent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="visible"
motion:layout_constraintTop_toBottomOf="@+id/manga_summary_text"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/btn_tracking"
motion:layout_constraintEnd_toStartOf="@+id/btn_webview"
motion:layout_constraintStart_toEndOf="@+id/btn_favorite"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:visibility="visible"
motion:layout_constraintHorizontal_bias="0.5"
motion:layout_constraintTop_toTopOf="@+id/btn_favorite"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/btn_tracking"
motion:layout_constraintEnd_toStartOf="@+id/btn_webview"
motion:layout_constraintStart_toEndOf="@+id/btn_favorite"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:visibility="visible"
motion:visibilityMode="ignore"
motion:layout_constraintHorizontal_bias="0.5"
motion:layout_constraintTop_toTopOf="@+id/btn_favorite" />
<Constraint
android:id="@+id/btn_webview"
motion:layout_constraintEnd_toEndOf="parent"
motion:layout_constraintStart_toEndOf="@+id/btn_tracking"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:visibility="visible"
motion:layout_constraintHorizontal_bias="0.5"
motion:layout_constraintTop_toTopOf="@+id/btn_favorite"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/manga_summary_text"
motion:layout_constraintEnd_toEndOf="parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginEnd="16dp"
motion:layout_constraintTop_toBottomOf="@+id/btn_favorite"
android:layout_marginStart="16dp"
motion:layout_constraintStart_toStartOf="parent"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/manga_info_toggle_more_scrim"
motion:layout_constraintEnd_toStartOf="@+id/manga_info_toggle_more"
android:layout_width="20dp"
android:layout_height="0dp"
motion:layout_constraintBottom_toBottomOf="@+id/manga_info_toggle_more"
motion:layout_constraintTop_toTopOf="@+id/manga_info_toggle_more"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/manga_info_toggle_more"
motion:layout_constraintEnd_toEndOf="parent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
motion:layout_constraintBottom_toBottomOf="@+id/manga_summary_text"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/manga_genres_tags_compact"
motion:layout_constraintEnd_toEndOf="parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
motion:layout_constraintTop_toBottomOf="@+id/manga_summary_text"
motion:layout_constraintStart_toStartOf="parent"
motion:visibilityMode="ignore" />
<Constraint
android:id="@+id/manga_genres_tags_full_chips"
motion:layout_constraintEnd_toEndOf="parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="visible"
android:layout_marginEnd="16dp"
motion:layout_constraintTop_toBottomOf="@+id/manga_info_toggle_less"
android:layout_marginStart="16dp"
motion:layout_constraintStart_toStartOf="parent"
motion:visibilityMode="ignore" />
</ConstraintSet>
</MotionScene>