[MERGE] pull request #13 from Keyneez/feature/#9-feat-ocr-verification

[UI/#12] card, verification / 카드 및 인증 뷰 구현
Keyneez · Jan 1, 2023 · 4d6dd46 · 4d6dd46
2 parents f491042 + 9801d9e
commit 4d6dd46
Show file tree

Hide file tree

Showing 17 changed files with 493 additions and 32 deletions.
diff --git a/app/build.gradle b/app/build.gradle
@@ -16,7 +16,7 @@ android {
     defaultConfig {
         applicationId "com.lab.keyneez"
         minSdk 25
-        targetSdk 32
+        targetSdk 33
         versionCode 1
         versionName "1.0"
 
@@ -81,11 +81,12 @@ dependencies {
     // kotlin serialization
     implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk8"
 
-    implementation("androidx.constraintlayout:constraintlayout:2.2.0-alpha05")
+    // constraint layout
+    implementation "androidx.constraintlayout:constraintlayout:2.2.0-alpha05"
 
     // glide
-    implementation 'com.github.bumptech.glide:glide:4.13.0'
-    annotationProcessor 'com.github.bumptech.glide:compiler:4.13.0'
+    implementation 'com.github.bumptech.glide:glide:4.14.2'
+    annotationProcessor 'com.github.bumptech.glide:compiler:4.14.2'
 
     implementation 'androidx.core:core-ktx:1.9.0'
     implementation 'androidx.appcompat:appcompat:1.5.1'

diff --git a/app/src/main/java/com/lab/keyneez/presentation/main/card/CardFragment.kt b/app/src/main/java/com/lab/keyneez/presentation/main/card/CardFragment.kt
@@ -1,14 +1,26 @@
 package com.lab.keyneez.presentation.main.card
 
+import android.content.Intent
 import android.os.Bundle
 import android.view.View
 import com.lab.keyneez.R
 import com.lab.keyneez.databinding.FragmentCardBinding
+import com.lab.keyneez.presentation.verification.VerificationActivity
 import com.lab.keyneez.util.binding.BindingFragment
+import com.lab.keyneez.util.extension.setOnSingleClickListener
 
 class CardFragment : BindingFragment<FragmentCardBinding>(R.layout.fragment_card) {
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
         super.onViewCreated(view, savedInstanceState)
+
+        initIssueBtnClickListener()
+    }
+
+    private fun initIssueBtnClickListener() {
+        binding.btnCardIssue.setOnSingleClickListener {
+            val toVertification = Intent(activity, VerificationActivity::class.java)
+            startActivity(toVertification)
+        }
     }
 
     companion object {

diff --git a/app/src/main/java/com/lab/keyneez/presentation/verification/VerificationActivity.kt b/app/src/main/java/com/lab/keyneez/presentation/verification/VerificationActivity.kt
@@ -1,14 +1,27 @@
 package com.lab.keyneez.presentation.verification
 
 import android.os.Bundle
-import androidx.appcompat.app.AppCompatActivity
 import com.lab.keyneez.R
+import com.lab.keyneez.databinding.ActivityVerificationBinding
+import com.lab.keyneez.util.binding.BindingActivity
+import com.lab.keyneez.util.extension.setOnSingleClickListener
 import dagger.hilt.android.AndroidEntryPoint
 
 @AndroidEntryPoint
-class VerificationActivity : AppCompatActivity() {
+class VerificationActivity :
+    BindingActivity<ActivityVerificationBinding>(R.layout.activity_verification) {
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
-        setContentView(R.layout.activity_verification)
+
+        initBackBtnClickListener()
+        initStartCameraBtnClickListener()
+    }
+
+    private fun initBackBtnClickListener() {
+        binding.btnVerificationBack.setOnSingleClickListener { finish() }
+    }
+
+    private fun initStartCameraBtnClickListener() {
+        // ocr 기능 구현
     }
 }
diff --git a/app/src/main/java/com/lab/keyneez/util/OnSingleClickListener.kt b/app/src/main/java/com/lab/keyneez/util/OnSingleClickListener.kt
@@ -0,0 +1,21 @@
+package com.lab.keyneez.util
+
+import android.os.SystemClock
+import android.view.View
+
+class OnSingleClickListener(
+    private var interval: Int = 600,
+    private var onSingleClick: (View) -> Unit
+) : View.OnClickListener {
+
+    private var lastClickTime: Long = 0
+
+    override fun onClick(v: View) {
+        val elapsedRealtime = SystemClock.elapsedRealtime()
+        if ((elapsedRealtime - lastClickTime) < interval) {
+            return
+        }
+        lastClickTime = elapsedRealtime
+        onSingleClick(v)
+    }
+}
diff --git a/app/src/main/java/com/lab/keyneez/util/extension/ViewExt.kt b/app/src/main/java/com/lab/keyneez/util/extension/ViewExt.kt
@@ -0,0 +1,11 @@
+package com.lab.keyneez.util.extension // ktlint-disable filename
+
+import android.view.View
+import com.lab.keyneez.util.OnSingleClickListener
+
+fun View.setOnSingleClickListener(onSingleClick: (View) -> Unit) {
+    val oneClick = OnSingleClickListener {
+        onSingleClick(it)
+    }
+    setOnClickListener(oneClick)
+}
diff --git a/app/src/main/res/drawable/ic_card_keyneez.xml b/app/src/main/res/drawable/ic_card_keyneez.xml
@@ -0,0 +1,30 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="80dp"
+    android:height="30dp"
+    android:viewportWidth="80"
+    android:viewportHeight="30">
+  <path
+      android:pathData="M6.311,18.712L4.083,21.041V24.698H1.474V10.396H4.083V17.731L11.029,10.396H13.96L8.058,16.791L14.321,24.698H11.27L6.311,18.712Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M24.058,19.304C24.058,19.481 24.045,19.733 24.018,20.06H15.607C15.755,20.864 16.136,21.504 16.751,21.981C17.381,22.444 18.157,22.675 19.08,22.675C20.258,22.675 21.228,22.28 21.991,21.49L23.336,23.064C22.854,23.649 22.245,24.092 21.509,24.392C20.773,24.691 19.943,24.841 19.02,24.841C17.842,24.841 16.805,24.603 15.908,24.126C15.012,23.649 14.316,22.989 13.821,22.144C13.339,21.286 13.098,20.319 13.098,19.243C13.098,18.18 13.332,17.227 13.801,16.382C14.282,15.524 14.945,14.857 15.788,14.38C16.631,13.903 17.581,13.665 18.638,13.665C19.682,13.665 20.612,13.903 21.429,14.38C22.258,14.843 22.901,15.504 23.356,16.362C23.824,17.206 24.058,18.187 24.058,19.304ZM18.638,15.708C17.836,15.708 17.153,15.953 16.591,16.444C16.042,16.92 15.708,17.56 15.587,18.364H21.67C21.563,17.574 21.235,16.934 20.686,16.444C20.137,15.953 19.455,15.708 18.638,15.708Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M34.904,13.787L29.886,25.577C29.418,26.762 28.849,27.593 28.18,28.07C27.511,28.56 26.701,28.805 25.751,28.805C25.215,28.805 24.687,28.717 24.165,28.539C23.643,28.362 23.215,28.117 22.88,27.804L23.884,25.924C24.125,26.156 24.406,26.34 24.727,26.476C25.062,26.612 25.396,26.68 25.731,26.68C26.172,26.68 26.534,26.564 26.815,26.333C27.109,26.101 27.377,25.713 27.618,25.168L27.798,24.739L23.121,13.787H25.731L29.103,21.858L32.496,13.787H34.904Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M41.15,13.665C42.502,13.665 43.586,14.066 44.402,14.87C45.218,15.674 45.626,16.866 45.626,18.446V24.698H43.117V18.773C43.117,17.819 42.896,17.104 42.455,16.627C42.013,16.137 41.384,15.892 40.568,15.892C39.644,15.892 38.915,16.178 38.38,16.75C37.845,17.309 37.577,18.119 37.577,19.181V24.698H35.068V13.787H37.456V15.197C37.871,14.693 38.393,14.312 39.022,14.053C39.651,13.794 40.36,13.665 41.15,13.665Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M57.482,19.304C57.482,19.481 57.468,19.733 57.441,20.06H49.03C49.178,20.864 49.559,21.504 50.175,21.981C50.804,22.444 51.58,22.675 52.503,22.675C53.681,22.675 54.651,22.28 55.414,21.49L56.759,23.064C56.277,23.649 55.668,24.092 54.932,24.392C54.196,24.691 53.366,24.841 52.443,24.841C51.265,24.841 50.228,24.603 49.332,24.126C48.435,23.649 47.739,22.989 47.244,22.144C46.762,21.286 46.521,20.319 46.521,19.243C46.521,18.18 46.755,17.227 47.224,16.382C47.706,15.524 48.368,14.857 49.211,14.38C50.054,13.903 51.004,13.665 52.062,13.665C53.105,13.665 54.035,13.903 54.852,14.38C55.682,14.843 56.324,15.504 56.779,16.362C57.247,17.206 57.482,18.187 57.482,19.304ZM52.062,15.708C51.259,15.708 50.576,15.953 50.014,16.444C49.465,16.92 49.131,17.56 49.01,18.364H55.093C54.986,17.574 54.658,16.934 54.109,16.444C53.561,15.953 52.878,15.708 52.062,15.708Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M68.965,19.304C68.965,19.481 68.952,19.733 68.925,20.06H60.514C60.661,20.864 61.043,21.504 61.658,21.981C62.287,22.444 63.064,22.675 63.987,22.675C65.165,22.675 66.135,22.28 66.898,21.49L68.243,23.064C67.761,23.649 67.152,24.092 66.416,24.392C65.68,24.691 64.85,24.841 63.927,24.841C62.749,24.841 61.712,24.603 60.815,24.126C59.919,23.649 59.223,22.989 58.728,22.144C58.246,21.286 58.005,20.319 58.005,19.243C58.005,18.18 58.239,17.227 58.708,16.382C59.189,15.524 59.852,14.857 60.695,14.38C61.538,13.903 62.488,13.665 63.545,13.665C64.589,13.665 65.519,13.903 66.336,14.38C67.165,14.843 67.808,15.504 68.263,16.362C68.731,17.206 68.965,18.187 68.965,19.304ZM63.545,15.708C62.742,15.708 62.06,15.953 61.498,16.444C60.949,16.92 60.614,17.56 60.494,18.364H66.576C66.469,17.574 66.142,16.934 65.593,16.444C65.044,15.953 64.362,15.708 63.545,15.708Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M78.645,22.655V24.698H69.391V23.084L75.272,15.83H69.511V13.787H78.484V15.401L72.582,22.655H78.645Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M29.867,1.798C30.078,1.515 30.474,1.46 30.752,1.675L35.315,5.199C35.593,5.413 35.647,5.816 35.437,6.099L30.212,13.109C30.001,13.392 29.605,13.447 29.327,13.233L24.764,9.709C24.486,9.494 24.431,9.091 24.642,8.808L29.867,1.798Z"
+      android:fillColor="#2CC9ED"/>
+</vector>
diff --git a/app/src/main/res/drawable/ic_verification_back.xml b/app/src/main/res/drawable/ic_verification_back.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="32dp"
+    android:height="32dp"
+    android:viewportWidth="32"
+    android:viewportHeight="32">
+  <path
+      android:pathData="M13.333,29.334L0,16L13.333,2.667L15.2,4.567L3.767,16L15.2,27.434L13.333,29.334Z"
+      android:fillColor="#000000"/>
+</vector>
diff --git a/app/src/main/res/drawable/img_card_cards.xml b/app/src/main/res/drawable/img_card_cards.xml
@@ -0,0 +1,102 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt"
+    android:width="241dp"
+    android:height="108dp"
+    android:viewportWidth="241"
+    android:viewportHeight="108">
+  <path
+      android:pathData="M176.88,8.71C177.75,6.39 180.34,5.21 182.67,6.08L230.43,23.96C232.76,24.83 233.94,27.43 233.07,29.75L206.77,99.99C205.9,102.32 203.3,103.5 200.98,102.63L153.21,84.74C150.89,83.87 149.71,81.28 150.58,78.95L176.88,8.71Z"
+      android:fillColor="#6948F7"/>
+  <path
+      android:pathData="M191.44,54.96C192.1,52.52 193.46,47.54 193.3,43.72C193.32,43.07 193.24,42.43 193.07,41.85C192.73,40.37 192,39.26 190.69,38.85C190.4,38.71 190.08,38.59 189.75,38.51C187.44,37.98 185.07,39.49 184.12,41.98C183.38,43.81 183.16,46.15 182.96,48.28C182.83,49.7 182.71,51.03 182.44,52.08C181.4,56.56 180.69,57.7 179.79,59.17C179.31,59.94 178.77,60.81 178.1,62.31C176.68,65.49 179.28,67.9 182.21,67.87C183.43,67.85 184.21,66.98 184.95,66.15C186,64.98 186.97,63.89 188.97,65.45C189.1,65.55 189.23,65.66 189.36,65.76C192.81,68.46 198.26,72.74 200.56,69.99C201.84,68.45 199.55,66.62 196.9,64.49C193.88,62.07 190.4,59.27 191.14,56.11C191.2,55.86 191.3,55.46 191.44,54.96L191.44,54.96ZM199.93,56.39C203.59,55.06 206.17,52.33 205.69,50.28C205.22,48.23 201.86,47.65 198.2,48.97C194.54,50.3 191.96,53.03 192.44,55.08C192.91,57.13 196.27,57.71 199.93,56.39Z"
+      android:fillAlpha="0.5"
+      android:fillType="evenOdd">
+    <aapt:attr name="android:fillColor">
+      <gradient 
+          android:startX="195.78"
+          android:startY="39.91"
+          android:endX="188.89"
+          android:endY="69.57"
+          android:type="linear">
+        <item android:offset="0" android:color="#FFEDEDFF"/>
+        <item android:offset="1" android:color="#4CEDEDFF"/>
+      </gradient>
+    </aapt:attr>
+  </path>
+  <path
+      android:pathData="M140.88,8.71C141.75,6.39 144.34,5.21 146.67,6.08L194.43,23.96C196.76,24.83 197.94,27.43 197.07,29.75L170.77,99.99C169.9,102.32 167.3,103.5 164.98,102.63L117.21,84.74C114.89,83.87 113.71,81.28 114.58,78.95L140.88,8.71Z"
+      android:fillColor="#FD6D98"/>
+  <path
+      android:pathData="M155.44,54.96C156.1,52.52 157.46,47.54 157.3,43.72C157.32,43.07 157.24,42.43 157.07,41.85C156.73,40.37 156,39.26 154.69,38.85C154.4,38.71 154.08,38.59 153.75,38.51C151.44,37.98 149.07,39.49 148.12,41.98C147.38,43.81 147.16,46.15 146.96,48.28C146.83,49.7 146.71,51.03 146.44,52.08C145.4,56.56 144.69,57.7 143.79,59.17C143.31,59.94 142.77,60.81 142.1,62.31C140.68,65.49 143.28,67.9 146.21,67.87C147.43,67.85 148.21,66.98 148.95,66.15C150,64.98 150.97,63.89 152.97,65.45C153.1,65.55 153.23,65.66 153.36,65.76C156.81,68.46 162.26,72.74 164.56,69.99C165.84,68.45 163.55,66.62 160.9,64.49C157.88,62.07 154.4,59.27 155.14,56.11C155.2,55.86 155.3,55.46 155.44,54.96L155.44,54.96ZM163.93,56.39C167.59,55.06 170.17,52.33 169.69,50.28C169.22,48.23 165.86,47.65 162.2,48.97C158.54,50.3 155.96,53.03 156.44,55.08C156.91,57.13 160.27,57.71 163.93,56.39Z"
+      android:fillAlpha="0.5"
+      android:fillType="evenOdd">
+    <aapt:attr name="android:fillColor">
+      <gradient 
+          android:startX="159.78"
+          android:startY="39.91"
+          android:endX="152.89"
+          android:endY="69.57"
+          android:type="linear">
+        <item android:offset="0" android:color="#FFEDEDFF"/>
+        <item android:offset="1" android:color="#4CEDEDFF"/>
+      </gradient>
+    </aapt:attr>
+  </path>
+  <path
+      android:pathData="M104.88,8.71C105.75,6.39 108.34,5.21 110.67,6.08L158.43,23.96C160.76,24.83 161.94,27.43 161.07,29.75L134.77,99.99C133.9,102.32 131.3,103.5 128.98,102.63L81.21,84.74C78.89,83.87 77.71,81.28 78.58,78.95L104.88,8.71Z"
+      android:fillColor="#CBEC00"/>
+  <path
+      android:pathData="M119.44,54.96C120.1,52.52 121.46,47.54 121.3,43.72C121.32,43.07 121.24,42.43 121.07,41.85C120.73,40.37 120,39.26 118.69,38.85C118.39,38.71 118.08,38.59 117.75,38.51C115.44,37.98 113.07,39.49 112.12,41.98C111.38,43.81 111.16,46.15 110.96,48.28C110.83,49.7 110.71,51.03 110.44,52.08C109.4,56.56 108.69,57.7 107.79,59.17C107.31,59.94 106.77,60.81 106.11,62.31C104.68,65.49 107.28,67.9 110.21,67.87C111.43,67.85 112.21,66.98 112.95,66.15C114,64.98 114.97,63.89 116.97,65.45C117.1,65.55 117.23,65.66 117.36,65.76C120.81,68.46 126.26,72.74 128.56,69.99C129.84,68.45 127.55,66.62 124.9,64.49C121.89,62.07 118.4,59.27 119.14,56.11C119.19,55.86 119.3,55.46 119.44,54.96L119.44,54.96ZM127.93,56.39C131.59,55.06 134.17,52.33 133.69,50.28C133.22,48.23 129.86,47.65 126.2,48.97C122.54,50.3 119.96,53.03 120.44,55.08C120.92,57.13 124.27,57.71 127.93,56.39Z"
+      android:fillAlpha="0.8"
+      android:fillType="evenOdd">
+    <aapt:attr name="android:fillColor">
+      <gradient 
+          android:startX="123.78"
+          android:startY="39.91"
+          android:endX="116.89"
+          android:endY="69.57"
+          android:type="linear">
+        <item android:offset="0" android:color="#FFEDEDFF"/>
+        <item android:offset="1" android:color="#4CEDEDFF"/>
+      </gradient>
+    </aapt:attr>
+  </path>
+  <path
+      android:pathData="M68.88,8.71C69.75,6.39 72.34,5.21 74.67,6.08L122.43,23.96C124.76,24.83 125.94,27.43 125.07,29.75L98.77,99.99C97.9,102.32 95.3,103.5 92.98,102.63L45.21,84.74C42.89,83.87 41.71,81.28 42.58,78.95L68.88,8.71Z"
+      android:fillColor="#FE5C2B"/>
+  <path
+      android:pathData="M83.44,54.96C84.1,52.52 85.46,47.54 85.3,43.72C85.32,43.07 85.24,42.43 85.07,41.85C84.73,40.37 84,39.26 82.69,38.85C82.4,38.71 82.08,38.59 81.75,38.51C79.44,37.98 77.06,39.49 76.12,41.98C75.38,43.81 75.16,46.15 74.96,48.28C74.83,49.7 74.71,51.03 74.44,52.08C73.4,56.56 72.69,57.7 71.79,59.17C71.31,59.94 70.77,60.81 70.1,62.31C68.68,65.49 71.28,67.9 74.21,67.87C75.43,67.85 76.21,66.98 76.95,66.15C78,64.98 78.97,63.89 80.97,65.45C81.1,65.55 81.23,65.66 81.36,65.76C84.81,68.46 90.27,72.74 92.56,69.99C93.84,68.45 91.55,66.62 88.9,64.49C85.89,62.07 82.4,59.27 83.14,56.11C83.2,55.86 83.3,55.46 83.44,54.96L83.44,54.96ZM91.93,56.39C95.59,55.06 98.17,52.33 97.69,50.28C97.22,48.23 93.86,47.65 90.2,48.97C86.54,50.3 83.96,53.03 84.44,55.08C84.92,57.13 88.27,57.71 91.93,56.39Z"
+      android:fillAlpha="0.5"
+      android:fillType="evenOdd">
+    <aapt:attr name="android:fillColor">
+      <gradient 
+          android:startX="87.78"
+          android:startY="39.91"
+          android:endX="80.89"
+          android:endY="69.57"
+          android:type="linear">
+        <item android:offset="0" android:color="#FFEDEDFF"/>
+        <item android:offset="1" android:color="#4CEDEDFF"/>
+      </gradient>
+    </aapt:attr>
+  </path>
+  <path
+      android:pathData="M32.88,8.71C33.75,6.39 36.34,5.21 38.67,6.08L86.43,23.96C88.76,24.83 89.94,27.43 89.07,29.75L62.77,99.99C61.9,102.32 59.3,103.5 56.98,102.63L9.21,84.74C6.89,83.87 5.71,81.28 6.58,78.95L32.88,8.71Z"
+      android:fillColor="#2CC9ED"/>
+  <path
+      android:pathData="M47.44,54.96C48.1,52.52 49.46,47.54 49.3,43.72C49.32,43.07 49.24,42.43 49.07,41.85C48.73,40.37 48,39.26 46.69,38.85C46.4,38.71 46.08,38.59 45.75,38.51C43.44,37.98 41.06,39.49 40.12,41.98C39.38,43.81 39.16,46.15 38.96,48.28C38.83,49.7 38.71,51.03 38.44,52.08C37.4,56.56 36.69,57.7 35.79,59.17L35.79,59.17C35.31,59.94 34.77,60.81 34.1,62.31C32.68,65.49 35.28,67.9 38.21,67.87C39.43,67.85 40.21,66.98 40.95,66.15C42,64.98 42.97,63.89 44.97,65.45C45.1,65.55 45.23,65.66 45.36,65.76L45.36,65.76C48.81,68.46 54.27,72.74 56.56,69.99C57.84,68.45 55.55,66.62 52.9,64.49C49.88,62.07 46.4,59.27 47.14,56.11C47.2,55.86 47.3,55.46 47.44,54.96L47.44,54.96L47.44,54.96ZM55.93,56.39C59.59,55.06 62.17,52.33 61.69,50.28C61.22,48.23 57.86,47.65 54.2,48.97C50.54,50.3 47.96,53.03 48.44,55.08C48.92,57.13 52.27,57.71 55.93,56.39Z"
+      android:fillAlpha="0.5"
+      android:fillType="evenOdd">
+    <aapt:attr name="android:fillColor">
+      <gradient 
+          android:startX="51.78"
+          android:startY="39.91"
+          android:endX="44.89"
+          android:endY="69.57"
+          android:type="linear">
+        <item android:offset="0" android:color="#FFEDEDFF"/>
+        <item android:offset="1" android:color="#4CEDEDFF"/>
+      </gradient>
+    </aapt:attr>
+  </path>
+</vector>
diff --git a/app/src/main/res/drawable/img_verification_card.xml b/app/src/main/res/drawable/img_verification_card.xml
@@ -0,0 +1,46 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="327dp"
+    android:height="192dp"
+    android:viewportWidth="327"
+    android:viewportHeight="192">
+  <path
+      android:pathData="M12,0L315,0A12,12 0,0 1,327 12L327,180A12,12 0,0 1,315 192L12,192A12,12 0,0 1,0 180L0,12A12,12 0,0 1,12 0z"
+      android:fillColor="#AEEDFC"/>
+  <path
+      android:pathData="M47.99,36L135.99,36A16,16 0,0 1,151.99 52L151.99,140A16,16 0,0 1,135.99 156L47.99,156A16,16 0,0 1,31.99 140L31.99,52A16,16 0,0 1,47.99 36z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M67,86m-9,0a9,9 0,1 1,18 0a9,9 0,1 1,-18 0"
+      android:fillColor="#FFDCD2"/>
+  <path
+      android:pathData="M83.5,75L83.5,75A2.5,2.5 0,0 1,86 77.5L86,80.5A2.5,2.5 0,0 1,83.5 83L83.5,83A2.5,2.5 0,0 1,81 80.5L81,77.5A2.5,2.5 0,0 1,83.5 75z"
+      android:fillColor="#000000"/>
+  <path
+      android:pathData="M100.5,75L100.5,75A2.5,2.5 0,0 1,103 77.5L103,80.5A2.5,2.5 0,0 1,100.5 83L100.5,83A2.5,2.5 0,0 1,98 80.5L98,77.5A2.5,2.5 0,0 1,100.5 75z"
+      android:fillColor="#000000"/>
+  <path
+      android:pathData="M100,87C100,88.05 99.79,89.09 99.39,90.06C98.99,91.03 98.4,91.91 97.66,92.66C96.91,93.4 96.03,93.99 95.06,94.39C94.09,94.79 93.05,95 92,95C90.95,95 89.91,94.79 88.94,94.39C87.97,93.99 87.09,93.4 86.34,92.66C85.6,91.91 85.01,91.03 84.61,90.06C84.21,89.09 84,88.05 84,87L92,87H100Z"
+      android:fillColor="#000000"/>
+  <path
+      android:pathData="M117,86m-9,0a9,9 0,1 1,18 0a9,9 0,1 1,-18 0"
+      android:fillColor="#FFDCD2"/>
+  <path
+      android:pathData="M92.62,107H101.25C101.8,107 102.25,107.45 102.25,108L102.25,116.77C102.25,117.64 101.23,118.09 100.59,117.52L92,109.89L83.41,117.52C82.77,118.09 81.75,117.64 81.75,116.77V108C81.75,107.45 82.2,107 82.75,107H91.38H92.62Z"
+      android:fillColor="#000000"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M190.42,51L233.42,51A10.5,10.5 0,0 1,243.92 61.5L243.92,61.5A10.5,10.5 0,0 1,233.42 72L190.42,72A10.5,10.5 0,0 1,179.92 61.5L179.92,61.5A10.5,10.5 0,0 1,190.42 51z"
+      android:strokeAlpha="0.8"
+      android:fillColor="#ffffff"
+      android:fillAlpha="0.8"/>
+  <path
+      android:pathData="M190.42,92L283.42,92A10.5,10.5 0,0 1,293.92 102.5L293.92,102.5A10.5,10.5 0,0 1,283.42 113L190.42,113A10.5,10.5 0,0 1,179.92 102.5L179.92,102.5A10.5,10.5 0,0 1,190.42 92z"
+      android:strokeAlpha="0.8"
+      android:fillColor="#ffffff"
+      android:fillAlpha="0.8"/>
+  <path
+      android:pathData="M190.42,121L283.42,121A10.5,10.5 0,0 1,293.92 131.5L293.92,131.5A10.5,10.5 0,0 1,283.42 142L190.42,142A10.5,10.5 0,0 1,179.92 131.5L179.92,131.5A10.5,10.5 0,0 1,190.42 121z"
+      android:strokeAlpha="0.8"
+      android:fillColor="#ffffff"
+      android:fillAlpha="0.8"/>
+</vector>
diff --git a/app/src/main/res/drawable/shape_black_fill_4_rect.xml b/app/src/main/res/drawable/shape_black_fill_4_rect.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item>
+        <shape android:shape="rectangle">
+            <solid android:color="@color/gray900" />
+            <corners android:radius="4dp" />
+        </shape>
+    </item>
+</layer-list>