Merge pull request #95 from odaridavid/search-ui

add character icon to search ui

Author: odaridavid

README.md

@@ -209,7 +209,8 @@ Feel free to contribute in any way to the project.
 
 ## Demo
 
-<img src="art/force_gif.gif" width=200/>
+|<img src="art/s1.png" width=200/>|<img src="art/s2.png" width=200/>|
+|:----:|:----:|
 
 
 <a href='https://play.google.com/store/apps/details?id=com.k0d4black.theforce&pcampaignid=pcampaignidMKT-Other-global-all-co-prtnr-py-PartBadge-Mar2515-1'><img alt='Get it on Google Play' src='https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png' width='170'/></a>

app/src/main/kotlin/com/k0d4black/theforce/features/character_search/SearchQueryListener.kt

@@ -10,7 +10,7 @@ internal class SearchQueryListener(private val viewModel: CharacterSearchViewMod
 
     private var searchJob: Job? = null
 
-    private var debouncePeriod = 400L
+    private var debouncePeriod = 500L
 
     override fun onQueryTextSubmit(query: String?): Boolean = false
 
@@ -20,7 +20,7 @@ internal class SearchQueryListener(private val viewModel: CharacterSearchViewMod
         searchJob = coroutineScope.launch {
             newText?.let {
                 delay(debouncePeriod)
-                if (it.isNotBlank())
+                if (it.isNotBlank() && it.length > 2)
                     viewModel.executeCharacterSearch(it)
             }
         }

app/src/main/res/drawable/ic_character.xml

@@ -0,0 +1,57 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="48dp"
+    android:height="48dp"
+    android:viewportWidth="512"
+    android:viewportHeight="512">
+    <path
+        android:fillColor="#a00668"
+        android:pathData="M269.52,28.96L276.18,29.73L282.75,30.81L289.24,32.17L295.63,33.83L301.93,35.76L308.13,37.97L314.22,40.45L320.2,43.19L326.06,46.18L331.8,49.43L337.41,52.92L342.89,56.65L348.23,60.61L353.42,64.8L358.47,69.2L363.36,73.82L368.09,78.65L372.65,83.68L377.04,88.91L381.26,94.32L385.3,99.92L389.15,105.69L392.8,111.64L396.26,117.75L399.52,124.02L399.99,125L112.01,125L112.48,124.02L115.74,117.75L119.2,111.64L122.85,105.69L126.7,99.92L130.74,94.32L134.96,88.91L139.35,83.68L143.91,78.65L148.64,73.82L153.53,69.2L158.58,64.8L163.77,60.61L169.11,56.65L174.59,52.92L180.2,49.43L185.94,46.18L191.8,43.19L197.78,40.45L203.87,37.97L210.07,35.76L216.37,33.83L222.76,32.17L229.25,30.81L235.82,29.73L242.48,28.96L249.2,28.49L256,28.33L262.8,28.49L269.52,28.96Z" />
+    <path
+        android:fillAlpha="0"
+        android:fillColor="#FF000000"
+        android:pathData="M269.52,28.96L276.18,29.73L282.75,30.81L289.24,32.17L295.63,33.83L301.93,35.76L308.13,37.97L314.22,40.45L320.2,43.19L326.06,46.18L331.8,49.43L337.41,52.92L342.89,56.65L348.23,60.61L353.42,64.8L358.47,69.2L363.36,73.82L368.09,78.65L372.65,83.68L377.04,88.91L381.26,94.32L385.3,99.92L389.15,105.69L392.8,111.64L396.26,117.75L399.52,124.02L399.99,125L112.01,125L112.48,124.02L115.74,117.75L119.2,111.64L122.85,105.69L126.7,99.92L130.74,94.32L134.96,88.91L139.35,83.68L143.91,78.65L148.64,73.82L153.53,69.2L158.58,64.8L163.77,60.61L169.11,56.65L174.59,52.92L180.2,49.43L185.94,46.18L191.8,43.19L197.78,40.45L203.87,37.97L210.07,35.76L216.37,33.83L222.76,32.17L229.25,30.81L235.82,29.73L242.48,28.96L249.2,28.49L256,28.33L262.8,28.49L269.52,28.96Z"
+        android:strokeWidth="1"
+        android:strokeColor="#a00668" />
+    <path
+        android:fillColor="#a00668"
+        android:pathData="M156.38,237.5L159.84,237.97L163.26,238.63L166.63,239.47L169.96,240.48L173.23,241.67L176.45,243.03L179.62,244.55L182.73,246.23L185.78,248.07L188.76,250.07L191.68,252.21L194.53,254.5L197.3,256.93L200,259.5L202.63,262.21L205.17,265.04L207.63,268.01L210,271.1L212.29,274.31L214.48,277.63L216.58,281.07L218.58,284.61L220.48,288.27L222.28,292.02L223.97,295.87L225.56,299.81L227.03,303.85L228.4,307.97L229.64,312.17L230.76,316.45L231.77,320.81L232.65,325.24L233.4,329.73L234.02,334.29L234.51,338.91L234.86,343.59L235.07,348.32L235.14,353.09L235.07,357.87L234.86,362.6L234.51,367.28L234.02,371.9L233.4,376.46L232.65,380.95L231.77,385.38L230.76,389.74L229.64,394.02L228.4,398.22L227.03,402.34L225.56,406.38L223.97,410.32L222.28,414.17L220.48,417.92L218.58,421.57L216.58,425.12L216.35,425.5L122.24,342.66L121.77,343.65L120.86,243.69L122.24,243.03L125.47,241.67L128.74,240.48L132.07,239.47L135.44,238.63L138.86,237.97L142.32,237.5L145.82,237.21L149.35,237.11L152.88,237.21L156.38,237.5Z" />
+    <path
+        android:fillAlpha="0"
+        android:fillColor="#FF000000"
+        android:pathData="M156.38,237.5L159.84,237.97L163.26,238.63L166.63,239.47L169.96,240.48L173.23,241.67L176.45,243.03L179.62,244.55L182.73,246.23L185.78,248.07L188.76,250.07L191.68,252.21L194.53,254.5L197.3,256.93L200,259.5L202.63,262.21L205.17,265.04L207.63,268.01L210,271.1L212.29,274.31L214.48,277.63L216.58,281.07L218.58,284.61L220.48,288.27L222.28,292.02L223.97,295.87L225.56,299.81L227.03,303.85L228.4,307.97L229.64,312.17L230.76,316.45L231.77,320.81L232.65,325.24L233.4,329.73L234.02,334.29L234.51,338.91L234.86,343.59L235.07,348.32L235.14,353.09L235.07,357.87L234.86,362.6L234.51,367.28L234.02,371.9L233.4,376.46L232.65,380.95L231.77,385.38L230.76,389.74L229.64,394.02L228.4,398.22L227.03,402.34L225.56,406.38L223.97,410.32L222.28,414.17L220.48,417.92L218.58,421.57L216.58,425.12L216.35,425.5L122.24,342.66L121.77,343.65L120.86,243.69L122.24,243.03L125.47,241.67L128.74,240.48L132.07,239.47L135.44,238.63L138.86,237.97L142.32,237.5L145.82,237.21L149.35,237.11L152.88,237.21L156.38,237.5Z"
+        android:strokeWidth="1"
+        android:strokeColor="#a00668" />
+    <path
+        android:fillColor="#a00668"
+        android:pathData="M383.62,145C392.66,145 399.99,152.33 399.99,161.37C399.99,168.99 399.99,175.46 399.99,183.07C399.99,192.11 392.66,199.44 383.62,199.44C329.3,199.44 182.7,199.44 128.38,199.44C119.34,199.44 112.01,192.11 112.01,183.07C112.01,175.46 112.01,168.99 112.01,161.37C112.01,152.33 119.34,145 128.38,145C182.7,145 329.3,145 383.62,145Z" />
+    <path
+        android:fillAlpha="0"
+        android:fillColor="#FF000000"
+        android:pathData="M383.62,145C392.66,145 399.99,152.33 399.99,161.37C399.99,168.99 399.99,175.46 399.99,183.07C399.99,192.11 392.66,199.44 383.62,199.44C329.3,199.44 182.7,199.44 128.38,199.44C119.34,199.44 112.01,192.11 112.01,183.07C112.01,175.46 112.01,168.99 112.01,161.37C112.01,152.33 119.34,145 128.38,145C182.7,145 329.3,145 383.62,145Z"
+        android:strokeWidth="1"
+        android:strokeColor="#a00668" />
+    <path
+        android:fillColor="#a00668"
+        android:pathData="M280.45,416.39C280.37,424.34 273.86,430.73 265.9,430.65C261.45,430.61 262.49,430.62 258.04,430.57C250.08,430.49 243.7,423.98 243.78,416.02C244.25,368.22 245.53,239.23 246,191.43C246.08,183.47 252.59,177.09 260.55,177.17C265,177.21 263.96,177.2 268.41,177.24C276.37,177.32 282.76,183.84 282.68,191.79C282.2,239.59 280.93,368.59 280.45,416.39Z" />
+    <path
+        android:fillAlpha="0"
+        android:fillColor="#FF000000"
+        android:pathData="M280.45,416.39C280.37,424.34 273.86,430.73 265.9,430.65C261.45,430.61 262.49,430.62 258.04,430.57C250.08,430.49 243.7,423.98 243.78,416.02C244.25,368.22 245.53,239.23 246,191.43C246.08,183.47 252.59,177.09 260.55,177.17C265,177.21 263.96,177.2 268.41,177.24C276.37,177.32 282.76,183.84 282.68,191.79C282.2,239.59 280.93,368.59 280.45,416.39Z"
+        android:strokeWidth="1"
+        android:strokeColor="#a00668" />
+    <path
+        android:fillColor="#a00668"
+        android:pathData="M384.68,237.5L388.14,237.97L391.56,238.63L394.93,239.47L398.26,240.48L401.53,241.67L404.75,243.03L406.14,243.69L405.23,343.65L404.76,342.66L310.65,425.5L310.42,425.12L308.42,421.57L306.52,417.92L304.72,414.17L303.02,410.32L301.44,406.38L299.96,402.34L298.6,398.22L297.36,394.02L296.23,389.74L295.23,385.38L294.35,380.95L293.6,376.46L292.98,371.9L292.49,367.28L292.14,362.6L291.93,357.87L291.86,353.09L291.93,348.32L292.14,343.59L292.49,338.91L292.98,334.29L293.6,329.73L294.35,325.24L295.23,320.81L296.23,316.45L297.36,312.17L298.6,307.97L299.96,303.85L301.44,299.81L303.02,295.87L304.72,292.02L306.52,288.27L308.42,284.61L310.42,281.07L312.52,277.63L314.71,274.31L317,271.1L319.37,268.01L321.83,265.04L324.37,262.21L327,259.5L329.7,256.93L332.47,254.5L335.32,252.21L338.24,250.06L341.22,248.07L344.27,246.23L347.38,244.55L350.54,243.03L353.77,241.67L357.04,240.48L360.37,239.47L363.74,238.63L367.16,237.97L370.62,237.5L374.12,237.21L377.65,237.11L381.18,237.21L384.68,237.5Z" />
+    <path
+        android:fillAlpha="0"
+        android:fillColor="#FF000000"
+        android:pathData="M384.68,237.5L388.14,237.97L391.56,238.63L394.93,239.47L398.26,240.48L401.53,241.67L404.75,243.03L406.14,243.69L405.23,343.65L404.76,342.66L310.65,425.5L310.42,425.12L308.42,421.57L306.52,417.92L304.72,414.17L303.02,410.32L301.44,406.38L299.96,402.34L298.6,398.22L297.36,394.02L296.23,389.74L295.23,385.38L294.35,380.95L293.6,376.46L292.98,371.9L292.49,367.28L292.14,362.6L291.93,357.87L291.86,353.09L291.93,348.32L292.14,343.59L292.49,338.91L292.98,334.29L293.6,329.73L294.35,325.24L295.23,320.81L296.23,316.45L297.36,312.17L298.6,307.97L299.96,303.85L301.44,299.81L303.02,295.87L304.72,292.02L306.52,288.27L308.42,284.61L310.42,281.07L312.52,277.63L314.71,274.31L317,271.1L319.37,268.01L321.83,265.04L324.37,262.21L327,259.5L329.7,256.93L332.47,254.5L335.32,252.21L338.24,250.06L341.22,248.07L344.27,246.23L347.38,244.55L350.54,243.03L353.77,241.67L357.04,240.48L360.37,239.47L363.74,238.63L367.16,237.97L370.62,237.5L374.12,237.21L377.65,237.11L381.18,237.21L384.68,237.5Z"
+        android:strokeWidth="1"
+        android:strokeColor="#a00668" />
+    <path
+        android:fillColor="#a00668"
+        android:pathData="M180.18,188.5L209.18,188.5L209.18,226.5L180.18,226.5L180.18,188.5Z" />
+    <path
+        android:fillColor="#a00668"
+        android:pathData="M323.18,188.5L352.18,188.5L352.18,226.5L323.18,226.5L323.18,188.5Z" />
+</vector>

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

@@ -4,6 +4,7 @@
     xmlns:tools="http://schemas.android.com/tools">
 
     <data>
+
         <variable
             name="searchedCharacter"
             type="com.k0d4black.theforce.models.CharacterPresentation" />
@@ -15,13 +16,24 @@
         android:layout_height="wrap_content"
         android:padding="@dimen/padding_default">
 
+        <ImageView
+            android:id="@+id/character_image_view"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:src="@drawable/ic_character"
+            android:padding="@dimen/drawable_padding"
+            android:tint="@color/colorOnBackground"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent" />
+
         <TextView
             android:id="@+id/character_name_text_view"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:text='@{searchedCharacter.name}'
             android:textAppearance="@style/TextAppearance.MaterialComponents.Headline5"
-            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintStart_toEndOf="@id/character_image_view"
             app:layout_constraintTop_toTopOf="parent"
             tools:text="Darth Vader" />
 
@@ -32,7 +44,7 @@
             android:fontFamily="@font/roboto_light"
             android:text='@{searchedCharacter.birthYear}'
             android:textAppearance="@style/TextAppearance.MaterialComponents.Body2"
-            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintStart_toStartOf="@id/character_name_text_view"
             app:layout_constraintTop_toBottomOf="@id/character_name_text_view"
             tools:text="BBY 14" />
 
@@ -43,10 +55,10 @@
             android:layout_height="wrap_content"
             android:backgroundTint="@android:color/background_light"
             android:contentDescription="@string/content_description_more_info_arrow"
-            app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintTop_toTopOf="parent"
+            android:src="@drawable/ic_arrow_right_black_32dp"
             app:layout_constraintBottom_toBottomOf="parent"
-            android:src="@drawable/ic_arrow_right_black_32dp" />
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintTop_toTopOf="parent" />
 
     </androidx.constraintlayout.widget.ConstraintLayout>