From 001ef4a2ccd77b539b295b4669b38cef726f3824 Mon Sep 17 00:00:00 2001
From: 004matteos <52109183+AstroTheAstronaut@users.noreply.github.com>
Date: Sun, 27 Aug 2023 18:12:38 +0300
Subject: [PATCH] feat: enhance person detail fragment layout on mobile (#400)

* improvement: changed Person Detail Fragment

Changed the Person Detail Fragment to better use the available space.
Separate layout for larger screens/landscape orientation

* added values for different screen sizes

* fixed spacing

* refactor: rename `layout_height_def` to `person_detail_overview_height`

* refactor: remove `+` from some ids

I know that xml files are parsed top to bottom and the plus sign create a new id. But it seems to work even if the id is created after it is referenced.
I think this is cleaner

---------

Co-authored-by: Jarne Demeulemeester <jarnedemeulemeester@gmail.com>
---
 .../fragments/PersonDetailFragment.kt         |   2 +-
 .../layout-w600dp/fragment_person_detail.xml  | 160 ++++++++++++++++++
 .../res/layout/fragment_person_detail.xml     |  20 ++-
 core/src/main/res/values-sw600dp/dimens.xml   |   1 +
 core/src/main/res/values-sw720dp/dimens.xml   |   1 +
 core/src/main/res/values/dimens.xml           |   1 +
 6 files changed, 175 insertions(+), 10 deletions(-)
 create mode 100644 app/phone/src/main/res/layout-w600dp/fragment_person_detail.xml

diff --git a/app/phone/src/main/java/dev/jdtech/jellyfin/fragments/PersonDetailFragment.kt b/app/phone/src/main/java/dev/jdtech/jellyfin/fragments/PersonDetailFragment.kt
index 2b589153..a7fdf4e6 100644
--- a/app/phone/src/main/java/dev/jdtech/jellyfin/fragments/PersonDetailFragment.kt
+++ b/app/phone/src/main/java/dev/jdtech/jellyfin/fragments/PersonDetailFragment.kt
@@ -127,7 +127,7 @@ internal class PersonDetailFragment : Fragment() {
         binding.readAll.setOnClickListener {
             with(binding.overview) {
                 if (layoutParams.height == ConstraintLayout.LayoutParams.WRAP_CONTENT) {
-                    updateLayoutParams { height = ConstraintLayout.LayoutParams.MATCH_CONSTRAINT }
+                    updateLayoutParams { height = resources.getDimension(CoreR.dimen.person_detail_overview_height).toInt() }
                     binding.readAll.text = getString(CoreR.string.view_all)
                     binding.overviewGradient.isVisible = true
                 } else {
diff --git a/app/phone/src/main/res/layout-w600dp/fragment_person_detail.xml b/app/phone/src/main/res/layout-w600dp/fragment_person_detail.xml
new file mode 100644
index 00000000..84c42c6d
--- /dev/null
+++ b/app/phone/src/main/res/layout-w600dp/fragment_person_detail.xml
@@ -0,0 +1,160 @@
+<?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:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <include
+        android:id="@+id/error_layout"
+        layout="@layout/error_panel" />
+
+    <ScrollView
+        android:id="@+id/fragment_content"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="parent">
+
+        <LinearLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:orientation="vertical">
+
+            <androidx.constraintlayout.widget.ConstraintLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="24dp"
+                android:layout_marginBottom="24dp">
+
+                <com.google.android.material.imageview.ShapeableImageView
+                    android:id="@+id/person_image"
+                    android:layout_width="176dp"
+                    android:layout_height="274dp"
+                    android:layout_marginStart="24dp"
+                    android:scaleType="centerCrop"
+                    app:layout_constraintDimensionRatio="H,3:2"
+                    app:layout_constraintStart_toStartOf="parent"
+                    app:layout_constraintTop_toTopOf="parent"
+                    app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.Findroid.Image" />
+
+                <TextView
+                    android:id="@+id/name"
+                    android:layout_width="0dp"
+                    android:layout_height="wrap_content"
+                    android:layout_marginHorizontal="24dp"
+                    android:layout_marginTop="16dp"
+                    android:textAppearance="@style/TextAppearance.Material3.HeadlineMedium"
+                    app:layout_constraintEnd_toEndOf="parent"
+                    app:layout_constraintHorizontal_bias="0.666"
+                    app:layout_constraintStart_toEndOf="@id/person_image"
+                    app:layout_constraintTop_toTopOf="parent"
+                    tools:text="Actor/Actress name" />
+
+                <TextView
+                    android:id="@+id/overview"
+                    android:layout_width="0dp"
+                    android:layout_height="@dimen/person_detail_overview_height"
+                    android:layout_marginHorizontal="24dp"
+                    android:layout_marginTop="24dp"
+                    android:layout_marginBottom="8dp"
+                    android:ellipsize="end"
+                    android:textAppearance="@style/TextAppearance.Material3.BodyMedium"
+                    app:layout_constraintBottom_toTopOf="@id/read_all"
+                    app:layout_constraintEnd_toEndOf="parent"
+                    app:layout_constraintHorizontal_bias="0.666"
+                    app:layout_constraintStart_toEndOf="@id/person_image"
+                    app:layout_constraintTop_toBottomOf="@id/name" />
+
+                <Button
+                    android:id="@+id/read_all"
+                    style="@style/Widget.Material3.Button.TextButton"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginEnd="16dp"
+                    android:layout_marginBottom="52dp"
+                    android:text="@string/view_all"
+                    app:layout_constraintBottom_toBottomOf="parent"
+                    app:layout_constraintEnd_toEndOf="parent" />
+
+                <FrameLayout
+                    android:id="@+id/overview_gradient"
+                    android:layout_width="0dp"
+                    android:layout_height="24dp"
+                    android:layout_marginBottom="4dp"
+                    android:background="@drawable/header_gradient"
+                    app:layout_constraintBottom_toBottomOf="@id/overview"
+                    app:layout_constraintEnd_toEndOf="@id/overview"
+                    app:layout_constraintHorizontal_bias="1.0"
+                    app:layout_constraintStart_toStartOf="@id/overview" />
+
+
+            </androidx.constraintlayout.widget.ConstraintLayout>
+
+            <LinearLayout
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_marginBottom="24dp"
+                android:orientation="vertical">
+
+                <TextView
+                    android:id="@+id/movie_label"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginHorizontal="24dp"
+                    android:layout_marginBottom="12dp"
+                    android:text="@string/movies_label"
+                    android:textAppearance="@style/TextAppearance.Material3.TitleMedium"
+                    android:visibility="gone" />
+
+                <androidx.recyclerview.widget.RecyclerView
+                    android:id="@+id/movies_list"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:layout_marginBottom="24dp"
+                    android:clipToPadding="false"
+                    android:orientation="horizontal"
+                    android:paddingHorizontal="12dp"
+                    app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
+                    tools:itemCount="4"
+                    tools:listitem="@layout/base_item" />
+
+                <TextView
+                    android:id="@+id/show_label"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_marginHorizontal="24dp"
+                    android:layout_marginBottom="12dp"
+                    android:text="@string/shows_label"
+                    android:textAppearance="@style/TextAppearance.Material3.TitleMedium"
+                    android:visibility="gone" />
+
+                <androidx.recyclerview.widget.RecyclerView
+                    android:id="@+id/show_list"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:clipToPadding="false"
+                    android:orientation="horizontal"
+                    android:paddingHorizontal="12dp"
+                    app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
+                    tools:itemCount="4"
+                    tools:listitem="@layout/base_item" />
+
+            </LinearLayout>
+
+        </LinearLayout>
+
+    </ScrollView>
+
+    <com.google.android.material.progressindicator.LinearProgressIndicator
+        android:id="@+id/loading_indicator"
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        android:indeterminate="true"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="parent" />
+
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/phone/src/main/res/layout/fragment_person_detail.xml b/app/phone/src/main/res/layout/fragment_person_detail.xml
index a534ea88..ddcfb5a0 100644
--- a/app/phone/src/main/res/layout/fragment_person_detail.xml
+++ b/app/phone/src/main/res/layout/fragment_person_detail.xml
@@ -31,11 +31,11 @@
 
                 <com.google.android.material.imageview.ShapeableImageView
                     android:id="@+id/person_image"
-                    android:layout_width="0dp"
-                    android:layout_height="210dp"
-                    android:layout_marginStart="24dp"
+                    android:layout_width="220dp"
+                    android:layout_height="345dp"
                     android:scaleType="centerCrop"
                     app:layout_constraintDimensionRatio="H,3:2"
+                    app:layout_constraintEnd_toEndOf="parent"
                     app:layout_constraintStart_toStartOf="parent"
                     app:layout_constraintTop_toTopOf="parent"
                     app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.Findroid.Image" />
@@ -45,24 +45,26 @@
                     android:layout_width="0dp"
                     android:layout_height="wrap_content"
                     android:layout_marginHorizontal="24dp"
+                    android:layout_marginTop="16dp"
+                    android:gravity="center"
                     android:textAppearance="@style/TextAppearance.Material3.HeadlineMedium"
                     app:layout_constraintEnd_toEndOf="parent"
-                    app:layout_constraintStart_toEndOf="@id/person_image"
-                    app:layout_constraintTop_toTopOf="parent"
+                    app:layout_constraintStart_toStartOf="parent"
+                    app:layout_constraintTop_toBottomOf="@id/person_image"
                     tools:text="Actor/Actress name" />
 
                 <TextView
                     android:id="@+id/overview"
                     android:layout_width="0dp"
-                    android:layout_height="0dp"
+                    android:layout_height="@dimen/person_detail_overview_height"
                     android:layout_marginHorizontal="24dp"
-                    android:layout_marginTop="8dp"
+                    android:layout_marginTop="16dp"
                     android:ellipsize="end"
                     android:textAppearance="@style/TextAppearance.Material3.BodyMedium"
                     app:layout_constraintBottom_toTopOf="@id/read_all"
                     app:layout_constraintEnd_toEndOf="parent"
-                    app:layout_constraintStart_toEndOf="@id/person_image"
-                    app:layout_constraintTop_toBottomOf="@+id/name" />
+                    app:layout_constraintStart_toStartOf="parent"
+                    app:layout_constraintTop_toBottomOf="@id/name" />
 
                 <FrameLayout
                     android:id="@+id/overview_gradient"
diff --git a/core/src/main/res/values-sw600dp/dimens.xml b/core/src/main/res/values-sw600dp/dimens.xml
index badc28b3..00d2ec8f 100644
--- a/core/src/main/res/values-sw600dp/dimens.xml
+++ b/core/src/main/res/values-sw600dp/dimens.xml
@@ -4,4 +4,5 @@
     <item name="server_columns" type="integer">6</item>
     <item name="collection_columns" type="integer">3</item>
     <item name="library_columns" type="integer">4</item>
+    <dimen name="person_detail_overview_height">124dp</dimen>
 </resources>
\ No newline at end of file
diff --git a/core/src/main/res/values-sw720dp/dimens.xml b/core/src/main/res/values-sw720dp/dimens.xml
index 43e88e2a..cf46930b 100644
--- a/core/src/main/res/values-sw720dp/dimens.xml
+++ b/core/src/main/res/values-sw720dp/dimens.xml
@@ -2,4 +2,5 @@
 <resources>
     <item name="server_columns" type="integer">8</item>
     <item name="library_columns" type="integer">6</item>
+    <dimen name="person_detail_overview_height">200dp</dimen>
 </resources>
\ No newline at end of file
diff --git a/core/src/main/res/values/dimens.xml b/core/src/main/res/values/dimens.xml
index 9fcb366b..90b64d79 100644
--- a/core/src/main/res/values/dimens.xml
+++ b/core/src/main/res/values/dimens.xml
@@ -7,4 +7,5 @@
     <item name="server_columns" type="integer">3</item>
     <item name="collection_columns" type="integer">2</item>
     <item name="library_columns" type="integer">2</item>
+    <dimen name="person_detail_overview_height">72dp</dimen>
 </resources>
\ No newline at end of file