Use Lottie animation for traffic light face education
Test: Manual
Bug: 182716681
Change-Id: Ia4c9dea5c900c71ec7eca7946cf090fd02b436e2
diff --git a/Android.bp b/Android.bp
index 2d4c42c..bb9db22 100644
--- a/Android.bp
+++ b/Android.bp
@@ -72,6 +72,7 @@
"zxing-core-1.7",
"android.hardware.dumpstate-V1.0-java",
"android.hardware.dumpstate-V1.1-java",
+ "lottie",
],
libs: [
diff --git a/res/layout/face_enroll_education.xml b/res/layout/face_enroll_education.xml
index 4ef32b7..646856f 100644
--- a/res/layout/face_enroll_education.xml
+++ b/res/layout/face_enroll_education.xml
@@ -41,12 +41,22 @@
android:layout_marginVertical="12dp">
<com.google.android.setupdesign.view.IllustrationVideoView
- android:id="@+id/illustration_normal"
+ android:id="@+id/illustration_default"
style="@style/SudContentIllustration"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:sudVideo="@raw/face_education"/>
+ <com.airbnb.lottie.LottieAnimationView
+ android:id="@+id/illustration_lottie"
+ android:layout_width="match_parent"
+ android:layout_height="340dp"
+ android:scaleType="fitCenter"
+ android:visibility="invisible"
+ app:lottie_autoPlay="true"
+ app:lottie_loop="true"
+ app:lottie_rawRes="@raw/face_education_lottie" />
+
<ImageView
android:id="@+id/illustration_accessibility"
android:layout_width="wrap_content"
diff --git a/res/raw/face_education_lottie.json b/res/raw/face_education_lottie.json
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/res/raw/face_education_lottie.json
diff --git a/res/values/config.xml b/res/values/config.xml
index 1e2855b..9cf48b1 100755
--- a/res/values/config.xml
+++ b/res/values/config.xml
@@ -269,6 +269,9 @@
<!-- ComponentName to launch a vendor-specific enrollment activity if available -->
<string name="config_face_enroll" translatable="false"></string>
+ <!-- Whether to use the Lottie animation for the face education enrollment screen -->
+ <bool name="config_face_education_use_lottie">false</bool>
+
<!-- App intent -->
<string name="config_account_intent_uri" translatable="false"></string>
diff --git a/src/com/android/settings/biometrics/face/FaceEnrollEducation.java b/src/com/android/settings/biometrics/face/FaceEnrollEducation.java
index 2ad4070..49a4748 100644
--- a/src/com/android/settings/biometrics/face/FaceEnrollEducation.java
+++ b/src/com/android/settings/biometrics/face/FaceEnrollEducation.java
@@ -37,6 +37,7 @@
import com.android.settings.biometrics.BiometricUtils;
import com.android.settings.password.ChooseLockSettingsHelper;
+import com.airbnb.lottie.LottieAnimationView;
import com.google.android.setupcompat.template.FooterBarMixin;
import com.google.android.setupcompat.template.FooterButton;
import com.google.android.setupcompat.util.WizardManagerHelper;
@@ -52,7 +53,9 @@
private FaceManager mFaceManager;
private FaceEnrollAccessibilityToggle mSwitchDiversity;
- private IllustrationVideoView mIllustrationNormal;
+ private boolean mIsUsingLottie;
+ private IllustrationVideoView mIllustrationDefault;
+ private LottieAnimationView mIllustrationLottie;
private View mIllustrationAccessibility;
private Handler mHandler;
private Intent mResultIntent;
@@ -78,12 +81,10 @@
updateHeaders(headerRes, descriptionRes);
if (isChecked) {
- mIllustrationNormal.stop();
- mIllustrationNormal.setVisibility(View.INVISIBLE);
+ hideDefaultIllustration();
mIllustrationAccessibility.setVisibility(View.VISIBLE);
} else {
- mIllustrationNormal.setVisibility(View.VISIBLE);
- mIllustrationNormal.start();
+ showDefaultIllustration();
mIllustrationAccessibility.setVisibility(View.INVISIBLE);
}
}
@@ -102,10 +103,19 @@
mFaceManager = Utils.getFaceManagerOrNull(this);
- mIllustrationNormal = findViewById(R.id.illustration_normal);
+ mIllustrationDefault = findViewById(R.id.illustration_default);
+ mIllustrationLottie = findViewById(R.id.illustration_lottie);
mIllustrationAccessibility = findViewById(R.id.illustration_accessibility);
mDescriptionText = findViewById(R.id.sud_layout_description);
+ mIsUsingLottie = getResources().getBoolean(R.bool.config_face_education_use_lottie);
+ if (mIsUsingLottie) {
+ mIllustrationDefault.stop();
+ mIllustrationDefault.setVisibility(View.INVISIBLE);
+ mIllustrationLottie.setVisibility(View.VISIBLE);
+ mIllustrationLottie.playAnimation();
+ }
+
mFooterBarMixin = getLayout().getMixin(FooterBarMixin.class);
if (WizardManagerHelper.isAnySetupWizard(getIntent())) {
@@ -256,4 +266,24 @@
layout.setHeaderText(headerText);
layout.setDescriptionText(descriptionRes);
}
+
+ private void hideDefaultIllustration() {
+ if (mIsUsingLottie) {
+ mIllustrationLottie.cancelAnimation();
+ mIllustrationLottie.setVisibility(View.INVISIBLE);
+ } else {
+ mIllustrationDefault.stop();
+ mIllustrationDefault.setVisibility(View.INVISIBLE);
+ }
+ }
+
+ private void showDefaultIllustration() {
+ if (mIsUsingLottie) {
+ mIllustrationLottie.setVisibility(View.VISIBLE);
+ mIllustrationLottie.playAnimation();
+ } else {
+ mIllustrationDefault.setVisibility(View.VISIBLE);
+ mIllustrationDefault.start();
+ }
+ }
}