필터 디자인 수정 (#139)

* 여백 수정, 말풍선 변경

* 글꼴 수정

* 여백 수정

* Remove unnecessary files from PR

* gradle 관련 파일 복구

* Revert "gradle 관련 파일 복구"

This reverts commit a5ad318.

* fix gitignore

* Revert "Remove unnecessary files from PR"

This reverts commit 6c285d4.

* fix gitignore

* Delete .idea/deploymentTargetSelector.xml

* Delete .idea/kotlinc.xml

* Delete .idea/migrations.xml

* 거리 슬라이더 말풍선 연결

* Conlict 해결하다 놓친것들

* 거리 랭지  text 해결

* lint

* 거리 말풍선 수정

* 초기 위치 수정

* lint

---------

Co-authored-by: Shim Woojin <wjshim@snu.ac.kr>
Co-authored-by: kevin990222 <113081855+kevin990222@users.noreply.github.com>

Author: 3 people

.gitignore

@@ -43,6 +43,7 @@ captures/
 
 # IntelliJ
 *.iml
+.idea/*
 .idea/workspace.xml
 .idea/tasks.xml
 .idea/gradle.xml
@@ -245,4 +246,5 @@ fabric.properties
 
 .idea/codeStyles/Project.xml
 .idea/codeStyles/codeStyleConfig.xml
-.idea/runConfigurations.xml
+.idea/runConfigurations.xml
+/.idea/deploymentTargetSelector.xml

.idea/kotlinc.xml

@@ -6,13 +6,16 @@ import android.content.res.Resources
 import android.graphics.Color
 import android.graphics.Outline
 import android.os.Bundle
+import android.os.Handler
+import android.os.Looper
 import android.util.TypedValue
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
 import android.view.ViewOutlineProvider
 import android.widget.GridLayout
 import androidx.core.content.ContextCompat
+import androidx.core.content.res.ResourcesCompat
 import androidx.core.os.bundleOf
 import androidx.core.view.children
 import androidx.fragment.app.activityViewModels
@@ -21,6 +24,7 @@ import androidx.lifecycle.lifecycleScope
 import com.google.android.material.bottomsheet.BottomSheetDialog
 import com.google.android.material.bottomsheet.BottomSheetDialogFragment
 import com.google.android.material.chip.Chip
+import com.google.android.material.slider.RangeSlider
 import com.wafflestudio.siksha2.R
 import com.wafflestudio.siksha2.databinding.DialogFilterBinding
 import kotlinx.coroutines.launch
@@ -109,10 +113,22 @@ class FilterDialogFragment(
     }
 
     private fun setupDistanceSelection() {
+        val initialValue = listOf(selectedCondition.distance)
+        binding.distanceRangeSlider.setValues(initialValue)
+        updateDistanceText(selectedCondition.distance.toInt())
+        updateDistanceBubblePosition(binding.distanceRangeSlider)
+
+        binding.distanceRangeSlider.post {
+            updateDistanceBubblePosition(binding.distanceRangeSlider)
+        }
+
         binding.distanceRangeSlider.addOnChangeListener { slider, _, _ ->
             val value = slider.values[0]
             selectedCondition = selectedCondition.copy(distance = value)
             updateDistanceText(selectedCondition.distance.toInt())
+            Handler(Looper.getMainLooper()).post {
+                updateDistanceBubblePosition(slider)
+            }
         }
     }
 
@@ -159,6 +175,8 @@ class FilterDialogFragment(
     private fun setupCategorySelection() {
         binding.gridCategory.removeAllViews()
 
+        val nanumSquareBold = ResourcesCompat.getFont(requireContext(), R.font.nanum_square_bold)
+
         categorySet.forEachIndexed { index, category ->
             val chip = Chip(requireContext()).apply {
                 text = category
@@ -167,6 +185,8 @@ class FilterDialogFragment(
                 isFocusable = true
                 checkedIcon = null
 
+                typeface = nanumSquareBold
+
                 layoutParams = GridLayout.LayoutParams().apply {
                     width = dpToPx(56) // 56dp
                     height = dpToPx(48) // 34dp
@@ -285,7 +305,23 @@ class FilterDialogFragment(
     }
 
     private fun updateDistanceText(distance: Int) {
-        binding.tvDistance.text = if (distance >= defaultCondition.distance.toInt()) "1km 이상" else "${distance}m 이내"
+        binding.tvDistanceRange.text = if (distance >= defaultCondition.distance.toInt()) {
+            "1km 이상"
+        } else {
+            "${distance}m 이내"
+        }
+    }
+
+    private fun updateDistanceBubblePosition(rangeSlider: RangeSlider) {
+        val valueRangeSize = rangeSlider.valueTo - rangeSlider.valueFrom
+        val valuePercent = (rangeSlider.values[0] - rangeSlider.valueFrom) / valueRangeSize
+        val valueXDistance = valuePercent * rangeSlider.trackWidth
+        val offset = rangeSlider.x + rangeSlider.trackSidePadding - (binding.distanceBubble.width / 2f)
+
+        val minX = rangeSlider.x + rangeSlider.trackSidePadding + 10f
+        val maxX = minX + rangeSlider.trackWidth - binding.distanceBubble.width + 10f
+
+        binding.distanceBubble.x = valueXDistance.coerceIn(minX, maxX) + offset
     }
 
     private fun updatePriceRangeText(minPrice: Int, maxPrice: Int) {

app/src/main/java/com/wafflestudio/siksha2/ui/main/restaurant/FilterDialogFragment.kt

@@ -3,16 +3,8 @@
     <item>
         <shape android:shape="rectangle">
             <solid android:color="#F0F0F0"/>
-            <corners android:radius="4dp"/>
+            <corners android:radius="2dp"/>
         </shape>
     </item>
-    <!-- 말풍선 화살표 -->
-    <item android:gravity="bottom|center_horizontal">
-        <rotate android:fromDegrees="45" android:toDegrees="45" android:pivotX="50%" android:pivotY="0%">
-            <shape android:shape="rectangle">
-                <size android:width="8dp" android:height="8dp"/>
-                <solid android:color="#F0F0F0"/>
-            </shape>
-        </rotate>
-    </item>
-</layer-list>
+</layer-list>
+

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

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="8dp"
+    android:height="5dp"
+    android:viewportWidth="8"
+    android:viewportHeight="5">
+
+    <!-- 아래쪽 역삼각형 모양 -->
+    <path
+        android:fillColor="#F0F0F0"
+        android:pathData="M0,0 L4,5 L8,0 Z" />
+</vector>
+
+