Merge 'Adjust Button Toggle UI component according to UX reference spec' into tm-dev am: 9e4c9485fd
Original change: https://googleplex-android-review.googlesource.com/c/platform/packages/apps/Car/systemlibs/+/17464303
Change-Id: I7919dc05cb680ba1f1eac1adb2b27c17add627b8
Signed-off-by: Automerger Merge Worker <android-build-automerger-merge-worker@system.gserviceaccount.com>
diff --git a/car-qc-lib/res/drawable/qc_row_action_divider.xml b/car-qc-lib/res/drawable/qc_row_action_divider.xml
index 75ffd46..62a8fe5 100644
--- a/car-qc-lib/res/drawable/qc_row_action_divider.xml
+++ b/car-qc-lib/res/drawable/qc_row_action_divider.xml
@@ -1,5 +1,5 @@
<!--
- ~ Copyright (C) 2021 The Android Open Source Project
+ ~ Copyright (C) 2022 The Android Open Source Project
~
~ Licensed under the Apache License, Version 2.0 (the "License");
~ you may not use this file except in compliance with the License.
@@ -17,5 +17,5 @@
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<size
android:height="0dp"
- android:width="@dimen/qc_toggle_margin"/>
-</shape>
+ android:width="@dimen/qc_row_horizontal_margin"/>
+</shape>
\ No newline at end of file
diff --git a/car-qc-lib/res/drawable/qc_toggle_background.xml b/car-qc-lib/res/drawable/qc_toggle_background.xml
index c139590..3688175 100644
--- a/car-qc-lib/res/drawable/qc_toggle_background.xml
+++ b/car-qc-lib/res/drawable/qc_toggle_background.xml
@@ -16,14 +16,13 @@
-->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background"
- android:width="@dimen/qc_toggle_size"
- android:height="@dimen/qc_toggle_size">
- <shape android:shape="rectangle">
- <solid android:color="@color/qc_toggle_background_color" />
- <corners android:radius="@dimen/qc_toggle_background_radius" />
- </shape>
+ android:width="@dimen/qc_toggle_size"
+ android:height="@dimen/qc_toggle_size"
+ android:start="@dimen/qc_toggle_background_padding"
+ android:top="@dimen/qc_toggle_background_padding"
+ android:drawable="@drawable/qc_toggle_button_background">
</item>
- <item android:width="@dimen/qc_toggle_size"
- android:height="@dimen/qc_toggle_size"
- android:drawable="@drawable/qc_toggle_rotary_background"/>
+ <item android:width="@dimen/qc_toggle_rotary_highlight_size"
+ android:height="@dimen/qc_toggle_rotary_highlight_size"
+ android:drawable="@drawable/qc_toggle_rotary_background"/>
</layer-list>
\ No newline at end of file
diff --git a/car-qc-lib/res/drawable/qc_toggle_rotary_background.xml b/car-qc-lib/res/drawable/qc_toggle_rotary_background.xml
index 406c44c..c0eb106 100644
--- a/car-qc-lib/res/drawable/qc_toggle_rotary_background.xml
+++ b/car-qc-lib/res/drawable/qc_toggle_rotary_background.xml
@@ -14,21 +14,15 @@
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
-<selector xmlns:android="http://schemas.android.com/apk/res/android">
- <item android:state_focused="true" android:state_pressed="true">
- <shape android:shape="rectangle">
- <solid android:color="@color/car_ui_rotary_focus_pressed_fill_secondary_color"/>
- <stroke android:width="@dimen/car_ui_rotary_focus_pressed_stroke_width"
- android:color="@color/car_ui_rotary_focus_pressed_stroke_secondary_color"/>
- <corners android:radius="@dimen/qc_toggle_rotary_background_radius" />
- </shape>
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+ <item
+ android:width="@dimen/qc_toggle_rotary_shadow_size"
+ android:height="@dimen/qc_toggle_rotary_shadow_size"
+ android:start="@dimen/qc_toggle_rotary_shadow_padding"
+ android:top="@dimen/qc_toggle_rotary_shadow_padding"
+ android:drawable="@drawable/qc_toggle_rotary_shadow">
</item>
- <item android:state_focused="true">
- <shape android:shape="rectangle">
- <solid android:color="@color/car_ui_rotary_focus_fill_secondary_color"/>
- <stroke android:width="@dimen/car_ui_rotary_focus_stroke_width"
- android:color="@color/car_ui_rotary_focus_stroke_secondary_color"/>
- <corners android:radius="@dimen/qc_toggle_rotary_background_radius" />
- </shape>
- </item>
-</selector>
\ No newline at end of file
+ <item android:width="@dimen/qc_toggle_rotary_highlight_size"
+ android:height="@dimen/qc_toggle_rotary_highlight_size"
+ android:drawable="@drawable/qc_toggle_rotary_highlight"/>
+</layer-list>
\ No newline at end of file
diff --git a/car-qc-lib/res/drawable/qc_toggle_rotary_highlight.xml b/car-qc-lib/res/drawable/qc_toggle_rotary_highlight.xml
new file mode 100644
index 0000000..5894a8f
--- /dev/null
+++ b/car-qc-lib/res/drawable/qc_toggle_rotary_highlight.xml
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+ ~ Copyright (C) 2021 The Android Open Source Project
+ ~
+ ~ Licensed under the Apache License, Version 2.0 (the "License");
+ ~ you may not use this file except in compliance with the License.
+ ~ You may obtain a copy of the License at
+ ~
+ ~ http://www.apache.org/licenses/LICENSE-2.0
+ ~
+ ~ Unless required by applicable law or agreed to in writing, software
+ ~ distributed under the License is distributed on an "AS IS" BASIS,
+ ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ ~ See the License for the specific language governing permissions and
+ ~ limitations under the License.
+ -->
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+ <item android:state_focused="true" android:state_pressed="true">
+ <shape android:shape="rectangle">
+ <solid android:color="@color/car_ui_rotary_focus_pressed_fill_secondary_color"/>
+ <stroke android:width="@dimen/car_ui_rotary_focus_pressed_stroke_width"
+ android:color="@color/car_ui_rotary_focus_stroke_color"/>
+ <corners android:radius="@dimen/qc_toggle_rotary_highlight_radius" />
+ </shape>
+ </item>
+ <item android:state_focused="true">
+ <shape android:shape="rectangle">
+ <solid android:color="@color/car_ui_rotary_focus_fill_color"/>
+ <stroke android:width="@dimen/car_ui_rotary_focus_stroke_width"
+ android:color="@color/car_ui_rotary_focus_stroke_color"/>
+ <corners android:radius="@dimen/qc_toggle_rotary_highlight_radius" />
+ </shape>
+ </item>
+</selector>
\ No newline at end of file
diff --git a/car-qc-lib/res/drawable/qc_toggle_rotary_shadow.xml b/car-qc-lib/res/drawable/qc_toggle_rotary_shadow.xml
new file mode 100644
index 0000000..2717321
--- /dev/null
+++ b/car-qc-lib/res/drawable/qc_toggle_rotary_shadow.xml
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+ ~ Copyright (C) 2022 The Android Open Source Project
+ ~
+ ~ Licensed under the Apache License, Version 2.0 (the "License");
+ ~ you may not use this file except in compliance with the License.
+ ~ You may obtain a copy of the License at
+ ~
+ ~ http://www.apache.org/licenses/LICENSE-2.0
+ ~
+ ~ Unless required by applicable law or agreed to in writing, software
+ ~ distributed under the License is distributed on an "AS IS" BASIS,
+ ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ ~ See the License for the specific language governing permissions and
+ ~ limitations under the License.
+ -->
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+ <item android:state_focused="true" android:state_pressed="false">
+ <shape android:shape="rectangle">
+ <stroke android:width="@dimen/qc_toggle_rotary_shadow_width"
+ android:color="@color/qc_toggle_rotary_shadow_color"/>
+ <corners android:radius="@dimen/qc_toggle_rotary_shadow_radius" />
+ </shape>
+ </item>
+</selector>
\ No newline at end of file
diff --git a/car-qc-lib/res/drawable/qc_toggle_unavailable_background.xml b/car-qc-lib/res/drawable/qc_toggle_unavailable_background.xml
index 98cbded..e9f2e12 100644
--- a/car-qc-lib/res/drawable/qc_toggle_unavailable_background.xml
+++ b/car-qc-lib/res/drawable/qc_toggle_unavailable_background.xml
@@ -16,16 +16,18 @@
-->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background"
- android:width="@dimen/qc_toggle_size"
- android:height="@dimen/qc_toggle_size">
+ android:width="@dimen/qc_toggle_size"
+ android:height="@dimen/qc_toggle_size"
+ android:start="@dimen/qc_toggle_background_padding"
+ android:top="@dimen/qc_toggle_background_padding">
<shape android:shape="rectangle">
<solid android:color="@color/qc_toggle_unavailable_background_color" />
<stroke android:color="@color/qc_toggle_unavailable_color"
- android:width="@dimen/qc_toggle_unavailable_outline_width" />
+ android:width="@dimen/qc_toggle_unavailable_outline_width" />
<corners android:radius="@dimen/qc_toggle_background_radius" />
</shape>
</item>
- <item android:width="@dimen/qc_toggle_size"
- android:height="@dimen/qc_toggle_size"
- android:drawable="@drawable/qc_toggle_rotary_background"/>
-</layer-list>
+ <item android:width="@dimen/qc_toggle_rotary_highlight_size"
+ android:height="@dimen/qc_toggle_rotary_highlight_size"
+ android:drawable="@drawable/qc_toggle_rotary_background"/>
+</layer-list>
\ No newline at end of file
diff --git a/car-qc-lib/res/values/colors.xml b/car-qc-lib/res/values/colors.xml
index e3fbd6f..62bcfdc 100644
--- a/car-qc-lib/res/values/colors.xml
+++ b/car-qc-lib/res/values/colors.xml
@@ -18,5 +18,6 @@
<color name="qc_start_icon_color">@android:color/white</color>
<color name="qc_toggle_off_background_color">#626262</color>
<color name="qc_toggle_unavailable_background_color">@android:color/transparent</color>
- <color name="qc_toggle_unavailable_color">#75FFFFFF</color>
+ <color name="qc_toggle_unavailable_color">#37FFFFFF</color>
+ <color name="qc_toggle_rotary_shadow_color">#C7000000</color>
</resources>
\ No newline at end of file
diff --git a/car-qc-lib/res/values/dimens.xml b/car-qc-lib/res/values/dimens.xml
index 6247561..b973774 100644
--- a/car-qc-lib/res/values/dimens.xml
+++ b/car-qc-lib/res/values/dimens.xml
@@ -26,10 +26,18 @@
<dimen name="qc_action_items_horizontal_margin">32dp</dimen>
<dimen name="qc_toggle_size">72dp</dimen>
<dimen name="qc_toggle_margin">12dp</dimen>
+ <dimen name="qc_row_horizontal_margin">16dp</dimen>
<dimen name="qc_toggle_background_radius">16dp</dimen>
- <dimen name="qc_toggle_rotary_background_radius">11dp</dimen>
- <dimen name="qc_toggle_foreground_icon_inset">14dp</dimen>
+ <dimen name="qc_toggle_background_padding">4dp</dimen>
+ <dimen name="qc_toggle_foreground_icon_inset">18dp</dimen>
<dimen name="qc_toggle_unavailable_outline_width">2dp</dimen>
+ <dimen name="qc_toggle_rotary_highlight_size">80dp</dimen>
+ <dimen name="qc_toggle_rotary_highlight_radius">20dp</dimen>
+ <dimen name="qc_toggle_rotary_shadow_size">64dp</dimen>
+ <dimen name="qc_toggle_rotary_shadow_width">4dp</dimen>
+ <dimen name="qc_toggle_rotary_shadow_radius">16dp</dimen>
+ <dimen name="qc_toggle_rotary_shadow_padding">8dp</dimen>
+
<dimen name="qc_seekbar_padding_top">16dp</dimen>
</resources>
\ No newline at end of file
