From ffd251ab62e1ec42e0bee7d44ef6028f6548b70a Mon Sep 17 00:00:00 2001
From: Prathamesh More <prathameshmm02@gmail.com>
Date: Sat, 15 Jan 2022 11:45:36 +0530
Subject: [PATCH] [Home] Code Cleanup

---
 .../retromusic/fragments/home/HomeBinding.kt  |  23 +++
 .../fragments/home/HomeBindingAdapter.kt      |  32 ----
 .../retromusic/fragments/home/HomeFragment.kt |  27 ++-
 .../retromusic/views/HomeImageLayout.kt       |  52 ++++++
 .../views/insets/InsetsLinearLayout.kt        |  19 +++
 .../res/layout-land/fragment_banner_home.xml  | 158 ------------------
 .../main/res/layout-land/fragment_home.xml    |  45 +----
 .../main/res/layout/banner_image_layout.xml   |  78 +++++++++
 .../main/res/layout/fragment_banner_home.xml  | 155 -----------------
 app/src/main/res/layout/fragment_home.xml     |  45 +----
 app/src/main/res/layout/user_image_layout.xml |  45 +++++
 11 files changed, 241 insertions(+), 438 deletions(-)
 create mode 100644 app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeBinding.kt
 delete mode 100644 app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeBindingAdapter.kt
 create mode 100644 app/src/main/java/code/name/monkey/retromusic/views/HomeImageLayout.kt
 create mode 100644 app/src/main/java/code/name/monkey/retromusic/views/insets/InsetsLinearLayout.kt
 delete mode 100644 app/src/main/res/layout-land/fragment_banner_home.xml
 create mode 100644 app/src/main/res/layout/banner_image_layout.xml
 delete mode 100644 app/src/main/res/layout/fragment_banner_home.xml
 create mode 100644 app/src/main/res/layout/user_image_layout.xml

diff --git a/app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeBinding.kt b/app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeBinding.kt
new file mode 100644
index 000000000..7ea737b7c
--- /dev/null
+++ b/app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeBinding.kt
@@ -0,0 +1,23 @@
+package code.name.monkey.retromusic.fragments.home
+
+import code.name.monkey.retromusic.databinding.FragmentHomeBinding
+
+class HomeBinding(
+    homeBinding: FragmentHomeBinding
+) {
+    val root = homeBinding.root
+    val container = homeBinding.container
+    val contentContainer = homeBinding.contentContainer
+    val appBarLayout = homeBinding.appBarLayout
+    val toolbar = homeBinding.toolbar
+    val bannerImage = homeBinding.imageLayout.bannerImage
+    val userImage = homeBinding.imageLayout.userImage
+    val lastAdded = homeBinding.homeContent.absPlaylists.lastAdded
+    val topPlayed = homeBinding.homeContent.absPlaylists.topPlayed
+    val actionShuffle = homeBinding.homeContent.absPlaylists.actionShuffle
+    val history = homeBinding.homeContent.absPlaylists.history
+    val recyclerView = homeBinding.homeContent.recyclerView
+    val titleWelcome = homeBinding.imageLayout.titleWelcome
+    val appNameText = homeBinding.appNameText
+    val suggestions = homeBinding.homeContent.suggestions
+}
\ No newline at end of file
diff --git a/app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeBindingAdapter.kt b/app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeBindingAdapter.kt
deleted file mode 100644
index ed18d9c80..000000000
--- a/app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeBindingAdapter.kt
+++ /dev/null
@@ -1,32 +0,0 @@
-package code.name.monkey.retromusic.fragments.home
-
-import code.name.monkey.retromusic.databinding.FragmentBannerHomeBinding
-import code.name.monkey.retromusic.databinding.FragmentHomeBinding
-
-class HomeBindingAdapter(
-    homeBinding: FragmentHomeBinding?,
-    bannerHomeBinding: FragmentBannerHomeBinding?
-) {
-    val root = homeBinding?.root ?: bannerHomeBinding?.root!!
-    val container = homeBinding?.container ?: bannerHomeBinding?.container!!
-    val contentContainer = homeBinding?.contentContainer ?: bannerHomeBinding?.contentContainer!!
-    val appBarLayout = homeBinding?.appBarLayout ?: bannerHomeBinding?.appBarLayout!!
-    val toolbar = homeBinding?.toolbar
-        ?: bannerHomeBinding?.toolbar!!
-    val bannerImage = bannerHomeBinding?.bannerImage
-    val userImage = homeBinding?.userImage
-        ?: bannerHomeBinding?.userImage!!
-    val lastAdded = homeBinding?.homeContent?.absPlaylists?.lastAdded
-        ?: bannerHomeBinding?.homeContent?.absPlaylists?.lastAdded!!
-    val topPlayed = homeBinding?.homeContent?.absPlaylists?.topPlayed
-        ?: bannerHomeBinding?.homeContent?.absPlaylists?.topPlayed!!
-    val actionShuffle = homeBinding?.homeContent?.absPlaylists?.actionShuffle
-        ?: bannerHomeBinding?.homeContent?.absPlaylists?.actionShuffle!!
-    val history = homeBinding?.homeContent?.absPlaylists?.history
-        ?: bannerHomeBinding?.homeContent?.absPlaylists?.history!!
-    val recyclerView = homeBinding?.homeContent?.recyclerView
-        ?: bannerHomeBinding?.homeContent?.recyclerView!!
-    val titleWelcome = homeBinding?.titleWelcome ?: bannerHomeBinding?.titleWelcome!!
-    val appNameText = homeBinding?.appNameText ?: bannerHomeBinding?.appNameText!!
-    val suggestions = homeBinding?.homeContent?.suggestions ?: bannerHomeBinding?.homeContent?.suggestions!!
-}
\ No newline at end of file
diff --git a/app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeFragment.kt b/app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeFragment.kt
index 335a84a5c..f4a3bc51f 100644
--- a/app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeFragment.kt
+++ b/app/src/main/java/code/name/monkey/retromusic/fragments/home/HomeFragment.kt
@@ -35,7 +35,6 @@ import code.name.monkey.appthemehelper.util.ColorUtil
 import code.name.monkey.appthemehelper.util.ToolbarContentTintHelper
 import code.name.monkey.retromusic.*
 import code.name.monkey.retromusic.adapter.HomeAdapter
-import code.name.monkey.retromusic.databinding.FragmentBannerHomeBinding
 import code.name.monkey.retromusic.databinding.FragmentHomeBinding
 import code.name.monkey.retromusic.dialogs.CreatePlaylistDialog
 import code.name.monkey.retromusic.dialogs.ImportPlaylistDialog
@@ -56,15 +55,15 @@ import com.google.android.material.transition.MaterialFadeThrough
 import com.google.android.material.transition.MaterialSharedAxis
 
 class HomeFragment :
-    AbsMainActivityFragment(if (PreferenceUtil.isHomeBanner) R.layout.fragment_banner_home else R.layout.fragment_home),
-    IScrollHelper {
+    AbsMainActivityFragment(R.layout.fragment_home), IScrollHelper {
 
-    private var _binding: HomeBindingAdapter? = null
+    private var _binding: HomeBinding? = null
     private val binding get() = _binding!!
 
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
         super.onViewCreated(view, savedInstanceState)
-        _binding = getBinding(PreferenceUtil.isHomeBanner, view)
+        val homeBinding = FragmentHomeBinding.bind(view)
+        _binding = HomeBinding(homeBinding)
         mainActivity.setSupportActionBar(binding.toolbar)
         mainActivity.supportActionBar?.title = null
         setupListeners()
@@ -105,7 +104,7 @@ class HomeFragment :
     private fun adjustPlaylistButtons() {
         val buttons =
             listOf(binding.history, binding.lastAdded, binding.topPlayed, binding.actionShuffle)
-        buttons.maxOf { it.lineCount }.let { maxLineCount->
+        buttons.maxOf { it.lineCount }.let { maxLineCount ->
             buttons.forEach { button ->
                 // Set the highest line count to every button for consistency
                 button.setLines(maxLineCount)
@@ -160,16 +159,10 @@ class HomeFragment :
             )
         }
         // Reload suggestions
-        binding.suggestions.refreshButton.setOnClickListener { libraryViewModel.forceReload(ReloadType.Suggestions) }
-    }
-
-    private fun getBinding(homeBanner: Boolean, view: View): HomeBindingAdapter {
-        return if (homeBanner) {
-            val homeBannerBinding = FragmentBannerHomeBinding.bind(view)
-            HomeBindingAdapter(null, homeBannerBinding)
-        } else {
-            val homeBinding = FragmentHomeBinding.bind(view)
-            HomeBindingAdapter(homeBinding, null)
+        binding.suggestions.refreshButton.setOnClickListener {
+            libraryViewModel.forceReload(
+                ReloadType.Suggestions
+            )
         }
     }
 
@@ -243,7 +236,7 @@ class HomeFragment :
     }
 
     private fun loadSuggestions(songs: List<Song>) {
-        if (songs.isEmpty()){
+        if (songs.isEmpty()) {
             binding.suggestions.root.isVisible = false
             return
         }
diff --git a/app/src/main/java/code/name/monkey/retromusic/views/HomeImageLayout.kt b/app/src/main/java/code/name/monkey/retromusic/views/HomeImageLayout.kt
new file mode 100644
index 000000000..79c55b040
--- /dev/null
+++ b/app/src/main/java/code/name/monkey/retromusic/views/HomeImageLayout.kt
@@ -0,0 +1,52 @@
+package code.name.monkey.retromusic.views
+
+import android.content.Context
+import android.util.AttributeSet
+import android.view.LayoutInflater
+import android.widget.FrameLayout
+import android.widget.ImageView
+import android.widget.TextView
+import code.name.monkey.retromusic.databinding.BannerImageLayoutBinding
+import code.name.monkey.retromusic.databinding.UserImageLayoutBinding
+import code.name.monkey.retromusic.util.PreferenceUtil
+
+class HomeImageLayout @JvmOverloads constructor(
+    context: Context,
+    attrs: AttributeSet? = null,
+    defStyleAttr: Int = -1,
+    defStyleRes: Int = -1
+) : FrameLayout(context, attrs, defStyleAttr, defStyleRes) {
+    private var userImageBinding: UserImageLayoutBinding? = null
+    private var bannerImageBinding: BannerImageLayoutBinding? = null
+
+    init {
+        if (PreferenceUtil.isHomeBanner) {
+            bannerImageBinding = BannerImageLayoutBinding.inflate(LayoutInflater.from(context))
+            addView(bannerImageBinding!!.root)
+        } else {
+            userImageBinding = UserImageLayoutBinding.inflate(LayoutInflater.from(context))
+            addView(userImageBinding!!.root)
+        }
+    }
+
+    val userImage: ImageView
+        get() = if (PreferenceUtil.isHomeBanner) {
+            bannerImageBinding!!.userImage
+        } else {
+            userImageBinding!!.userImage
+        }
+
+    val bannerImage: ImageView?
+        get() = if (PreferenceUtil.isHomeBanner) {
+            bannerImageBinding!!.bannerImage
+        } else {
+            null
+        }
+
+    val titleWelcome : TextView
+        get() = if (PreferenceUtil.isHomeBanner) {
+            bannerImageBinding!!.titleWelcome
+        } else {
+            userImageBinding!!.titleWelcome
+        }
+}
\ No newline at end of file
diff --git a/app/src/main/java/code/name/monkey/retromusic/views/insets/InsetsLinearLayout.kt b/app/src/main/java/code/name/monkey/retromusic/views/insets/InsetsLinearLayout.kt
new file mode 100644
index 000000000..ec6c08f04
--- /dev/null
+++ b/app/src/main/java/code/name/monkey/retromusic/views/insets/InsetsLinearLayout.kt
@@ -0,0 +1,19 @@
+package code.name.monkey.retromusic.views.insets
+
+import android.content.Context
+import android.util.AttributeSet
+import android.widget.LinearLayout
+import androidx.constraintlayout.widget.ConstraintLayout
+import code.name.monkey.retromusic.extensions.drawAboveSystemBarsWithPadding
+import code.name.monkey.retromusic.util.RetroUtil
+
+class InsetsLinearLayout @JvmOverloads constructor(
+    context: Context,
+    attrs: AttributeSet? = null,
+    defStyleAttr: Int = 0
+) : LinearLayout(context, attrs, defStyleAttr) {
+    init {
+        if (!RetroUtil.isLandscape())
+            drawAboveSystemBarsWithPadding()
+    }
+}
\ No newline at end of file
diff --git a/app/src/main/res/layout-land/fragment_banner_home.xml b/app/src/main/res/layout-land/fragment_banner_home.xml
deleted file mode 100644
index 858d33922..000000000
--- a/app/src/main/res/layout-land/fragment_banner_home.xml
+++ /dev/null
@@ -1,158 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?><!--
-  ~ Copyright (c) 2019 Hemanth Savarala.
-  ~
-  ~ Licensed under the GNU General Public License v3
-  ~
-  ~ This is free software: you can redistribute it and/or modify it under
-  ~ the terms of the GNU General Public License as published by
-  ~  the Free Software Foundation either version 3 of the License, or (at your option) any later version.
-  ~
-  ~ This software is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY;
-  ~ without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
-  ~ See the GNU General Public License for more details.
-  -->
-<androidx.coordinatorlayout.widget.CoordinatorLayout 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"
-    android:fitsSystemWindows="true">
-
-    <com.google.android.material.appbar.AppBarLayout
-        android:id="@+id/appBarLayout"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:fitsSystemWindows="true"
-        app:liftOnScroll="true">
-
-        <FrameLayout
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            app:layout_scrollFlags="scroll|enterAlways">
-
-            <androidx.appcompat.widget.Toolbar
-                android:id="@+id/toolbar"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                app:navigationIcon="@drawable/ic_search"
-                app:popupTheme="?attr/toolbarPopupTheme"
-                app:title="@null"
-                tools:ignore="UnusedAttribute">
-
-                <com.google.android.material.textview.MaterialTextView
-                    android:id="@+id/appNameText"
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:layout_gravity="center"
-                    android:textAppearance="@style/TextViewHeadline6"
-                    android:textStyle="bold" />
-            </androidx.appcompat.widget.Toolbar>
-
-            <ViewStub
-                android:id="@+id/cab_stub"
-                android:layout_width="match_parent"
-                android:layout_height="@dimen/toolbar_height" />
-        </FrameLayout>
-    </com.google.android.material.appbar.AppBarLayout>
-
-    <androidx.core.widget.NestedScrollView
-        android:id="@+id/container"
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:layout_marginStart="@dimen/toolbar_margin_horizontal"
-        android:layout_marginEnd="@dimen/toolbar_margin_horizontal"
-        android:descendantFocusability="beforeDescendants"
-        android:focusableInTouchMode="true"
-        android:overScrollMode="@integer/overScrollMode"
-        android:transitionGroup="true"
-        app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">
-
-        <code.name.monkey.retromusic.views.insets.InsetsConstraintLayout
-            android:id="@+id/contentContainer"
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            android:transitionGroup="true">
-
-            <com.google.android.material.card.MaterialCardView
-                android:id="@+id/imageContainer"
-                android:layout_width="0dp"
-                android:layout_height="0dp"
-                app:cardCornerRadius="24dp"
-                app:cardUseCompatPadding="true"
-                android:transitionName="banner_image"
-                app:layout_constraintDimensionRatio="21:7"
-                app:layout_constraintEnd_toEndOf="parent"
-                app:layout_constraintStart_toStartOf="parent"
-                app:layout_constraintTop_toTopOf="parent">
-
-                <androidx.constraintlayout.widget.ConstraintLayout
-                    android:layout_width="match_parent"
-                    android:layout_height="wrap_content">
-
-                    <androidx.appcompat.widget.AppCompatImageView
-                        android:id="@+id/bannerImage"
-                        android:layout_width="match_parent"
-                        android:layout_height="match_parent"
-                        android:scaleType="centerCrop"
-                        app:layout_collapseMode="parallax"
-                        tools:ignore="ContentDescription"
-                        tools:srcCompat="@tools:sample/backgrounds/scenic[9]" />
-
-                    <View
-                        android:layout_width="match_parent"
-                        android:layout_height="52dp"
-                        android:background="@drawable/shadow_up"
-                        app:layout_constraintBottom_toBottomOf="parent" />
-
-                    <code.name.monkey.retromusic.views.RetroShapeableImageView
-                        android:id="@+id/userImage"
-                        android:layout_width="42dp"
-                        android:layout_height="42dp"
-                        android:layout_marginStart="16dp"
-                        android:layout_marginBottom="8dp"
-                        android:scaleType="centerCrop"
-                        android:transitionName="user_image"
-                        app:layout_constraintBottom_toBottomOf="parent"
-                        app:layout_constraintStart_toStartOf="parent"
-                        app:retroCornerSize="21dp"
-                        tools:srcCompat="@tools:sample/avatars" />
-
-                    <com.google.android.material.textview.MaterialTextView
-                        android:id="@+id/text"
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:layout_marginStart="16dp"
-                        android:ellipsize="end"
-                        android:text="@string/welcome"
-                        android:textColor="@color/md_white_1000"
-                        app:layout_constraintStart_toEndOf="@+id/userImage"
-                        app:layout_constraintTop_toTopOf="@+id/userImage" />
-
-                    <com.google.android.material.textview.MaterialTextView
-                        android:id="@+id/titleWelcome"
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:layout_marginStart="16dp"
-                        android:padding="0dp"
-                        android:textAppearance="@style/TextViewHeadline6"
-                        android:textColor="@color/md_white_1000"
-                        android:textStyle="bold"
-                        app:layout_constraintBottom_toBottomOf="@+id/userImage"
-                        app:layout_constraintStart_toEndOf="@+id/userImage"
-                        app:layout_constraintTop_toBottomOf="@+id/text"
-                        tools:text="@string/app_name" />
-
-                </androidx.constraintlayout.widget.ConstraintLayout>
-            </com.google.android.material.card.MaterialCardView>
-
-            <include
-                android:id="@+id/home_content"
-                layout="@layout/home_content"
-                android:layout_width="0dp"
-                android:layout_height="wrap_content"
-                app:layout_constraintEnd_toEndOf="parent"
-                app:layout_constraintStart_toStartOf="parent"
-                app:layout_constraintTop_toBottomOf="@+id/imageContainer" />
-        </code.name.monkey.retromusic.views.insets.InsetsConstraintLayout>
-    </androidx.core.widget.NestedScrollView>
-</androidx.coordinatorlayout.widget.CoordinatorLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout-land/fragment_home.xml b/app/src/main/res/layout-land/fragment_home.xml
index 7d68937a5..fa7257ac1 100644
--- a/app/src/main/res/layout-land/fragment_home.xml
+++ b/app/src/main/res/layout-land/fragment_home.xml
@@ -71,44 +71,13 @@
             android:layout_height="wrap_content"
             android:transitionGroup="true">
 
-            <code.name.monkey.retromusic.views.RetroShapeableImageView
-                android:id="@+id/userImage"
-                android:layout_width="42dp"
-                android:layout_height="42dp"
-                android:layout_marginStart="16dp"
-                android:layout_marginTop="16dp"
-                android:layout_marginBottom="8dp"
-                android:scaleType="centerCrop"
-                android:transitionName="user_image"
+            <code.name.monkey.retromusic.views.HomeImageLayout
+                android:id="@+id/imageLayout"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                app:layout_constraintEnd_toEndOf="parent"
                 app:layout_constraintStart_toStartOf="parent"
-                app:layout_constraintTop_toTopOf="parent"
-                app:retroCornerSize="21dp"
-                tools:srcCompat="@tools:sample/avatars" />
-
-            <com.google.android.material.textview.MaterialTextView
-                android:id="@+id/text"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="16dp"
-                android:ellipsize="end"
-                android:text="@string/welcome"
-                app:layout_constraintStart_toEndOf="@+id/userImage"
-                app:layout_constraintTop_toTopOf="@+id/userImage"
-                tools:text="@tools:sample/lorem" />
-
-            <com.google.android.material.textview.MaterialTextView
-                android:id="@+id/titleWelcome"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="16dp"
-                android:padding="0dp"
-                android:textAppearance="@style/TextViewHeadline6"
-                android:textColor="?android:attr/textColorPrimary"
-                android:textStyle="bold"
-                app:layout_constraintBottom_toBottomOf="@+id/userImage"
-                app:layout_constraintStart_toEndOf="@+id/userImage"
-                app:layout_constraintTop_toBottomOf="@+id/text"
-                tools:text="@tools:sample/lorem" />
+                app:layout_constraintTop_toTopOf="parent" />
 
             <include
                 android:id="@+id/home_content"
@@ -117,7 +86,7 @@
                 android:layout_height="wrap_content"
                 app:layout_constraintEnd_toEndOf="parent"
                 app:layout_constraintStart_toStartOf="parent"
-                app:layout_constraintTop_toBottomOf="@id/titleWelcome" />
+                app:layout_constraintTop_toBottomOf="@id/imageLayout" />
         </code.name.monkey.retromusic.views.insets.InsetsConstraintLayout>
     </androidx.core.widget.NestedScrollView>
 </androidx.coordinatorlayout.widget.CoordinatorLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/banner_image_layout.xml b/app/src/main/res/layout/banner_image_layout.xml
new file mode 100644
index 000000000..23b32d5d4
--- /dev/null
+++ b/app/src/main/res/layout/banner_image_layout.xml
@@ -0,0 +1,78 @@
+<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="wrap_content">
+
+    <com.google.android.material.card.MaterialCardView
+        android:id="@+id/imageContainer"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:layout_margin="16dp"
+        app:cardCornerRadius="40dp"
+        app:layout_constraintDimensionRatio="21:10"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="parent">
+
+        <androidx.constraintlayout.widget.ConstraintLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content">
+
+            <androidx.appcompat.widget.AppCompatImageView
+                android:id="@+id/bannerImage"
+                android:layout_width="match_parent"
+                android:layout_height="match_parent"
+                android:scaleType="centerCrop"
+                app:layout_collapseMode="parallax"
+                tools:ignore="ContentDescription"
+                tools:srcCompat="@tools:sample/backgrounds/scenic" />
+
+            <View
+                android:layout_width="match_parent"
+                android:layout_height="52dp"
+                android:background="@drawable/shadow_up"
+                app:layout_constraintBottom_toBottomOf="parent" />
+
+            <code.name.monkey.retromusic.views.RetroShapeableImageView
+                android:id="@+id/userImage"
+                android:layout_width="42dp"
+                android:layout_height="42dp"
+                android:layout_marginStart="16dp"
+                android:layout_marginBottom="8dp"
+                android:scaleType="centerCrop"
+                android:transitionName="user_image"
+                app:layout_constraintBottom_toBottomOf="parent"
+                app:layout_constraintStart_toStartOf="parent"
+                app:retroCornerSize="21dp"
+                tools:srcCompat="@tools:sample/avatars" />
+
+            <com.google.android.material.textview.MaterialTextView
+                android:id="@+id/text"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_marginStart="16dp"
+                android:ellipsize="end"
+                android:text="@string/welcome"
+                android:textColor="@color/md_white_1000"
+                app:layout_constraintStart_toEndOf="@+id/userImage"
+                app:layout_constraintTop_toTopOf="@+id/userImage" />
+
+            <com.google.android.material.textview.MaterialTextView
+                android:id="@+id/titleWelcome"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_marginStart="16dp"
+                android:padding="0dp"
+                android:textAppearance="@style/TextViewHeadline6"
+                android:textColor="@color/md_white_1000"
+                android:textStyle="bold"
+                app:layout_constraintBottom_toBottomOf="@+id/userImage"
+                app:layout_constraintStart_toEndOf="@+id/userImage"
+                app:layout_constraintTop_toBottomOf="@+id/text"
+                tools:text="@string/app_name" />
+
+
+        </androidx.constraintlayout.widget.ConstraintLayout>
+    </com.google.android.material.card.MaterialCardView>
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/fragment_banner_home.xml b/app/src/main/res/layout/fragment_banner_home.xml
deleted file mode 100644
index fffcd5f41..000000000
--- a/app/src/main/res/layout/fragment_banner_home.xml
+++ /dev/null
@@ -1,155 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?><!--
-  ~ Copyright (c) 2019 Hemanth Savarala.
-  ~
-  ~ Licensed under the GNU General Public License v3
-  ~
-  ~ This is free software: you can redistribute it and/or modify it under
-  ~ the terms of the GNU General Public License as published by
-  ~  the Free Software Foundation either version 3 of the License, or (at your option) any later version.
-  ~
-  ~ This software is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY;
-  ~ without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
-  ~ See the GNU General Public License for more details.
-  -->
-<androidx.coordinatorlayout.widget.CoordinatorLayout 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"
-    android:fitsSystemWindows="true">
-
-    <com.google.android.material.appbar.AppBarLayout
-        android:id="@+id/appBarLayout"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:fitsSystemWindows="true"
-        app:liftOnScroll="true">
-
-        <FrameLayout
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            app:layout_scrollFlags="scroll|enterAlways">
-
-            <androidx.appcompat.widget.Toolbar
-                android:id="@+id/toolbar"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                app:navigationIcon="@drawable/ic_search"
-                app:popupTheme="?attr/toolbarPopupTheme"
-                app:title="@null"
-                tools:ignore="UnusedAttribute">
-
-                <com.google.android.material.textview.MaterialTextView
-                    android:id="@+id/appNameText"
-                    android:layout_width="wrap_content"
-                    android:layout_height="wrap_content"
-                    android:layout_gravity="center"
-                    android:textAppearance="@style/TextViewHeadline6"
-                    android:textStyle="bold" />
-            </androidx.appcompat.widget.Toolbar>
-
-            <ViewStub
-                android:id="@+id/cab_stub"
-                android:layout_width="match_parent"
-                android:layout_height="@dimen/toolbar_height" />
-        </FrameLayout>
-    </com.google.android.material.appbar.AppBarLayout>
-
-    <androidx.core.widget.NestedScrollView
-        android:id="@+id/container"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:descendantFocusability="beforeDescendants"
-        android:focusableInTouchMode="true"
-        android:overScrollMode="@integer/overScrollMode"
-        app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">
-
-        <code.name.monkey.retromusic.views.insets.InsetsConstraintLayout
-            android:id="@+id/contentContainer"
-            android:layout_width="match_parent"
-            android:layout_height="wrap_content"
-            android:transitionGroup="true">
-
-            <com.google.android.material.card.MaterialCardView
-                android:id="@+id/imageContainer"
-                android:layout_width="0dp"
-                android:layout_height="0dp"
-                app:cardCornerRadius="40dp"
-                android:layout_margin="16dp"
-                app:layout_constraintDimensionRatio="21:10"
-                app:layout_constraintEnd_toEndOf="parent"
-                app:layout_constraintStart_toStartOf="parent"
-                app:layout_constraintTop_toTopOf="parent">
-
-                <androidx.constraintlayout.widget.ConstraintLayout
-                    android:layout_width="match_parent"
-                    android:layout_height="wrap_content">
-
-                    <androidx.appcompat.widget.AppCompatImageView
-                        android:id="@+id/bannerImage"
-                        android:layout_width="match_parent"
-                        android:layout_height="match_parent"
-                        android:scaleType="centerCrop"
-                        app:layout_collapseMode="parallax"
-                        tools:ignore="ContentDescription"
-                        tools:srcCompat="@tools:sample/backgrounds/scenic" />
-
-                    <View
-                        android:layout_width="match_parent"
-                        android:layout_height="52dp"
-                        android:background="@drawable/shadow_up"
-                        app:layout_constraintBottom_toBottomOf="parent" />
-
-                    <code.name.monkey.retromusic.views.RetroShapeableImageView
-                        android:id="@+id/userImage"
-                        android:layout_width="42dp"
-                        android:layout_height="42dp"
-                        android:layout_marginStart="16dp"
-                        android:layout_marginBottom="8dp"
-                        android:scaleType="centerCrop"
-                        android:transitionName="user_image"
-                        app:layout_constraintBottom_toBottomOf="parent"
-                        app:layout_constraintStart_toStartOf="parent"
-                        app:retroCornerSize="21dp"
-                        tools:srcCompat="@tools:sample/avatars" />
-
-                    <com.google.android.material.textview.MaterialTextView
-                        android:id="@+id/text"
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:layout_marginStart="16dp"
-                        android:ellipsize="end"
-                        android:text="@string/welcome"
-                        android:textColor="@color/md_white_1000"
-                        app:layout_constraintStart_toEndOf="@+id/userImage"
-                        app:layout_constraintTop_toTopOf="@+id/userImage" />
-
-                    <com.google.android.material.textview.MaterialTextView
-                        android:id="@+id/titleWelcome"
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:layout_marginStart="16dp"
-                        android:padding="0dp"
-                        android:textAppearance="@style/TextViewHeadline6"
-                        android:textColor="@color/md_white_1000"
-                        android:textStyle="bold"
-                        app:layout_constraintBottom_toBottomOf="@+id/userImage"
-                        app:layout_constraintStart_toEndOf="@+id/userImage"
-                        app:layout_constraintTop_toBottomOf="@+id/text"
-                        tools:text="@string/app_name" />
-
-
-                </androidx.constraintlayout.widget.ConstraintLayout>
-            </com.google.android.material.card.MaterialCardView>
-
-            <include
-                android:id="@+id/home_content"
-                layout="@layout/home_content"
-                android:layout_width="0dp"
-                android:layout_height="wrap_content"
-                app:layout_constraintEnd_toEndOf="parent"
-                app:layout_constraintStart_toStartOf="parent"
-                app:layout_constraintTop_toBottomOf="@+id/imageContainer" />
-        </code.name.monkey.retromusic.views.insets.InsetsConstraintLayout>
-    </androidx.core.widget.NestedScrollView>
-</androidx.coordinatorlayout.widget.CoordinatorLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/fragment_home.xml b/app/src/main/res/layout/fragment_home.xml
index 1c8cf07d8..934ecfc83 100755
--- a/app/src/main/res/layout/fragment_home.xml
+++ b/app/src/main/res/layout/fragment_home.xml
@@ -70,44 +70,13 @@
             android:layout_height="wrap_content"
             android:transitionGroup="true">
 
-            <code.name.monkey.retromusic.views.RetroShapeableImageView
-                android:id="@+id/userImage"
-                android:layout_width="42dp"
-                android:layout_height="42dp"
-                android:layout_marginStart="16dp"
-                android:layout_marginTop="16dp"
-                android:layout_marginBottom="8dp"
-                android:scaleType="centerCrop"
-                android:transitionName="user_image"
+            <code.name.monkey.retromusic.views.HomeImageLayout
+                android:id="@+id/imageLayout"
+                android:layout_width="0dp"
+                android:layout_height="wrap_content"
+                app:layout_constraintEnd_toEndOf="parent"
                 app:layout_constraintStart_toStartOf="parent"
-                app:layout_constraintTop_toTopOf="parent"
-                app:retroCornerSize="21dp"
-                tools:srcCompat="@tools:sample/avatars" />
-
-            <com.google.android.material.textview.MaterialTextView
-                android:id="@+id/text"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="16dp"
-                android:ellipsize="end"
-                android:text="@string/welcome"
-                app:layout_constraintStart_toEndOf="@+id/userImage"
-                app:layout_constraintTop_toTopOf="@+id/userImage"
-                tools:text="@tools:sample/lorem" />
-
-            <com.google.android.material.textview.MaterialTextView
-                android:id="@+id/titleWelcome"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:layout_marginStart="16dp"
-                android:padding="0dp"
-                android:textAppearance="@style/TextViewHeadline6"
-                android:textColor="?android:attr/textColorPrimary"
-                android:textStyle="bold"
-                app:layout_constraintBottom_toBottomOf="@+id/userImage"
-                app:layout_constraintStart_toEndOf="@+id/userImage"
-                app:layout_constraintTop_toBottomOf="@+id/text"
-                tools:text="@tools:sample/lorem" />
+                app:layout_constraintTop_toTopOf="parent" />
 
             <include
                 android:id="@+id/home_content"
@@ -116,7 +85,7 @@
                 android:layout_height="wrap_content"
                 app:layout_constraintEnd_toEndOf="parent"
                 app:layout_constraintStart_toStartOf="parent"
-                app:layout_constraintTop_toBottomOf="@id/titleWelcome" />
+                app:layout_constraintTop_toBottomOf="@id/imageLayout" />
         </code.name.monkey.retromusic.views.insets.InsetsConstraintLayout>
 
     </androidx.core.widget.NestedScrollView>
diff --git a/app/src/main/res/layout/user_image_layout.xml b/app/src/main/res/layout/user_image_layout.xml
new file mode 100644
index 000000000..dec1dfdde
--- /dev/null
+++ b/app/src/main/res/layout/user_image_layout.xml
@@ -0,0 +1,45 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
+    <code.name.monkey.retromusic.views.RetroShapeableImageView
+        android:id="@+id/userImage"
+        android:layout_width="42dp"
+        android:layout_height="42dp"
+        android:layout_marginStart="16dp"
+        android:layout_marginTop="16dp"
+        android:layout_marginBottom="8dp"
+        android:scaleType="centerCrop"
+        android:transitionName="user_image"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        app:retroCornerSize="21dp"
+        tools:srcCompat="@tools:sample/avatars" />
+
+    <com.google.android.material.textview.MaterialTextView
+        android:id="@+id/text"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginStart="16dp"
+        android:ellipsize="end"
+        android:text="@string/welcome"
+        app:layout_constraintStart_toEndOf="@+id/userImage"
+        app:layout_constraintTop_toTopOf="@+id/userImage"
+        tools:text="@tools:sample/lorem" />
+
+    <com.google.android.material.textview.MaterialTextView
+        android:id="@+id/titleWelcome"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginStart="16dp"
+        android:padding="0dp"
+        android:textAppearance="@style/TextViewHeadline6"
+        android:textColor="?android:attr/textColorPrimary"
+        android:textStyle="bold"
+        app:layout_constraintBottom_toBottomOf="@+id/userImage"
+        app:layout_constraintStart_toEndOf="@+id/userImage"
+        app:layout_constraintTop_toBottomOf="@+id/text"
+        tools:text="@tools:sample/lorem" />
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file