diff --git a/OCH/common/common/src/main/res/layout/taxi_seekbar_visualangle.xml b/OCH/common/common/src/main/res/layout/taxi_seekbar_visualangle.xml
index 456da864d2..de3b7368ad 100644
--- a/OCH/common/common/src/main/res/layout/taxi_seekbar_visualangle.xml
+++ b/OCH/common/common/src/main/res/layout/taxi_seekbar_visualangle.xml
@@ -2,8 +2,8 @@
 <merge 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="@dimen/dp_64"
-    android:layout_height="@dimen/dp_169"
+    android:layout_width="@dimen/dp_135"
+    android:layout_height="@dimen/dp_400"
     tools:parentTag="androidx.constraintlayout.widget.ConstraintLayout">
 
     <ImageView
diff --git a/OCH/taxi/driver/src/main/res/layout/taxi_base_fragment.xml b/OCH/taxi/driver/src/main/res/layout/taxi_base_fragment.xml
index 06872c5fe4..32ea6f7828 100644
--- a/OCH/taxi/driver/src/main/res/layout/taxi_base_fragment.xml
+++ b/OCH/taxi/driver/src/main/res/layout/taxi_base_fragment.xml
@@ -129,16 +129,6 @@
         app:layout_constraintTop_toBottomOf="@+id/ivCameraIcon"
         tools:visibility="visible" />
 
-    <com.mogo.eagle.core.function.hmi.ui.mofang.MoFangStatusView
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_marginTop="@dimen/dp_71"
-        android:visibility="invisible"
-        app:layout_constraintEnd_toEndOf="@+id/viewLimitingVelocity"
-        app:layout_constraintTop_toBottomOf="@+id/viewLimitingVelocity"
-        app:layout_goneMarginEnd="40dp"
-        app:layout_goneMarginTop="@dimen/dp_236" />
-
     <com.mogo.eagle.core.function.hmi.ui.widget.GreenWaveView
         android:layout_width="@dimen/dp_580"
         android:layout_height="@dimen/dp_129"
@@ -440,6 +430,21 @@
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintEnd_toEndOf="parent" />
 
+    <com.mogo.eagle.core.function.hmi.ui.viewport.VisualAngleToggleView
+        android:id="@+id/visualAngleToggle"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toTopOf="@+id/smallMapView"
+        android:layout_marginEnd="@dimen/dp_50"
+        android:layout_marginBottom="@dimen/dp_30"/>
+
+    <com.mogo.eagle.core.function.hmi.ui.mofang.MoFangStatusView
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        app:layout_constraintTop_toTopOf="@+id/visualAngleToggle"
+        app:layout_constraintEnd_toStartOf="@+id/visualAngleToggle"/>
+
     <com.mogo.och.common.module.wigets.LoadingMapStatusView
         android:layout_width="match_parent"
         android:layout_height="match_parent" />
diff --git a/core/function-impl/mogo-core-function-devatools/src/main/res/layout/layout_status_bar_over_item.xml b/core/function-impl/mogo-core-function-devatools/src/main/res/layout/layout_status_bar_over_item.xml
index 7faa8a0dfa..08b00f9d2f 100644
--- a/core/function-impl/mogo-core-function-devatools/src/main/res/layout/layout_status_bar_over_item.xml
+++ b/core/function-impl/mogo-core-function-devatools/src/main/res/layout/layout_status_bar_over_item.xml
@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
 <ImageView xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@+id/iv"
-    android:layout_width="@dimen/dp_51"
-    android:layout_height="@dimen/dp_40" />
\ No newline at end of file
+    android:layout_width="@dimen/dp_51_5"
+    android:layout_height="@dimen/dp_40_5" />
\ No newline at end of file
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/java/com/mogo/eagle/core/function/hmi/ui/mofang/MoFangStatusView.kt b/core/function-impl/mogo-core-function-hmi/src/main/java/com/mogo/eagle/core/function/hmi/ui/mofang/MoFangStatusView.kt
index 3cda1fea21..2114c61714 100644
--- a/core/function-impl/mogo-core-function-hmi/src/main/java/com/mogo/eagle/core/function/hmi/ui/mofang/MoFangStatusView.kt
+++ b/core/function-impl/mogo-core-function-hmi/src/main/java/com/mogo/eagle/core/function/hmi/ui/mofang/MoFangStatusView.kt
@@ -12,24 +12,17 @@ import com.mogo.eagle.core.function.api.devatools.mofang.IMoGoMoFangProvider.OnM
 import com.mogo.eagle.core.function.call.autopilot.CallerAutoPilotStatusListenerManager
 import com.mogo.eagle.core.function.call.devatools.CallerDevaToolsManager
 import com.mogo.eagle.core.function.hmi.R
+import com.mogo.eagle.core.utilcode.kotlin.scope
 import com.mogo.eagle.core.utilcode.util.ToastUtils
-import com.mogo.eagle.core.utilcode.util.UiThreadHandler
-import kotlinx.android.synthetic.main.layout_mofang_status.view.tv_icon_1
-import kotlinx.android.synthetic.main.layout_mofang_status.view.tv_icon_2
-import kotlinx.android.synthetic.main.layout_mofang_status.view.tv_icon_3
-import kotlinx.android.synthetic.main.layout_mofang_status.view.tv_icon_4
-import kotlinx.android.synthetic.main.layout_mofang_status.view.tv_icon_5
-import kotlinx.android.synthetic.main.layout_mofang_status.view.v_lp_1
-import kotlinx.android.synthetic.main.layout_mofang_status.view.v_lp_2
-import kotlinx.android.synthetic.main.layout_mofang_status.view.v_lp_3
-import kotlinx.android.synthetic.main.layout_mofang_status.view.v_lp_4
-import kotlinx.android.synthetic.main.layout_mofang_status.view.v_lp_5
-import kotlinx.android.synthetic.main.layout_mofang_status.view.v_sp_1
-import kotlinx.android.synthetic.main.layout_mofang_status.view.v_sp_2
-import kotlinx.android.synthetic.main.layout_mofang_status.view.v_sp_3
-import kotlinx.android.synthetic.main.layout_mofang_status.view.v_sp_4
-import kotlinx.android.synthetic.main.layout_mofang_status.view.v_sp_5
-import me.jessyan.autosize.utils.AutoSizeUtils
+import kotlinx.android.synthetic.main.layout_mofang_status.view.iv_key_1
+import kotlinx.android.synthetic.main.layout_mofang_status.view.iv_key_2
+import kotlinx.android.synthetic.main.layout_mofang_status.view.iv_key_3
+import kotlinx.android.synthetic.main.layout_mofang_status.view.iv_key_4
+import kotlinx.android.synthetic.main.layout_mofang_status.view.iv_key_5
+import kotlinx.coroutines.Job
+import kotlinx.coroutines.delay
+import kotlinx.coroutines.launch
+import java.util.concurrent.ConcurrentHashMap
 import java.util.concurrent.atomic.AtomicInteger
 
 /**
@@ -43,6 +36,8 @@ class MoFangStatusView : LinearLayout, OnMoFangStatusListener, IMoGoAutopilotSta
 
     private val autoPilotState by lazy { AtomicInteger(CallerAutoPilotStatusListenerManager.getState()) }
 
+    private val pendingJobs by lazy { ConcurrentHashMap<Int, Job>() }
+
     constructor(context: Context) : super(context)
     constructor(context: Context, attrs: AttributeSet?) : super(context, attrs)
     constructor(context: Context, attrs: AttributeSet?, defStyleAttr: Int) : super(context, attrs, defStyleAttr)
@@ -50,10 +45,7 @@ class MoFangStatusView : LinearLayout, OnMoFangStatusListener, IMoGoAutopilotSta
     init {
         View.inflate(context, R.layout.layout_mofang_status, this)
         orientation = VERTICAL
-        background = ContextCompat.getDrawable(context, R.drawable.bg_mf_status)
-        val lr = AutoSizeUtils.dp2px(context, 30f)
-        val tb = AutoSizeUtils.dp2px(context, 33f)
-        setPadding(lr, tb, lr, tb)
+        background = ContextCompat.getDrawable(context, R.drawable.icon_mofang_status_bg)
     }
 
     override fun onAttachedToWindow() {
@@ -82,7 +74,7 @@ class MoFangStatusView : LinearLayout, OnMoFangStatusListener, IMoGoAutopilotSta
         if (last != state) {
             if (last == IMoGoAutopilotStatusListener.STATUS_AUTOPILOT_RUNNING) {
                 Log.d(TAG, "自驾改成非自驾，重置状态")
-                UiThreadHandler.post {
+                scope.launch {
                     reset()
                 }
             }
@@ -103,71 +95,70 @@ class MoFangStatusView : LinearLayout, OnMoFangStatusListener, IMoGoAutopilotSta
             return
         }
         if (keyCode == KeyEvent.KEYCODE_A) {
-            if (tv_icon_2?.tag != 2 && tv_icon_2?.isSelected == true) {
-                tv_icon_2?.isSelected = false
-                v_lp_2?.visibility = View.VISIBLE
-                v_lp_2?.isSelected = false
-                v_sp_2?.visibility = View.INVISIBLE
+            if (iv_key_2?.tag != "0") {
+                iv_key_2?.tag = "0"
+                iv_key_2?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+            }
+            if (iv_key_1?.tag == "0") {
+                iv_key_1?.tag = "1"
+                iv_key_1?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_clicked))
             }
-            tv_icon_1?.isSelected = true
-            v_lp_1?.visibility = View.INVISIBLE
-            v_sp_1?.visibility = View.VISIBLE
         }
 
         if (keyCode == KeyEvent.KEYCODE_B) {
-            if (tv_icon_1?.isSelected == true) {
-                tv_icon_1?.isSelected = false
-                v_lp_1?.visibility = View.VISIBLE
-                v_lp_1?.isSelected = false
-                v_sp_1?.visibility = View.INVISIBLE
+            if (iv_key_1?.tag != "0") {
+                iv_key_1?.tag = "0"
+                iv_key_1?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+            }
+            if (iv_key_2?.tag == "0") {
+                iv_key_2?.tag  = "1"
+                iv_key_2?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_clicked))
+                pendingJobs[keyCode]?.cancel()
+                scope.launch {
+                    delay(1000)
+                    iv_key_2?.tag = "0"
+                    iv_key_2?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+                }.also { pendingJobs[keyCode] = it }
             }
-            tv_icon_2?.isSelected = true
-            tv_icon_2?.tag = 1
-            v_lp_2?.visibility = View.INVISIBLE
-            v_sp_2?.visibility = View.VISIBLE
-            UiThreadHandler.postDelayed({
-                tv_icon_2?.tag = null
-                tv_icon_2?.isSelected = false
-                v_lp_2?.visibility = View.VISIBLE
-                v_lp_2?.isSelected = false
-                v_sp_2?.visibility = View.INVISIBLE
-            }, 1000)
         }
 
         if (keyCode == KeyEvent.KEYCODE_C) {
-            tv_icon_3?.isSelected = true
-            v_lp_3?.visibility = View.INVISIBLE
-            v_sp_3?.visibility = View.VISIBLE
-            UiThreadHandler.postDelayed({
-                tv_icon_3?.isSelected = false
-                v_lp_3?.visibility = View.VISIBLE
-                v_lp_3?.isSelected = false
-                v_sp_3?.visibility = View.INVISIBLE
-            }, 1000)
+            if (iv_key_3?.tag == "0") {
+                iv_key_3?.tag = "1"
+                iv_key_3?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_clicked))
+                pendingJobs[keyCode]?.cancel()
+                scope.launch {
+                    delay(1000)
+                    iv_key_3?.tag = "0"
+                    iv_key_3?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+                }.also { pendingJobs[keyCode] = it }
+            }
         }
 
         if (keyCode == KeyEvent.KEYCODE_D) {
-            tv_icon_4?.isSelected = true
-            v_lp_4?.visibility = View.INVISIBLE
-            v_sp_4?.visibility = View.VISIBLE
-            UiThreadHandler.postDelayed({
-                tv_icon_4?.isSelected = false
-                v_lp_4?.visibility = View.VISIBLE
-                v_lp_4?.isSelected = false
-                v_sp_4?.visibility = View.INVISIBLE
-            }, 1000)
+            if (iv_key_4?.tag == "0") {
+                iv_key_4?.tag = "1"
+                iv_key_4?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_clicked))
+                pendingJobs[keyCode]?.cancel()
+                scope.launch {
+                    delay(1000)
+                    iv_key_4?.tag = "0"
+                    iv_key_4?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+                }.also { pendingJobs[keyCode] = it }
+            }
         }
 
         if (keyCode == KeyEvent.KEYCODE_E) {
-            tv_icon_5?.isSelected = true
-            v_lp_5?.visibility = View.INVISIBLE
-            v_sp_5?.visibility = View.VISIBLE
-            UiThreadHandler.postDelayed({
-                tv_icon_5?.isSelected = false
-                v_lp_5?.visibility = View.VISIBLE
-                v_lp_5?.isSelected = false
-                v_sp_5?.visibility = View.INVISIBLE
-            }, 1000)
+            if (iv_key_5?.tag == "0") {
+                iv_key_5?.tag = "1"
+                iv_key_5?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_clicked))
+                pendingJobs[keyCode]?.cancel()
+                scope.launch {
+                    delay(1000)
+                    iv_key_5?.tag = "0"
+                    iv_key_5?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+                }.also { pendingJobs[keyCode] = it }
+            }
         }
     }
 
@@ -182,44 +173,41 @@ class MoFangStatusView : LinearLayout, OnMoFangStatusListener, IMoGoAutopilotSta
             return
         }
         if (keyCode == KeyEvent.KEYCODE_A) {
-            if (tv_icon_2?.tag != 2 && tv_icon_2?.isSelected == true) {
-                tv_icon_2?.isSelected = false
-                v_lp_2?.visibility = View.VISIBLE
-                v_lp_2?.isSelected = false
-                v_sp_2?.visibility = View.INVISIBLE
+            if (iv_key_2?.tag != "0") {
+                iv_key_2?.tag = "0"
+                pendingJobs[KeyEvent.KEYCODE_B]?.cancel()
+                iv_key_2?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+            }
+            if (iv_key_1?.tag != "2") {
+                iv_key_1?.tag = "2"
+                iv_key_1?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_long_clicked))
             }
-            tv_icon_1?.isSelected = true
-            v_lp_1?.visibility = View.VISIBLE
-            v_lp_1?.isSelected = true
-            v_sp_1?.visibility = View.INVISIBLE
         }
 
         if (keyCode == KeyEvent.KEYCODE_B) {
-            tv_icon_2?.isSelected = true
-            tv_icon_2?.tag = 2
-            v_lp_2?.visibility = View.VISIBLE
-            v_lp_2?.isSelected = true
-            v_sp_2?.visibility = View.INVISIBLE
-            UiThreadHandler.postDelayed({
-                tv_icon_2?.tag = null
-                tv_icon_2?.isSelected = false
-                v_lp_2?.visibility = View.VISIBLE
-                v_lp_2?.isSelected = false
-                v_sp_2?.visibility = View.INVISIBLE
-            }, 1000)
+            if (iv_key_2?.tag != "2") {
+                iv_key_2?.tag = "2"
+                iv_key_2?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_long_clicked))
+                pendingJobs[keyCode]?.cancel()
+                scope.launch {
+                    delay(1000)
+                    iv_key_2?.tag = "0"
+                    iv_key_2?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+                }
+            }
         }
 
         if (keyCode == KeyEvent.KEYCODE_E) {
-            tv_icon_5?.isSelected = true
-            v_lp_5?.visibility = View.VISIBLE
-            v_lp_5?.isSelected = true
-            v_sp_5?.visibility = View.INVISIBLE
-            UiThreadHandler.postDelayed({
-                tv_icon_5?.isSelected = false
-                v_lp_5?.visibility = View.VISIBLE
-                v_lp_5?.isSelected = false
-                v_sp_5?.visibility = View.INVISIBLE
-            }, 1000)
+            if (iv_key_5?.tag != "2") {
+                iv_key_5?.tag = "2"
+                iv_key_5?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_long_clicked))
+                pendingJobs[keyCode]?.cancel()
+                scope.launch {
+                    delay(1000)
+                    iv_key_5?.tag = "0"
+                    iv_key_5?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+                }
+            }
         }
     }
 
@@ -239,12 +227,14 @@ class MoFangStatusView : LinearLayout, OnMoFangStatusListener, IMoGoAutopilotSta
         val key1 = keyCodes[0]
         val key2 = keyCodes[1]
         if (key1 == KeyEvent.KEYCODE_A && key2 == KeyEvent.KEYCODE_B  || (key1 == KeyEvent.KEYCODE_B && key2 == KeyEvent.KEYCODE_A)) {
-            tv_icon_1?.isSelected = true
-            v_lp_1?.visibility = View.INVISIBLE
-            v_sp_1?.visibility = View.VISIBLE
-            tv_icon_2?.isSelected = true
-            v_lp_2.visibility = View.INVISIBLE
-            v_sp_2.visibility = View.VISIBLE
+            if (iv_key_1?.tag != "1") {
+                iv_key_1?.tag = "1"
+                iv_key_1?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_clicked))
+            }
+            if (iv_key_2?.tag != "1") {
+                iv_key_2?.tag = "1"
+                iv_key_2?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_clicked))
+            }
         }
     }
 
@@ -257,30 +247,25 @@ class MoFangStatusView : LinearLayout, OnMoFangStatusListener, IMoGoAutopilotSta
     }
 
     private fun reset() {
-        tv_icon_1?.isSelected = false
-        v_lp_1?.visibility = View.VISIBLE
-        v_lp_1?.isSelected = false
-        v_sp_1?.visibility = View.INVISIBLE
-
-        tv_icon_2?.isSelected = false
-        v_lp_2?.visibility = View.VISIBLE
-        v_lp_2?.isSelected = false
-        v_sp_2?.visibility = View.INVISIBLE
-
-
-        tv_icon_3?.isSelected = false
-        v_lp_3?.visibility = View.VISIBLE
-        v_lp_3?.isSelected = false
-        v_sp_3?.visibility = View.INVISIBLE
-
-        tv_icon_4?.isSelected = false
-        v_lp_4?.visibility = View.VISIBLE
-        v_lp_4?.isSelected = false
-        v_sp_4?.visibility = View.INVISIBLE
-
-        tv_icon_5?.isSelected = false
-        v_lp_5?.visibility = View.VISIBLE
-        v_lp_5?.isSelected = false
-        v_sp_5?.visibility = View.INVISIBLE
+        if (iv_key_1?.tag != "0") {
+            iv_key_1?.tag = "0"
+            iv_key_1?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+        }
+        if (iv_key_2?.tag != "0") {
+            iv_key_2?.tag = "0"
+            iv_key_2?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+        }
+        if (iv_key_3?.tag != "0") {
+            iv_key_3?.tag = "0"
+            iv_key_3?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+        }
+        if (iv_key_4?.tag != "0") {
+            iv_key_4?.tag = "0"
+            iv_key_4?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+        }
+        if (iv_key_5?.tag != "0") {
+            iv_key_5?.tag = "0"
+            iv_key_5?.setImageDrawable(ContextCompat.getDrawable(context, R.drawable.icon_mofang_key_default))
+        }
     }
 }
\ No newline at end of file
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/java/com/mogo/eagle/core/function/hmi/ui/viewport/VisualAngleToggleView.kt b/core/function-impl/mogo-core-function-hmi/src/main/java/com/mogo/eagle/core/function/hmi/ui/viewport/VisualAngleToggleView.kt
new file mode 100644
index 0000000000..f4c63f507b
--- /dev/null
+++ b/core/function-impl/mogo-core-function-hmi/src/main/java/com/mogo/eagle/core/function/hmi/ui/viewport/VisualAngleToggleView.kt
@@ -0,0 +1,179 @@
+package com.mogo.eagle.core.function.hmi.ui.viewport
+
+import android.animation.Animator
+import android.animation.AnimatorListenerAdapter
+import android.animation.ValueAnimator
+import android.content.Context
+import android.util.AttributeSet
+import android.view.GestureDetector
+import android.view.LayoutInflater
+import android.view.MotionEvent
+import android.view.ViewConfiguration
+import android.view.animation.AccelerateDecelerateInterpolator
+import android.widget.LinearLayout
+import androidx.core.content.ContextCompat
+import com.mogo.eagle.core.function.angle.scenes.Default
+import com.mogo.eagle.core.function.angle.scenes.LongSight
+import com.mogo.eagle.core.function.api.map.angle.IMoGoVisualAngleChangeProvider
+import com.mogo.eagle.core.function.api.map.angle.Scene
+import com.mogo.eagle.core.function.call.map.CallerVisualAngleManager
+import com.mogo.eagle.core.function.hmi.R
+import com.mogo.eagle.core.utilcode.kotlin.scope
+import kotlinx.android.synthetic.main.layout_visual_angle_toggle.view.iv_toggle_block
+import kotlinx.coroutines.launch
+import me.jessyan.autosize.utils.AutoSizeUtils
+import kotlin.math.abs
+import kotlin.math.max
+
+class VisualAngleToggleView : LinearLayout, IMoGoVisualAngleChangeProvider.OnMoGoVisualAngleSceneChangeListener {
+
+    companion object {
+        private const val TAG = "VisualAngleToggleView"
+    }
+
+    constructor(context: Context?) : this(context, null)
+    constructor(context: Context?, attrs: AttributeSet?) : this(context, attrs, 0)
+    constructor(context: Context?, attrs: AttributeSet?, defStyleAttr: Int) : super(context, attrs, defStyleAttr) {
+        orientation = VERTICAL
+        isClickable = true
+        LayoutInflater.from(context).inflate(R.layout.layout_visual_angle_toggle, this, true)
+        val defaultSlop = AutoSizeUtils.dp2px(context, 12.0f)
+        val scrollSlop = max(context?.let { ViewConfiguration.get(it).scaledTouchSlop } ?: defaultSlop, defaultSlop)
+        val gestureDetector = GestureDetector(context, object : GestureDetector.SimpleOnGestureListener() {
+
+            override fun onDown(e: MotionEvent): Boolean {
+                return true
+            }
+
+            override fun onScroll(e1: MotionEvent, e2: MotionEvent, distanceX: Float, distanceY: Float): Boolean {
+                val absX = abs(e2.x - e1.x)
+                val absY = abs(e2.y - e1.y)
+                if (absY <= absX) {
+                    return false
+                }
+                if (e2.y - e1.y >= scrollSlop) {
+                    moveToBottom()
+                    return true
+                }
+                if (e1.y - e2.y >= scrollSlop) {
+                    moveToTop()
+                    return true
+                }
+                return super.onScroll(e1, e2, distanceX, distanceY)
+            }
+        })
+        iv_toggle_block?.setOnTouchListener { _, event -> gestureDetector.onTouchEvent(event) }
+        if (context != null) {
+            background = ContextCompat.getDrawable(context, R.drawable.bg_visual_angle_toggle)
+        }
+    }
+
+    private fun moveToBottom() {
+        if (iv_toggle_block?.tag == "0") {
+            return
+        }
+        val start = if (iv_toggle_block?.tag == 1) AutoSizeUtils.dp2px(context, 185.0f) else AutoSizeUtils.dp2px(context, 109.0f)
+        iv_toggle_block?.tag = "0"
+        iv_toggle_block?.isEnabled = false
+        val end = AutoSizeUtils.dp2px(context, 276.0f)
+        val animator = ValueAnimator.ofInt(start, end)
+        animator.addUpdateListener { l ->
+            val current = l.animatedValue as? Int ?: 0
+            (iv_toggle_block?.layoutParams as? LayoutParams)?.also { it.topMargin = current }?.also { iv_toggle_block?.layoutParams = it }
+        }
+        animator.addListener(object : AnimatorListenerAdapter() {
+            override fun onAnimationStart(animation: Animator, isReverse: Boolean) {
+                CallerVisualAngleManager.changeScene(Default())
+            }
+            override fun onAnimationEnd(animation: Animator, isReverse: Boolean) {
+                super.onAnimationEnd(animation, isReverse)
+                iv_toggle_block?.isEnabled = true
+            }
+        })
+        animator.interpolator = AccelerateDecelerateInterpolator()
+        animator.setDuration(200)
+        animator.start()
+    }
+
+    private fun moveToTop() {
+        if (iv_toggle_block?.tag == "2") {
+            return
+        }
+        val start = if (iv_toggle_block?.tag == 1) AutoSizeUtils.dp2px(context, 185.0f) else AutoSizeUtils.dp2px(context, 276.0f)
+        iv_toggle_block?.tag = "2"
+        iv_toggle_block?.isEnabled = false
+        val end = AutoSizeUtils.dp2px(context, 109.0f)
+        val animator = ValueAnimator.ofInt(start, end)
+        animator.addUpdateListener { l ->
+            val current = l.animatedValue as? Int ?: 0
+            (iv_toggle_block?.layoutParams as? LayoutParams)?.also { it.topMargin = current }?.also { iv_toggle_block?.layoutParams = it }
+        }
+        animator.addListener(object : AnimatorListenerAdapter() {
+            override fun onAnimationStart(animation: Animator, isReverse: Boolean) {
+                CallerVisualAngleManager.changeScene(LongSight())
+
+            }
+            override fun onAnimationEnd(animation: Animator, isReverse: Boolean) {
+                iv_toggle_block?.isEnabled = true
+            }
+        })
+        animator.interpolator = AccelerateDecelerateInterpolator()
+        animator.setDuration(200)
+        animator.start()
+    }
+
+    private fun moveToMiddle() {
+        if (iv_toggle_block?.tag == "1") {
+            return
+        }
+        val start = if (iv_toggle_block?.tag == 2) AutoSizeUtils.dp2px(context, 109.0f) else AutoSizeUtils.dp2px(context, 276.0f)
+        iv_toggle_block?.tag = "1"
+        iv_toggle_block?.isEnabled = false
+        val end = AutoSizeUtils.dp2px(context, 185.0f)
+        val animator = ValueAnimator.ofInt(start, end)
+        animator.addUpdateListener { l ->
+            val current = l.animatedValue as? Int ?: 0
+            (iv_toggle_block?.layoutParams as? LayoutParams)?.also { it.topMargin = current }?.also { iv_toggle_block?.layoutParams = it }
+        }
+        animator.interpolator = AccelerateDecelerateInterpolator()
+        animator.setDuration(200)
+        animator.start()
+    }
+
+    override fun onAttachedToWindow() {
+        super.onAttachedToWindow()
+        CallerVisualAngleManager.addListener(TAG, this)
+    }
+
+    override fun onDetachedFromWindow() {
+        super.onDetachedFromWindow()
+        CallerVisualAngleManager.removeListener(TAG)
+    }
+
+    override fun onSceneChanged(scene: Scene) {
+        val isCanSwitch = scene.isCanSwitch()
+        scope.launch {
+            if (isCanSwitch != isEnabled) {
+                isEnabled = isCanSwitch
+            }
+            if (iv_toggle_block?.isEnabled != isCanSwitch) {
+                iv_toggle_block?.isEnabled = isCanSwitch
+            }
+        }
+        if (!isCanSwitch) {
+            scope.launch {
+                moveToMiddle()
+            }
+        } else {
+            if (scene is Default) {
+                scope.launch {
+                    moveToBottom()
+                }
+            } else if (scene is LongSight) {
+                scope.launch {
+                    moveToTop()
+                }
+            }
+        }
+    }
+}
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_key_clicked.png b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_key_clicked.png
new file mode 100644
index 0000000000..7c8974d75b
Binary files /dev/null and b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_key_clicked.png differ
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_key_default.png b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_key_default.png
new file mode 100644
index 0000000000..73e4d23b58
Binary files /dev/null and b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_key_default.png differ
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_key_long_clicked.png b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_key_long_clicked.png
new file mode 100644
index 0000000000..390e0158fd
Binary files /dev/null and b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_key_long_clicked.png differ
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_status_bg.png b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_status_bg.png
new file mode 100644
index 0000000000..6719017216
Binary files /dev/null and b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_mofang_status_bg.png differ
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_block_default.png b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_block_default.png
new file mode 100644
index 0000000000..dff6f03248
Binary files /dev/null and b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_block_default.png differ
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_block_pressed.png b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_block_pressed.png
new file mode 100644
index 0000000000..fd960cb679
Binary files /dev/null and b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_block_pressed.png differ
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_disable.png b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_disable.png
new file mode 100644
index 0000000000..5ccedf346b
Binary files /dev/null and b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_disable.png differ
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_enable.png b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_enable.png
new file mode 100644
index 0000000000..584a7de01e
Binary files /dev/null and b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable-xhdpi/icon_visual_angle_toggle_enable.png differ
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable/bg_mf_status.xml b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable/bg_mf_status.xml
deleted file mode 100644
index d57d698808..0000000000
--- a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable/bg_mf_status.xml
+++ /dev/null
@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<shape xmlns:android="http://schemas.android.com/apk/res/android"
-    android:shape="rectangle">
-    <corners android:radius="@dimen/dp_15" />
-    <solid android:color="#30000000" />
-</shape>
\ No newline at end of file
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable/bg_visual_angle_toggle.xml b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable/bg_visual_angle_toggle.xml
new file mode 100644
index 0000000000..5db95b931c
--- /dev/null
+++ b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable/bg_visual_angle_toggle.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:state_enabled="false" android:drawable="@drawable/icon_visual_angle_toggle_disable" />
+    <item android:drawable="@drawable/icon_visual_angle_toggle_enable" />
+</selector>
\ No newline at end of file
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/drawable/bg_visual_angle_toggle_block.xml b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable/bg_visual_angle_toggle_block.xml
new file mode 100644
index 0000000000..ee8cd7c595
--- /dev/null
+++ b/core/function-impl/mogo-core-function-hmi/src/main/res/drawable/bg_visual_angle_toggle_block.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:state_pressed="true" android:drawable="@drawable/icon_visual_angle_toggle_block_pressed" />
+    <item android:drawable="@drawable/icon_visual_angle_toggle_block_default" />
+</selector>
\ No newline at end of file
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/layout/layout_mofang_status.xml b/core/function-impl/mogo-core-function-hmi/src/main/res/layout/layout_mofang_status.xml
index c5dcdbabb8..79c783b90d 100644
--- a/core/function-impl/mogo-core-function-hmi/src/main/res/layout/layout_mofang_status.xml
+++ b/core/function-impl/mogo-core-function-hmi/src/main/res/layout/layout_mofang_status.xml
@@ -1,195 +1,64 @@
 <?xml version="1.0" encoding="utf-8"?>
 <merge xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
-    tools:parentTag="android.widget.LinearLayout"
-    tools:layout_width="wrap_content"
+    tools:background="@drawable/icon_mofang_status_bg"
     tools:layout_height="wrap_content"
+    tools:layout_width="wrap_content"
     tools:orientation="vertical"
-    tools:background="@drawable/bg_mf_status"
-    tools:paddingLeft="@dimen/dp_30"
-    android:paddingRight="@dimen/dp_30"
-    android:paddingTop="@dimen/dp_33"
-    android:paddingBottom="@dimen/dp_33">
+    tools:parentTag="android.widget.LinearLayout">
 
-    <LinearLayout
-        android:orientation="horizontal"
-        android:layout_width="@dimen/dp_254"
-        android:layout_height="@dimen/dp_70"
-        android:padding="@dimen/dp_5"
-        android:background="@drawable/bg_mf_key_group">
-        <TextView
-            android:id="@+id/tv_icon_1"
-            android:layout_width="@dimen/dp_58"
-            android:layout_height="@dimen/dp_58"
-            android:gravity="center"
-            android:text="1"
-            android:textSize="@dimen/dp_34"
-            android:textColor="#FFFFFF"
-            android:textStyle="bold"
-            android:background="@drawable/bg_mf_key"/>
-        <FrameLayout
-            android:layout_width="@dimen/dp_137"
-            android:layout_height="wrap_content"
-            android:layout_marginStart="@dimen/dp_23"
-            android:layout_gravity="center_vertical"
-            android:clipToPadding="false"
-            android:clipChildren="false"
-            android:layout_marginEnd="@dimen/dp_28">
-            <View
-                android:id="@+id/v_lp_1"
-                android:layout_width="@dimen/dp_137"
-                android:layout_height="@dimen/dp_8"
-                android:background="@drawable/bg_mf_lp_bar"/>
-            <View
-                android:id="@+id/v_sp_1"
-                android:visibility="gone"
-                android:layout_width="@dimen/dp_49"
-                android:layout_height="@dimen/dp_8"
-                android:background="@drawable/bg_mf_sp_bar"/>
-        </FrameLayout>
-    </LinearLayout>
-    <LinearLayout
-        android:orientation="horizontal"
-        android:layout_width="@dimen/dp_254"
-        android:layout_height="@dimen/dp_70"
-        android:padding="@dimen/dp_5"
-        android:layout_marginTop="@dimen/dp_30"
-        android:background="@drawable/bg_mf_key_group">
-        <TextView
-            android:id="@+id/tv_icon_2"
-            android:layout_width="@dimen/dp_58"
-            android:layout_height="@dimen/dp_58"
-            android:gravity="center"
-            android:text="2"
-            android:textSize="@dimen/dp_34"
-            android:textColor="#FFFFFF"
-            android:textStyle="bold"
-            android:background="@drawable/bg_mf_key"/>
-        <FrameLayout
-            android:layout_width="@dimen/dp_137"
-            android:layout_height="wrap_content"
-            android:layout_marginStart="@dimen/dp_23"
-            android:layout_gravity="center_vertical"
-            android:layout_marginEnd="@dimen/dp_28">
-            <View
-                android:id="@+id/v_lp_2"
-                android:layout_width="@dimen/dp_137"
-                android:layout_height="@dimen/dp_8"
-                android:background="@drawable/bg_mf_lp_bar"/>
-            <View
-                android:id="@+id/v_sp_2"
-                android:visibility="gone"
-                android:layout_width="@dimen/dp_49"
-                android:layout_height="@dimen/dp_8"
-                android:background="@drawable/bg_mf_sp_bar"/>
-        </FrameLayout>
-    </LinearLayout>
-    <LinearLayout
-        android:orientation="horizontal"
-        android:layout_width="@dimen/dp_254"
-        android:layout_height="@dimen/dp_70"
-        android:padding="@dimen/dp_5"
-        android:layout_marginTop="@dimen/dp_30"
-        android:background="@drawable/bg_mf_key_group">
-        <TextView
-            android:id="@+id/tv_icon_3"
-            android:layout_width="@dimen/dp_58"
-            android:layout_height="@dimen/dp_58"
-            android:gravity="center"
-            android:text="3"
-            android:textSize="@dimen/dp_34"
-            android:textColor="#FFFFFF"
-            android:textStyle="bold"
-            android:background="@drawable/bg_mf_key"/>
-        <FrameLayout
-            android:layout_width="@dimen/dp_137"
-            android:layout_height="wrap_content"
-            android:layout_marginStart="@dimen/dp_23"
-            android:layout_gravity="center_vertical"
-            android:layout_marginEnd="@dimen/dp_28">
-            <View
-                android:id="@+id/v_lp_3"
-                android:layout_width="@dimen/dp_137"
-                android:layout_height="@dimen/dp_8"
-                android:background="@drawable/bg_mf_lp_bar"/>
-            <View
-                android:id="@+id/v_sp_3"
-                android:visibility="gone"
-                android:layout_width="@dimen/dp_49"
-                android:layout_height="@dimen/dp_8"
-                android:background="@drawable/bg_mf_sp_bar"/>
-        </FrameLayout>
-    </LinearLayout>
-    <LinearLayout
-        android:orientation="horizontal"
-        android:layout_width="@dimen/dp_254"
-        android:layout_height="@dimen/dp_70"
-        android:padding="@dimen/dp_5"
-        android:layout_marginTop="@dimen/dp_30"
-        android:background="@drawable/bg_mf_key_group">
-        <TextView
-            android:id="@+id/tv_icon_4"
-            android:layout_width="@dimen/dp_58"
-            android:layout_height="@dimen/dp_58"
-            android:gravity="center"
-            android:text="4"
-            android:textSize="@dimen/dp_34"
-            android:textColor="#FFFFFF"
-            android:textStyle="bold"
-            android:background="@drawable/bg_mf_key"/>
-        <FrameLayout
-            android:layout_width="@dimen/dp_137"
-            android:layout_height="wrap_content"
-            android:layout_marginStart="@dimen/dp_23"
-            android:layout_gravity="center_vertical"
-            android:layout_marginEnd="@dimen/dp_28">
-            <View
-                android:id="@+id/v_lp_4"
-                android:layout_width="@dimen/dp_137"
-                android:layout_height="@dimen/dp_8"
-                android:background="@drawable/bg_mf_lp_bar"/>
-            <View
-                android:id="@+id/v_sp_4"
-                android:visibility="gone"
-                android:layout_width="@dimen/dp_49"
-                android:layout_height="@dimen/dp_8"
-                android:background="@drawable/bg_mf_sp_bar"/>
-        </FrameLayout>
-    </LinearLayout>
-    <LinearLayout
-        android:orientation="horizontal"
-        android:layout_width="@dimen/dp_254"
-        android:layout_height="@dimen/dp_70"
-        android:padding="@dimen/dp_5"
-        android:layout_marginTop="@dimen/dp_30"
-        android:background="@drawable/bg_mf_key_group">
-        <TextView
-            android:id="@+id/tv_icon_5"
-            android:layout_width="@dimen/dp_58"
-            android:layout_height="@dimen/dp_58"
-            android:gravity="center"
-            android:text="5"
-            android:textSize="@dimen/dp_34"
-            android:textColor="#FFFFFF"
-            android:textStyle="bold"
-            android:background="@drawable/bg_mf_key"/>
-        <FrameLayout
-            android:layout_width="@dimen/dp_137"
-            android:layout_height="wrap_content"
-            android:layout_marginStart="@dimen/dp_23"
-            android:layout_gravity="center_vertical"
-            android:layout_marginEnd="@dimen/dp_28">
-            <View
-                android:id="@+id/v_lp_5"
-                android:layout_width="@dimen/dp_137"
-                android:layout_height="@dimen/dp_8"
-                android:background="@drawable/bg_mf_lp_bar"/>
-            <View
-                android:id="@+id/v_sp_5"
-                android:visibility="gone"
-                android:layout_width="@dimen/dp_49"
-                android:layout_height="@dimen/dp_8"
-                android:background="@drawable/bg_mf_sp_bar"/>
-        </FrameLayout>
-    </LinearLayout>
+    <ImageView
+        android:id="@+id/iv_key_1"
+        android:layout_width="@dimen/dp_64"
+        android:layout_height="@dimen/dp_64"
+        android:layout_gravity="center_horizontal"
+        android:scaleType="centerInside"
+        android:layout_marginStart="@dimen/dp_3"
+        android:layout_marginTop="@dimen/dp_48"
+        android:tag="0"
+        android:src="@drawable/icon_mofang_key_default" />
+
+    <ImageView
+        android:id="@+id/iv_key_2"
+        android:layout_width="@dimen/dp_64"
+        android:layout_height="@dimen/dp_64"
+        android:scaleType="centerInside"
+        android:layout_gravity="center_horizontal"
+        android:layout_marginStart="@dimen/dp_3"
+        android:layout_marginTop="@dimen/dp_6"
+        android:tag="0"
+        android:src="@drawable/icon_mofang_key_default" />
+
+    <ImageView
+        android:id="@+id/iv_key_3"
+        android:layout_width="@dimen/dp_64"
+        android:layout_height="@dimen/dp_64"
+        android:scaleType="centerInside"
+        android:layout_gravity="center_horizontal"
+        android:layout_marginStart="@dimen/dp_3"
+        android:layout_marginTop="@dimen/dp_6"
+        android:tag="0"
+        android:src="@drawable/icon_mofang_key_default" />
+
+    <ImageView
+        android:id="@+id/iv_key_4"
+        android:layout_width="@dimen/dp_64"
+        android:layout_height="@dimen/dp_64"
+        android:scaleType="centerInside"
+        android:layout_gravity="center_horizontal"
+        android:layout_marginStart="@dimen/dp_3"
+        android:layout_marginTop="@dimen/dp_6"
+        android:tag="0"
+        android:src="@drawable/icon_mofang_key_default" />
+
+    <ImageView
+        android:id="@+id/iv_key_5"
+        android:layout_width="@dimen/dp_64"
+        android:layout_height="@dimen/dp_64"
+        android:scaleType="centerInside"
+        android:layout_gravity="center_horizontal"
+        android:layout_marginStart="@dimen/dp_3"
+        android:layout_marginTop="@dimen/dp_6"
+        android:tag="0"
+        android:src="@drawable/icon_mofang_key_default" />
 </merge>
\ No newline at end of file
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/layout/layout_visual_angle_toggle.xml b/core/function-impl/mogo-core-function-hmi/src/main/res/layout/layout_visual_angle_toggle.xml
new file mode 100644
index 0000000000..51091be7cc
--- /dev/null
+++ b/core/function-impl/mogo-core-function-hmi/src/main/res/layout/layout_visual_angle_toggle.xml
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="utf-8"?>
+<merge xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    tools:background="@drawable/bg_visual_angle_toggle"
+    tools:layout_height="wrap_content"
+    tools:layout_width="wrap_content"
+    tools:orientation="vertical"
+    tools:parentTag="android.widget.LinearLayout">
+
+    <ImageView
+        android:id="@+id/iv_toggle_block"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginStart="@dimen/dp_10"
+        android:background="@drawable/bg_visual_angle_toggle_block"
+        android:layout_marginTop="@dimen/dp_276"
+        android:tag="0"
+        tools:layout_marginTop="@dimen/dp_276" />
+</merge>
\ No newline at end of file
diff --git a/core/function-impl/mogo-core-function-hmi/src/main/res/layout/view_bone_container.xml b/core/function-impl/mogo-core-function-hmi/src/main/res/layout/view_bone_container.xml
index ea8151d960..bd69fafeaf 100644
--- a/core/function-impl/mogo-core-function-hmi/src/main/res/layout/view_bone_container.xml
+++ b/core/function-impl/mogo-core-function-hmi/src/main/res/layout/view_bone_container.xml
@@ -33,4 +33,6 @@
         android:elevation="20dp"
         app:layout_constraintLeft_toLeftOf="parent"
         app:layout_constraintTop_toTopOf="parent" />
+
+
 </androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/core/mogo-core-res/src/main/res/values/dimens.xml b/core/mogo-core-res/src/main/res/values/dimens.xml
index fa65ef033e..89d49350f9 100644
--- a/core/mogo-core-res/src/main/res/values/dimens.xml
+++ b/core/mogo-core-res/src/main/res/values/dimens.xml
@@ -65,6 +65,7 @@
     <dimen name="dp_38">38dp</dimen>
     <dimen name="dp_39">39dp</dimen>
     <dimen name="dp_40">40dp</dimen>
+    <dimen name="dp_40_5">40.5dp</dimen>
     <dimen name="dp_41">41dp</dimen>
     <dimen name="dp_42">42dp</dimen>
     <dimen name="dp_43">43dp</dimen>
@@ -76,6 +77,7 @@
     <dimen name="dp_49">49dp</dimen>
     <dimen name="dp_50">50dp</dimen>
     <dimen name="dp_51">51dp</dimen>
+    <dimen name="dp_51_5">51.5dp</dimen>
     <dimen name="dp_52">52dp</dimen>
     <dimen name="dp_53">53dp</dimen>
     <dimen name="dp_54">54dp</dimen>
diff --git a/core/mogo-core-utils/src/main/java/com/mogo/eagle/core/utilcode/kotlin/Extensions.kt b/core/mogo-core-utils/src/main/java/com/mogo/eagle/core/utilcode/kotlin/Extensions.kt
index a39239dd0d..e0ad842277 100644
--- a/core/mogo-core-utils/src/main/java/com/mogo/eagle/core/utilcode/kotlin/Extensions.kt
+++ b/core/mogo-core-utils/src/main/java/com/mogo/eagle/core/utilcode/kotlin/Extensions.kt
@@ -98,7 +98,7 @@ val <T: View> T.lifecycleOwner: LifecycleOwner
     }
 
 val <T: View> T.scope
-    get() = lifecycleOwner.lifecycleScope
+    get() = lifecycleOwner.lifecycleScope + SupervisorJob()
 
 fun View.onClick(block: (View) -> Unit) {
     this.setOnClickListener {