diff --git a/.idea/render.experimental.xml b/.idea/render.experimental.xml
new file mode 100644
index 0000000..8ec256a
--- /dev/null
+++ b/.idea/render.experimental.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="RenderSettings">
+    <option name="showDecorations" value="true" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/app/src/main/java/moe/chenxy/miuiextra/utils/ChenUtils.kt b/app/src/main/java/moe/chenxy/miuiextra/utils/ChenUtils.kt
index 50152ab..6dd535c 100644
--- a/app/src/main/java/moe/chenxy/miuiextra/utils/ChenUtils.kt
+++ b/app/src/main/java/moe/chenxy/miuiextra/utils/ChenUtils.kt
@@ -28,6 +28,11 @@ class ChenUtils {
             vibrator.defaultVibrator.vibrate(VibrationEffect.createPredefined(id))
         }
 
+        fun cancelAnyVibration(context: Context) {
+            val vibrator = context.getSystemService(Context.VIBRATOR_MANAGER_SERVICE) as VibratorManager
+            vibrator.cancel()
+        }
+
         fun lerp(start: Float, stop: Float, amount: Float): Float {
             return start + (stop - start) * amount
         }
diff --git a/app/src/main/java/moe/chenxy/miuiextra/view/activity/SettingsActivity.kt b/app/src/main/java/moe/chenxy/miuiextra/view/activity/SettingsActivity.kt
index 92cde04..3f6fd5f 100644
--- a/app/src/main/java/moe/chenxy/miuiextra/view/activity/SettingsActivity.kt
+++ b/app/src/main/java/moe/chenxy/miuiextra/view/activity/SettingsActivity.kt
@@ -27,6 +27,7 @@ import androidx.preference.Preference
 import androidx.preference.PreferenceFragmentCompat
 import androidx.preference.SeekBarPreference
 import androidx.preference.SwitchPreferenceCompat
+import androidx.preference.TwoStatePreference
 import com.google.android.material.dialog.MaterialAlertDialogBuilder
 import com.google.android.material.snackbar.Snackbar
 import moe.chenxy.miuiextra.R
@@ -101,7 +102,9 @@ class SettingsActivity : AppCompatActivity() {
         }
 
         override fun onPreferenceTreeClick(preference: Preference): Boolean {
-            this.context?.let { ChenUtils.performVibrateHeavyClick(it) }
+            if (preference is TwoStatePreference) {
+                this.context?.let { ChenUtils.performVibrateHeavyClick(it) }
+            }
             return super.onPreferenceTreeClick(preference)
         }
 
@@ -331,7 +334,6 @@ class SettingsActivity : AppCompatActivity() {
             }
 
             customModePerf.setOnPreferenceChangeListener { _, _ ->
-                this.context?.let { ChenUtils.performVibrateHeavyClick(it) }
                 Snackbar.make(requireActivity().findViewById(R.id.settings_root_layout),
                     R.string.may_need_reboot_PowerKeeper, Snackbar.LENGTH_LONG)
                     .setAction(R.string.reboot) { _ ->
diff --git a/app/src/main/java/moe/chenxy/miuiextra/view/activity/VibratorEffectRemapActivity.kt b/app/src/main/java/moe/chenxy/miuiextra/view/activity/VibratorEffectRemapActivity.kt
index df18a63..6067113 100644
--- a/app/src/main/java/moe/chenxy/miuiextra/view/activity/VibratorEffectRemapActivity.kt
+++ b/app/src/main/java/moe/chenxy/miuiextra/view/activity/VibratorEffectRemapActivity.kt
@@ -6,8 +6,10 @@ import android.content.DialogInterface
 import android.content.SharedPreferences
 import android.os.Bundle
 import android.text.InputType
+import android.util.Log
 import android.view.LayoutInflater
 import android.widget.EditText
+import android.widget.NumberPicker
 import android.widget.Toast
 import androidx.appcompat.app.AlertDialog
 import androidx.appcompat.app.AppCompatActivity
@@ -16,12 +18,15 @@ import androidx.preference.Preference.OnPreferenceClickListener
 import androidx.preference.PreferenceCategory
 import androidx.preference.PreferenceFragmentCompat
 import com.google.android.material.appbar.MaterialToolbar
+import com.google.android.material.button.MaterialButton
 import com.google.android.material.dialog.MaterialAlertDialogBuilder
+import com.google.android.material.snackbar.Snackbar
 import moe.chenxy.miuiextra.R
 import moe.chenxy.miuiextra.utils.ChenUtils
 import rikka.preference.MainSwitchPreference
 import rikka.widget.mainswitchbar.OnMainSwitchChangeListener
 
+const val MAX_EFFECT_ID = 400
 class VibratorEffectRemapActivity : AppCompatActivity() {
 
     @SuppressLint("WorldReadableFiles")
@@ -98,37 +103,38 @@ class VibratorEffectRemapActivity : AppCompatActivity() {
 
             findPreference<Preference>("add_new_effect_map")?.setOnPreferenceClickListener {
                 val chenView = LayoutInflater.from(activity).inflate(R.layout.chen_effect_map_add_dialog, null)
-                val mapBeforeEditText = chenView.findViewById<EditText>(R.id.chen_effect_map_before)
-                val mapToEditText = chenView.findViewById<EditText>(R.id.chen_effect_map_to)
-                mapBeforeEditText.inputType = (InputType.TYPE_CLASS_NUMBER)
-                mapToEditText.inputType = (InputType.TYPE_CLASS_NUMBER)
+
+                val mapBeforePicker = chenView.findViewById<NumberPicker>(R.id.chen_effect_map_from)
+                val mapToPicker = chenView.findViewById<NumberPicker>(R.id.chen_effect_map_to)
+                mapBeforePicker.maxValue = MAX_EFFECT_ID
+                mapBeforePicker.minValue = 0
+
+                mapToPicker.maxValue = MAX_EFFECT_ID
+                mapToPicker.minValue = 0
+
+                mapBeforePicker.setOnValueChangedListener { _, _, _ -> ChenUtils.performVibrateAnyIndex(requireContext(), mapBeforePicker.value) }
+                mapToPicker.setOnValueChangedListener { _, _, _ -> ChenUtils.performVibrateAnyIndex(requireContext(), mapToPicker.value) }
 
                 val inputDialog = MaterialAlertDialogBuilder(this.requireContext())
+                inputDialog.setOnDismissListener { ChenUtils.cancelAnyVibration(requireContext()) }
                 inputDialog
                     .setTitle(R.string.want_to_map_id)
                     .setView(chenView)
                     .setPositiveButton(
                         R.string.confirm
                     ) { _, _ ->
-                        val mapBeforeText = mapBeforeEditText.text.toString()
-                        val mapToText = mapToEditText.text.toString()
-                        var mapBeforeInt = 0
-                        var mapToInt = 0
-
-                        if (mapBeforeText.isNotEmpty() && mapToText.isNotEmpty()) {
-                            mapBeforeInt = mapBeforeText.toInt()
-                            mapToInt = mapToText.toInt()
-                        }
-
-                        if (mapToInt < 0 && mapBeforeInt < 0) {
-                            Toast.makeText(
-                                this.context,
-                                "Input Value Invalid!!",
-                                Toast.LENGTH_SHORT
-                            ).show();
-                        } else {
-                            addNewRemapItem(mapBeforeInt, mapToInt)
+                        if (mapBeforePicker.value == mapToPicker.value) {
+                            Snackbar.make(requireActivity().findViewById(R.id.settings_root_layout), "Before and After are the same!! ignored!!", Snackbar.LENGTH_LONG)
+                                .show()
+                            return@setPositiveButton
                         }
+                        addNewRemapItem(mapBeforePicker.value, mapToPicker.value)
+                        Snackbar.make(requireActivity().findViewById(R.id.settings_root_layout), "Mapped ${mapBeforePicker.value} to ${mapToPicker.value}", Snackbar.LENGTH_LONG)
+                            .setAction("Try it!") {
+                                ChenUtils.performVibrateAnyIndex(it.context, mapBeforePicker.value)
+                            }
+                            .show()
+                        this.context?.let { ChenUtils.performVibrateHeavyClick(it) }
                     }
                 inputDialog.show()
                 this.context?.let { ChenUtils.performVibrateHeavyClick(it) }
@@ -137,30 +143,23 @@ class VibratorEffectRemapActivity : AppCompatActivity() {
 
             findPreference<Preference>("try_effect")?.setOnPreferenceClickListener {
                 val inputDialog = MaterialAlertDialogBuilder(this.requireContext())
-                val editText = EditText(context)
-                inputDialog
-                    .setTitle("ID")
-                    .setView(editText)
-                    .setPositiveButton(
-                        R.string.confirm
-                    ) { _, _ ->
-                        val idText = editText.text.toString()
-                        var idInt = 0
+                val chenView = LayoutInflater.from(activity).inflate(R.layout.chen_haptic_effect_try_layout, null)
+                val numberPicker = chenView.findViewById<NumberPicker>(R.id.effect_picker)
+                val tryBtn = chenView.findViewById<MaterialButton>(R.id.try_effect_btn)
 
-                        if (idText.isNotEmpty()) {
-                            idInt = idText.toInt()
-                        }
+                numberPicker.maxValue = MAX_EFFECT_ID // set the max id to 400, the id will no t over than 400 if mi isn't crazy
+                numberPicker.minValue = 0
 
-                        if (idInt < 0) {
-                            Toast.makeText(
-                                this.context,
-                                "Input Value Invalid!!",
-                                Toast.LENGTH_SHORT
-                            ).show();
-                        } else {
-                            ChenUtils.performVibrateAnyIndex(requireContext(), idInt)
-                        }
-                    }
+                numberPicker.setOnValueChangedListener { _, _, _ -> ChenUtils.performVibrateClick(requireContext()) }
+
+                tryBtn.setOnClickListener {
+                    ChenUtils.performVibrateAnyIndex(requireContext(), numberPicker.value)
+                }
+
+                inputDialog
+                    .setTitle(R.string.try_effect)
+                    .setView(chenView)
+                    .setPositiveButton(R.string.confirm) { _, _ -> }
                 inputDialog.show()
                 return@setOnPreferenceClickListener true
             }
diff --git a/app/src/main/res/layout/chen_effect_map_add_dialog.xml b/app/src/main/res/layout/chen_effect_map_add_dialog.xml
index 8e21eb9..bdee009 100644
--- a/app/src/main/res/layout/chen_effect_map_add_dialog.xml
+++ b/app/src/main/res/layout/chen_effect_map_add_dialog.xml
@@ -3,15 +3,14 @@
     android:layout_width="match_parent"
     android:layout_height="match_parent">
 
-    <EditText
-        android:id="@+id/chen_effect_map_before"
-        android:layout_marginStart="20dp"
-        android:layout_weight="2"
+    <NumberPicker
+        android:id="@+id/chen_effect_map_from"
         android:layout_width="wrap_content"
         android:layout_height="match_parent"
-        android:gravity="center"
-        android:autofillHints=""
-        android:inputType="number" />
+        android:layout_weight="2"
+        android:layout_marginStart="30dp"
+        android:layout_marginEnd="30dp"
+        android:scrollbars="none" />
 
     <TextView
         android:layout_weight="1"
@@ -21,14 +20,13 @@
         android:textSize="18sp"
         android:text="->" />
 
-    <EditText
+    <NumberPicker
         android:id="@+id/chen_effect_map_to"
-        android:layout_marginEnd="20dp"
-        android:layout_weight="2"
         android:layout_width="wrap_content"
         android:layout_height="match_parent"
-        android:gravity="center"
-        android:autofillHints=""
-        android:inputType="number" />
+        android:layout_weight="2"
+        android:layout_marginStart="30dp"
+        android:layout_marginEnd="30dp"
+        android:scrollbars="none" />
 
 </LinearLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/chen_haptic_effect_try_layout.xml b/app/src/main/res/layout/chen_haptic_effect_try_layout.xml
new file mode 100644
index 0000000..7b3993c
--- /dev/null
+++ b/app/src/main/res/layout/chen_haptic_effect_try_layout.xml
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <NumberPicker
+        android:id="@+id/effect_picker"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:scrollbars="none"
+        app:layout_constraintVertical_bias="1"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintBottom_toTopOf="@id/try_effect_btn"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="parent" />
+
+    <com.google.android.material.button.MaterialButton
+        android:id="@+id/try_effect_btn"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:text="▶"
+        app:layout_constraintVertical_bias="0.7"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintTop_toBottomOf="@id/effect_picker" />
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file