Align assets and colors for biometric enroll intros

Replaces the existing MP4 shown on the face enroll intro/consent screen
with an updated lock asset that matches the current SUW theme. Also
updates the colors of assets and text on these screens for face and
fingerprint so that the two match.

Test: Manually tested both enrollments for dark and light system themes

Bug: 187681255
Change-Id: I119da913cfc76e02160f2efc4654cecf33f1f049

res/drawable/face_enroll_intro_illustration.xml

@@ -0,0 +1,52 @@
+<?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.
+  -->
+
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+        android:width="412dp"
+        android:height="300dp"
+        android:viewportWidth="412"
+        android:viewportHeight="300">
+    <group>
+        <clip-path
+            android:pathData="M206,255.65A67.68,67.68 0,1 0,138.32 188,67.68 67.68,0 0,0 206,255.65Z"/>
+        <path
+            android:pathData="M237.58,172.63a4.51,4.51 0,1 1,-4.51 -4.51A4.51,4.51 0,0 1,237.58 172.63Z"
+            android:fillColor="@color/biometric_enroll_intro_color_icon"
+            android:fillType="evenOdd"/>
+        <path
+            android:pathData="M178.93,177.14a4.51,4.51 0,1 1,4.51 -4.51A4.51,4.51 0,0 1,178.93 177.14Z"
+            android:fillColor="@color/biometric_enroll_intro_color_icon"
+            android:fillType="evenOdd"/>
+        <path
+            android:pathData="M212.41,215.89a9.93,9.93 0,0 1,-16.34 -7.57v0l-3.6,0s0,0 0,0.06A13.53,13.53 0,0 0,206 221.85a12.81,12.81 0,0 0,1.39 -0.07,13.38 13.38,0 0,0 7.35,-3.13Z"
+            android:fillColor="@color/biometric_enroll_intro_color_icon"
+            android:fillType="evenOdd"/>
+        <path
+            android:pathData="M207.35,181.66v11.73h-7.22V197H211V181.66Z"
+            android:fillColor="@color/biometric_enroll_intro_color_icon"
+            android:fillType="evenOdd"/>
+    </group>
+    <path
+        android:pathData="M206,45.75a38,38 0,0 0,-14.87 3h0A38.16,38.16 0,0 0,167.79 84v19.21h7V84A31.17,31.17 0,0 1,193.86 55.2h0a31.24,31.24 0,0 1,38.43 11.93l5.88,-3.78A38.08,38.08 0,0 0,206 45.75Z"
+        android:fillColor="@color/biometric_enroll_intro_color_bar"/>
+    <path
+        android:pathData="M238.18,63.35l-5.89,3.78A31.11,31.11 0,0 1,237.21 84v42.55h7V84A38.11,38.11 0,0 0,238.18 63.35Z"
+        android:fillColor="@color/biometric_enroll_intro_color_bar"/>
+    <path
+        android:pathData="M271.77,254.25H140.23a14,14 0,0 1,-14 -14V138.51a14,14 0,0 1,14 -14H271.77a14,14 0,0 1,14 14V240.25A14,14 0,0 1,271.77 254.25ZM140.23,128.51a10,10 0,0 0,-10 10V240.25a10,10 0,0 0,10 10H271.77a10,10 0,0 0,10 -10V138.51a10,10 0,0 0,-10 -10Z"
+        android:fillColor="@color/biometric_enroll_intro_color_outline"/>
+</vector>

res/drawable/fingerprint_enroll_introduction.xml

@@ -21,33 +21,33 @@
     android:viewportHeight="210.0"
     android:viewportWidth="210.0">
     <path
-        android:fillColor="#34A853"
+        android:fillColor="@color/biometric_enroll_intro_color_bar"
         android:pathData="M73.79,58.17h-7V38.96c0,-15.39 9.16,-29.21 23.34,-35.21l2.73,6.45c-11.58,4.9 -19.06,16.19 -19.06,28.76V58.17z" />
     <path
-        android:fillColor="#34A853"
+        android:fillColor="@color/biometric_enroll_intro_color_bar"
         android:pathData="M131.29,22.13C125.51,13.12 115.68,7.75 105,7.75c-4.21,0 -8.3,0.82 -12.15,2.45l-2.73,-6.45c4.71,-1.99 9.72,-3 14.87,-3c13.08,0 25.11,6.58 32.18,17.6L131.29,22.13z" />
     <path
-        android:fillColor="#34A853"
+        android:fillColor="@color/biometric_enroll_intro_color_bar"
         android:pathData="M143.21,62.11h-7V38.96c0,-5.99 -1.7,-11.81 -4.92,-16.83l5.89,-3.78c3.94,6.15 6.03,13.27 6.03,20.6V62.11z" />
     <path
-        android:fillColor="#34A853"
+        android:fillColor="@color/biometric_enroll_intro_color_bar"
         android:pathData="M136.21,62.11h7v19.4h-7z" />
     <path
-        android:fillColor="#3E82F1"
+        android:fillColor="@color/biometric_enroll_intro_color_icon"
         android:pathData="M125.03,118.78c-0.28,0 -0.55,-0.07 -0.79,-0.2c-6.61,-3.37 -12.33,-4.79 -19.19,-4.79c-6.82,0 -13.3,1.6 -19.19,4.79c-0.83,0.44 -1.86,0.14 -2.34,-0.68c-0.45,-0.82 -0.14,-1.87 0.69,-2.31c6.41,-3.43 13.44,-5.2 20.84,-5.2c7.34,0 13.75,1.6 20.77,5.17c0.86,0.44 1.17,1.46 0.72,2.28C126.24,118.44 125.65,118.78 125.03,118.78z" />
     <path
-        android:fillColor="#3E82F1"
+        android:fillColor="@color/biometric_enroll_intro_color_icon"
         android:pathData="M75.73,136.63c-0.34,0 -0.69,-0.1 -1,-0.31c-0.79,-0.54 -0.96,-1.6 -0.41,-2.38c3.41,-4.76 7.75,-8.5 12.92,-11.12c10.82,-5.51 24.67,-5.54 35.52,-0.03c5.17,2.62 9.51,6.32 12.92,11.05c0.55,0.75 0.38,1.84 -0.41,2.38c-0.79,0.54 -1.86,0.37 -2.41,-0.41c-3.1,-4.28 -7.03,-7.65 -11.68,-10c-9.89,-5 -22.53,-5 -32.38,0.03c-4.69,2.38 -8.61,5.78 -11.71,10.06C76.8,136.39 76.28,136.63 75.73,136.63z" />
     <path
-        android:fillColor="#3E82F1"
+        android:fillColor="@color/biometric_enroll_intro_color_icon"
         android:pathData="M97.27,177.67c-0.45,0 -0.9,-0.17 -1.21,-0.51c-3,-2.96 -4.62,-4.86 -6.92,-8.98c-2.38,-4.18 -3.62,-9.28 -3.62,-14.76c0,-10.1 8.75,-18.33 19.5,-18.33s19.5,8.23 19.5,18.33c0,0.95 -0.76,1.7 -1.72,1.7s-1.72,-0.75 -1.72,-1.7c0,-8.23 -7.2,-14.93 -16.05,-14.93s-16.05,6.7 -16.05,14.93c0,4.9 1.1,9.42 3.2,13.09c2.2,3.91 3.72,5.58 6.37,8.23c0.65,0.68 0.65,1.73 0,2.41C98.16,177.5 97.71,177.67 97.27,177.67z" />
     <path
-        android:fillColor="#3E82F1"
+        android:fillColor="@color/biometric_enroll_intro_color_icon"
         android:pathData="M121.97,171.38c-4.1,0 -7.72,-1.02 -10.68,-3.03c-5.13,-3.43 -8.2,-9.01 -8.2,-14.93c0,-0.95 0.76,-1.7 1.72,-1.7s1.72,0.75 1.72,1.7c0,4.79 2.48,9.32 6.68,12.1c2.45,1.63 5.31,2.41 8.75,2.41c0.83,0 2.2,-0.1 3.58,-0.34c0.93,-0.17 1.83,0.44 2,1.39c0.17,0.92 -0.45,1.8 -1.41,1.97C124.17,171.34 122.45,171.38 121.97,171.38z" />
     <path
-        android:fillColor="#3E82F1"
+        android:fillColor="@color/biometric_enroll_intro_color_icon"
         android:pathData="M115.04,178.38c-0.14,0 -0.31,-0.03 -0.45,-0.07c-5.48,-1.5 -9.06,-3.5 -12.82,-7.14c-4.82,-4.73 -7.48,-11.02 -7.48,-17.75c0,-5.51 4.75,-10 10.61,-10c5.86,0 10.61,4.49 10.61,10c0,3.64 3.2,6.6 7.17,6.6s7.17,-2.96 7.17,-6.6c0,-12.82 -11.2,-23.22 -24.98,-23.22c-9.78,0 -18.74,5.37 -22.77,13.7c-1.34,2.75 -2.03,5.98 -2.03,9.52c0,2.65 0.24,6.83 2.31,12.27c0.34,0.88 -0.1,1.87 -1,2.18c-0.9,0.34 -1.89,-0.14 -2.2,-0.99c-1.69,-4.45 -2.51,-8.87 -2.51,-13.46c0,-4.08 0.79,-7.79 2.34,-11.02c4.58,-9.49 14.75,-15.64 25.87,-15.64c15.68,0 28.42,11.93 28.42,26.62c0,5.51 -4.75,10 -10.61,10c-5.86,0 -10.61,-4.49 -10.61,-10c0,-3.64 -3.2,-6.6 -7.17,-6.6s-7.17,2.96 -7.17,6.6c0,5.81 2.27,11.25 6.44,15.33c3.27,3.2 6.41,4.96 11.27,6.29c0.93,0.24 1.45,1.19 1.21,2.07C116.49,177.87 115.77,178.38 115.04,178.38z" />
     <path
-        android:fillColor="#DADCE0"
+        android:fillColor="@color/biometric_enroll_intro_color_outline"
         android:pathData="M170.77,209.25H39.23c-7.72,0 -14,-6.28 -14,-14V93.51c0,-7.72 6.28,-14 14,-14h131.54c7.72,0 14,6.28 14,14v101.74C184.77,202.97 178.49,209.25 170.77,209.25zM39.23,83.51c-5.51,0 -10,4.49 -10,10v101.74c0,5.51 4.49,10 10,10h131.54c5.51,0 10,-4.49 10,-10V93.51c0,-5.51 -4.49,-10 -10,-10H39.23z" />
 </vector>

res/layout/face_enroll_introduction.xml

@@ -27,7 +27,7 @@
     <LinearLayout
         style="@style/SudContentFrame"
         android:layout_width="match_parent"
-        android:layout_height="match_parent"
+        android:layout_height="wrap_content"
         android:clipChildren="false"
         android:clipToPadding="false"
         android:orientation="vertical">
@@ -42,24 +42,23 @@
         <FrameLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:layout_marginBottom="12dp">
+            android:layout_marginTop="-24dp"
+            android:layout_marginBottom="4dp">
 
-            <com.google.android.setupdesign.view.IllustrationVideoView
+            <ImageView
-                android:id="@+id/illustration_normal"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
                 style="@style/SudContentIllustration"
-                app:sudVideo="@raw/face_settings"/>
+                android:layout_width="match_parent"
+                android:layout_height="match_parent"
+                android:contentDescription="@null"
+                android:src="@drawable/face_enroll_intro_illustration"/>
 
         </FrameLayout>
 
-        <!-- Contains the buttons and extra information text at the bottom -->
+        <!-- Contains the extra information text at the bottom -->
         <LinearLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:orientation="vertical"
+            android:orientation="vertical">
-            android:layout_gravity="center_horizontal|bottom"
-            android:paddingTop="12dp">
 
             <TextView
                 android:layout_width="match_parent"

res/layout/fingerprint_enroll_introduction.xml

@@ -64,7 +64,8 @@
                 android:layout_height="wrap_content"
                 android:textAlignment="viewStart"
                 android:paddingTop="12dp"
-                android:text="@string/security_settings_fingerprint_v2_enroll_introduction_footer_title_2" />
+                android:text="@string/security_settings_fingerprint_v2_enroll_introduction_footer_title_2"
+                android:textColor="?android:attr/textColorPrimary"/>
 
             <LinearLayout
                 android:layout_width="match_parent"
@@ -84,7 +85,8 @@
                 <TextView
                     android:layout_width="match_parent"
                     android:layout_height="wrap_content"
-                    android:text="@string/security_settings_fingerprint_v2_enroll_introduction_footer_message_2" />
+                    android:text="@string/security_settings_fingerprint_v2_enroll_introduction_footer_message_2"
+                    android:textColor="?android:attr/textColorPrimary"/>
             </LinearLayout>
 
             <LinearLayout
@@ -105,7 +107,8 @@
                 <TextView
                     android:layout_width="match_parent"
                     android:layout_height="wrap_content"
-                    android:text="@string/security_settings_fingerprint_v2_enroll_introduction_footer_message_3" />
+                    android:text="@string/security_settings_fingerprint_v2_enroll_introduction_footer_message_3"
+                    android:textColor="?android:attr/textColorPrimary"/>
             </LinearLayout>
 
             <!-- You're in control -->
@@ -115,7 +118,8 @@
                 android:layout_height="wrap_content"
                 android:textAlignment="viewStart"
                 android:paddingTop="12dp"
-                android:text="@string/security_settings_fingerprint_enroll_introduction_footer_title_1" />
+                android:text="@string/security_settings_fingerprint_enroll_introduction_footer_title_1"
+                android:textColor="?android:attr/textColorPrimary"/>
 
             <LinearLayout
                 android:layout_width="match_parent"
@@ -135,7 +139,8 @@
                 <TextView
                     android:layout_width="match_parent"
                     android:layout_height="wrap_content"
-                    android:text="@string/security_settings_fingerprint_v2_enroll_introduction_footer_message_4" />
+                    android:text="@string/security_settings_fingerprint_v2_enroll_introduction_footer_message_4"
+                    android:textColor="?android:attr/textColorPrimary"/>
             </LinearLayout>
 
         </LinearLayout>
@@ -147,7 +152,8 @@
             android:layout_height="wrap_content"
             android:textAlignment="viewStart"
             android:paddingTop="12dp"
-            android:text="@string/security_settings_fingerprint_enroll_introduction_footer_title_2" />
+            android:text="@string/security_settings_fingerprint_enroll_introduction_footer_title_2"
+            android:textColor="?android:attr/textColorPrimary"/>
 
         <LinearLayout
             android:layout_width="match_parent"
@@ -167,7 +173,8 @@
             <TextView
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:text="@string/security_settings_fingerprint_v2_enroll_introduction_footer_message_5" />
+                android:text="@string/security_settings_fingerprint_v2_enroll_introduction_footer_message_5"
+                android:textColor="?android:attr/textColorPrimary"/>
         </LinearLayout>
 
         <LinearLayout
@@ -188,7 +195,8 @@
             <TextView
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:text="@string/security_settings_fingerprint_v2_enroll_introduction_message_learn_more" />
+                android:text="@string/security_settings_fingerprint_v2_enroll_introduction_message_learn_more"
+                android:textColor="?android:attr/textColorPrimary"/>
         </LinearLayout>
 
     </LinearLayout>

res/values-night/colors.xml

@@ -41,5 +41,10 @@
     <color name="color_surface_header">@*android:color/surface_header_dark</color>
     <!-- Dialog error color. -->
     <color name="settings_dialog_colorError">#f28b82</color> <!-- Red 300 -->
+
+    <!-- Face and fingerprint enrollment -->
+    <color name="biometric_enroll_intro_color_bar">#5bb974</color>
+    <color name="biometric_enroll_intro_color_icon">#669df6</color>
+    <color name="biometric_enroll_intro_color_outline">#5e5e5e</color>
 </resources>
 

res/values/colors.xml

@@ -126,6 +126,11 @@
     <color name="face_anim_particle_color_4">#fffdd835</color> <!-- Material Yellow 600 -->
     <color name="face_anim_particle_error">#ff9e9e9e</color> <!-- Material Gray 500 -->
 
+    <!-- Face and fingerprint enrollment -->
+    <color name="biometric_enroll_intro_color_bar">#1e8e3e</color>
+    <color name="biometric_enroll_intro_color_icon">#1a73e8</color>
+    <color name="biometric_enroll_intro_color_outline">#e3e3e3</color>
+
     <!-- notification settings -->
     <color name="notification_block_color">#ffff0000</color>
     <color name="notification_silence_color">#FF32c1de</color>