Revamped the UI of recycler views

.idea/codeStyles/Project.xml

@@ -10,9 +10,6 @@
       </value>
     </option>
     <option name="LINE_SEPARATOR" value="&#10;" />
-    <AndroidXmlCodeStyleSettings>
-      <option name="ARRANGEMENT_SETTINGS_MIGRATED_TO_191" value="true" />
-    </AndroidXmlCodeStyleSettings>
     <GroovyCodeStyleSettings>
       <option name="ALIGN_MULTILINE_LIST_OR_MAP" value="false" />
       <option name="ALIGN_NAMED_ARGS_IN_MAP" value="false" />

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

@@ -1,5 +1,11 @@
 <?xml version="1.0" encoding="utf-8"?>
-<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<androidx.cardview.widget.CardView
+  android:layout_width="match_parent"
+  android:layout_height="wrap_content"
+  android:layout_margin="@dimen/card_margin"
+  xmlns:android="http://schemas.android.com/apk/res/android">
+
+<LinearLayout
   xmlns:app="http://schemas.android.com/apk/res-auto"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
@@ -42,6 +48,7 @@
       style="@style/list_item_body"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
+      android:textColor="@color/text_secondary"
       android:layout_gravity="start"
       tools:text="Description" />
 
@@ -56,13 +63,15 @@
     <LinearLayout
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
-      android:orientation="horizontal">
+      android:orientation="horizontal"
+      android:layout_marginBottom="10dp">
 
       <TextView
         android:id="@+id/downloadState"
         style="@style/list_item_body"
         android:layout_width="0dp"
         android:layout_height="wrap_content"
+        android:textColor="@color/text_tertiary"
         android:layout_weight="1"
         tools:text="In Progress" />
 
@@ -71,6 +80,7 @@
         style="@style/list_item_body"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
+        android:textColor="@color/text_tertiary"
         tools:text="1min 10secs" />
     </LinearLayout>
   </LinearLayout>
@@ -93,3 +103,4 @@
       app:srcCompat="@drawable/ic_stop_24dp" />
   </LinearLayout>
 </LinearLayout>
+</androidx.cardview.widget.CardView>

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

@@ -1,7 +1,15 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+
+<androidx.cardview.widget.CardView
+  android:layout_width="match_parent"
+  android:layout_height="wrap_content"
+  android:layout_margin="@dimen/card_margin"
+  xmlns:android="http://schemas.android.com/apk/res/android">
+
+  <androidx.constraintlayout.widget.ConstraintLayout
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
+    android:id="@+id/constraint_layout"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:background="?selectableItemBackground"
@@ -40,6 +48,9 @@
       android:layout_width="0dp"
       android:layout_height="wrap_content"
       android:layout_marginEnd="@dimen/activity_horizontal_margin"
+      android:textColor="@color/text_secondary"
+      android:maxLines="2"
+      android:ellipsize="end"
       app:layout_constraintEnd_toEndOf="parent"
       app:layout_constraintStart_toStartOf="@+id/libraryBookTitle"
       app:layout_constraintTop_toBottomOf="@+id/libraryBookTitle"
@@ -50,17 +61,23 @@
       style="@style/list_item_body"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
-    app:layout_constraintStart_toStartOf="@+id/libraryBookDescription"
+      android:textColor="@color/text_tertiary"
+      app:layout_constraintStart_toStartOf="@+id/libraryBookTitle"
       app:layout_constraintTop_toBottomOf="@+id/libraryBookDescription"
       tools:text="File Size" />
 
     <TextView
       android:id="@+id/libraryBookCreator"
       style="@style/list_item_body"
-    android:layout_width="wrap_content"
+      android:layout_width="0dp"
       android:layout_height="wrap_content"
+      android:textColor="@color/text_tertiary"
+      android:gravity="start"
+      android:layout_marginRight="10dp"
+      android:layout_marginEnd="10dp"
       app:layout_constraintStart_toStartOf="@+id/libraryBookSize"
       app:layout_constraintTop_toBottomOf="@+id/libraryBookSize"
+      app:layout_constraintEnd_toStartOf="@id/libraryBookDate"
       tools:text="Author" />
 
     <TextView
@@ -68,6 +85,7 @@
       style="@style/list_item_body"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
+      android:textColor="@color/text_tertiary"
       android:paddingBottom="@dimen/activity_horizontal_margin"
       app:layout_constraintStart_toStartOf="@+id/libraryBookCreator"
       app:layout_constraintTop_toBottomOf="@+id/libraryBookCreator"
@@ -79,6 +97,7 @@
       style="@style/list_item_body"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
+      android:textColor="@color/text_tertiary"
       android:layout_marginEnd="@dimen/activity_horizontal_margin"
       app:layout_constraintEnd_toEndOf="parent"
       app:layout_constraintTop_toTopOf="@+id/libraryBookSize"
@@ -89,6 +108,8 @@
       style="@style/list_item_body"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
+      android:textColor="@color/text_tertiary"
+      android:layout_marginStart="50dp"
       app:layout_constraintEnd_toEndOf="@+id/libraryBookDate"
       app:layout_constraintTop_toBottomOf="@+id/libraryBookDate"
       tools:text="Language" />
@@ -98,6 +119,7 @@
       style="@style/list_item_body"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
+      android:textColor="@color/text_tertiary"
       app:layout_constraintEnd_toEndOf="@+id/libraryBookLanguage"
       app:layout_constraintTop_toBottomOf="@+id/libraryBookLanguage"
       tools:text="File Name" />
@@ -108,7 +130,7 @@
       android:layout_height="wrap_content"
       app:layout_constraintEnd_toEndOf="parent"
       app:layout_constraintStart_toStartOf="@+id/libraryBookTitle"
-    app:layout_constraintTop_toBottomOf="@id/libraryBookFileName" />
+      app:layout_constraintTop_toBottomOf="@id/libraryBookPublisher" />
 
 
     <View
@@ -117,10 +139,12 @@
       android:layout_height="0dp"
       android:alpha=".5"
       android:background="@color/pure_grey"
-    app:layout_constraintBottom_toBottomOf="parent"
+      app:layout_constraintBottom_toBottomOf="@id/constraint_layout"
-    app:layout_constraintEnd_toEndOf="parent"
+      app:layout_constraintEnd_toEndOf="@id/constraint_layout"
-    app:layout_constraintStart_toStartOf="parent"
+      app:layout_constraintStart_toStartOf="@id/constraint_layout"
-    app:layout_constraintTop_toTopOf="parent"
+      app:layout_constraintTop_toTopOf="@id/constraint_layout"
       tools:visibility="gone" />
 
   </androidx.constraintlayout.widget.ConstraintLayout>
+
+</androidx.cardview.widget.CardView>

core/src/main/res/layout/item_book.xml

@@ -1,11 +1,14 @@
 <?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"
+<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
-  xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
-  android:animateLayoutChanges="true"
+  android:layout_margin="@dimen/card_margin">
-  tools:ignore="Overdraw">
+
+  <androidx.constraintlayout.widget.ConstraintLayout 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">
 
     <androidx.constraintlayout.widget.Guideline
       android:id="@+id/horizontal_padding"
@@ -54,13 +57,28 @@
       app:layout_constraintTop_toBottomOf="@+id/vertical_padding"
       tools:text="Wikipedia" />
 
+    <TextView
+      android:id="@+id/item_book_description"
+      style="@style/list_item_body"
+      android:layout_width="0dp"
+      android:layout_height="wrap_content"
+      android:layout_marginEnd="8dp"
+      android:ellipsize="end"
+      android:maxLines="2"
+      android:textColor="@color/text_secondary"
+      app:layout_constraintEnd_toEndOf="parent"
+      app:layout_constraintStart_toStartOf="@id/item_book_title"
+      app:layout_constraintTop_toBottomOf="@id/item_book_title"
+      tools:text="All wikipedia articles" />
+
     <TextView
       android:id="@+id/item_book_date"
       style="@style/list_item_body"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
+      android:textColor="@color/text_tertiary"
       app:layout_constraintStart_toStartOf="@id/item_book_title"
-    app:layout_constraintTop_toBottomOf="@id/item_book_title"
+      app:layout_constraintTop_toBottomOf="@id/item_book_description"
       tools:text="1 Jan 2018" />
 
     <TextView
@@ -70,6 +88,7 @@
       android:layout_height="wrap_content"
       android:layout_marginStart="@dimen/activity_horizontal_margin"
       android:layout_marginEnd="@dimen/activity_horizontal_margin"
+      android:textColor="@color/text_tertiary"
       app:layout_constraintStart_toEndOf="@id/item_book_date"
       app:layout_constraintTop_toTopOf="@id/item_book_date"
       tools:text="20 GB" />
@@ -81,36 +100,18 @@
       android:layout_height="wrap_content"
       android:layout_marginStart="@dimen/activity_horizontal_margin"
       android:layout_marginEnd="@dimen/activity_horizontal_margin"
+      android:textColor="@color/text_tertiary"
       app:layout_constraintStart_toEndOf="@id/item_book_size"
       app:layout_constraintTop_toTopOf="@id/item_book_size"
       tools:text="10.1 K articles" />
 
-  <TextView
-    android:id="@+id/item_book_description"
-    style="@style/list_item_body"
-    android:layout_width="0dp"
-    android:layout_height="wrap_content"
-    android:layout_marginEnd="8dp"
-    app:layout_constraintEnd_toEndOf="parent"
-    app:layout_constraintStart_toStartOf="@id/item_book_title"
-    app:layout_constraintTop_toBottomOf="@id/item_book_date"
-    tools:text="All wikipedia articles" />
-
     <org.kiwix.kiwixmobile.core.zim_manager.TagsView
       android:id="@+id/tags"
       android:layout_width="0dp"
       android:layout_height="wrap_content"
       app:layout_constraintEnd_toEndOf="parent"
       app:layout_constraintStart_toStartOf="@+id/item_book_description"
-    app:layout_constraintTop_toBottomOf="@id/item_book_description" />
+      app:layout_constraintTop_toBottomOf="@id/item_book_date" />
-
-  <View
-    android:layout_width="0dp"
-    android:layout_height="1dp"
-    android:layout_marginTop="@dimen/activity_vertical_margin"
-    android:background="?android:attr/dividerVertical"
-    app:layout_constraintStart_toStartOf="@id/item_book_title"
-    app:layout_constraintTop_toBottomOf="@id/tags" />
 
     <View
       android:id="@+id/item_book_clickable_area"
@@ -118,8 +119,11 @@
       android:layout_height="0dp"
       android:background="?android:attr/selectableItemBackground"
       app:layout_constraintBottom_toBottomOf="parent"
-    app:layout_constraintStart_toStartOf="parent"
       app:layout_constraintEnd_toEndOf="parent"
+      app:layout_constraintStart_toStartOf="parent"
       app:layout_constraintTop_toTopOf="parent"
       tools:visibility="gone" />
+
   </androidx.constraintlayout.widget.ConstraintLayout>
+
+</androidx.cardview.widget.CardView>

core/src/main/res/layout/item_help.xml

@@ -34,6 +34,7 @@
     android:layout_height="wrap_content"
     android:paddingTop="@dimen/activity_vertical_margin"
     android:visibility="gone"
+    android:textColor="@color/text_secondary"
     app:layout_constraintTop_toBottomOf="@id/item_help_title"
     tools:text="@string/help_3"
     tools:visibility="visible" />

core/src/main/res/values-night/color.xml

@@ -13,4 +13,7 @@
   <color name="color_on_primary">@color/white</color>
   <color name="color_on_surface">@color/white</color>
   <color name="color_on_error">@color/white</color>
+
+  <color name="text_secondary">@color/gray500</color>
+  <color name="text_tertiary">@color/gray700</color>
 </resources>

core/src/main/res/values/colors.xml

@@ -12,7 +12,10 @@
   <color name="blue800">#1565c0</color>
   <color name="pink300">#f06292</color>
   <color name="actionModeBackground">#4285F4</color>
-
+  <color name="gray500">#9E9E9E</color>
+  <color name="gray700">#616161</color>
+  <color name="text_secondary">@color/gray700</color>
+  <color name="text_tertiary">@color/gray500</color>
 
   <!--Material Components Colors-->
 

core/src/main/res/values/dimens.xml

@@ -27,4 +27,6 @@
   <!-- Workaround to store floats in dimen -->
   <item format="float" name="material_light_hint_alpha" type="dimen">0.38</item>
   <item format="float" name="material_dark_hint_pressed_alpha" type="dimen">0.70</item>
+
+  <dimen name="card_margin">5dp</dimen>
 </resources>