Android/frameworks_base
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Support lottieDynamicProperties in Illustration widget

Browse Source 
Implementation follows LottieColorUtils#applyDynamicColors and copies
settingslib colors.

Change background in Illustration to transparent to follow
IllustrationPreference.

Bug: 293138315
Test: Manual
Change-Id: If87751d1530a16cd43e6a87c1f5a63c6c9a52dfd
This commit is contained in:
Graciela Wissen Putri
2023-08-08 21:17:36 +00:00
parent 9c9649e457
commit db8431f52d
3 changed files with 108 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
packages/SettingsLib/Spa/spa/res/values/colors.xml Normal file
View File

@@ -0,0 +1,67 @@
<?xml version="1.0" encoding="utf-8"?>
<!--
Copyright (C) 2023 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.
-->
<resources>
<color name="settingslib_protection_color">@android:color/white</color>
<!-- Dynamic colors-->
<color name="settingslib_color_blue600">#1a73e8</color>
<color name="settingslib_color_blue400">#669df6</color>
<color name="settingslib_color_blue300">#8ab4f8</color>
<color name="settingslib_color_blue100">#d2e3fc</color>
<color name="settingslib_color_blue50">#e8f0fe</color>
<color name="settingslib_color_green600">#1e8e3e</color>
<color name="settingslib_color_green500">#34A853</color>
<color name="settingslib_color_green400">#5bb974</color>
<color name="settingslib_color_green100">#ceead6</color>
<color name="settingslib_color_green50">#e6f4ea</color>
<color name="settingslib_color_red600">#d93025</color>
<color name="settingslib_color_red500">#B3261E</color>
<color name="settingslib_color_red400">#ee675c</color>
<color name="settingslib_color_red100">#fad2cf</color>
<color name="settingslib_color_red50">#fce8e6</color>
<color name="settingslib_color_yellow600">#f9ab00</color>
<color name="settingslib_color_yellow400">#fcc934</color>
<color name="settingslib_color_yellow100">#feefc3</color>
<color name="settingslib_color_yellow50">#fef7e0</color>
<color name="settingslib_color_grey900">#202124</color>
<color name="settingslib_color_grey800">#3c4043</color>
<color name="settingslib_color_grey700">#5f6368</color>
<color name="settingslib_color_grey600">#80868b</color>
<color name="settingslib_color_grey500">#9AA0A6</color>
<color name="settingslib_color_grey400">#bdc1c6</color>
<color name="settingslib_color_grey300">#dadce0</color>
<color name="settingslib_color_grey200">#e8eaed</color>
<color name="settingslib_color_grey100">#f1f3f4</color>
<color name="settingslib_color_grey50">#f8f9fa</color>
<color name="settingslib_color_orange600">#e8710a</color>
<color name="settingslib_color_orange400">#fa903e</color>
<color name="settingslib_color_orange300">#fcad70</color>
<color name="settingslib_color_orange100">#fedfc8</color>
<color name="settingslib_color_pink600">#e52592</color>
<color name="settingslib_color_pink400">#ff63b8</color>
<color name="settingslib_color_pink300">#ff8bcb</color>
<color name="settingslib_color_pink100">#fdcfe8</color>
<color name="settingslib_color_purple600">#9334e6</color>
<color name="settingslib_color_purple400">#af5cf7</color>
<color name="settingslib_color_purple300">#c58af9</color>
<color name="settingslib_color_purple100">#e9d2fd</color>
<color name="settingslib_color_cyan600">#12b5c8</color>
<color name="settingslib_color_cyan400">#4ecde6</color>
<color name="settingslib_color_cyan300">#78d9ec</color>
<color name="settingslib_color_cyan100">#cbf0f8</color>
</resources>

4
packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/illustration/Illustration.kt
View File

@@ -22,11 +22,11 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.sizeIn
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import com.android.settingslib.spa.framework.theme.SettingsDimension
import com.android.settingslib.spa.widget.ui.ImageBox
import com.android.settingslib.spa.widget.ui.Lottie
@@ -81,7 +81,7 @@ fun Illustration(
maxHeight = SettingsDimension.illustrationMaxHeight,
)
.clip(RoundedCornerShape(SettingsDimension.illustrationCornerRadius))
.background(color = MaterialTheme.colorScheme.surface)
.background(color = Color.Transparent)
when (resourceType) {
ResourceType.LOTTIE -> {

39
packages/SettingsLib/Spa/spa/src/com/android/settingslib/spa/widget/ui/Lottie.kt
View File

@@ -16,15 +16,24 @@
package com.android.settingslib.spa.widget.ui
import android.graphics.PorterDuff
import android.graphics.PorterDuffColorFilter
import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.foundation.layout.Box
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.toArgb
import androidx.compose.ui.res.colorResource
import com.airbnb.lottie.LottieProperty
import com.airbnb.lottie.compose.LottieAnimation
import com.airbnb.lottie.compose.LottieCompositionSpec
import com.airbnb.lottie.compose.LottieConstants
import com.airbnb.lottie.compose.animateLottieCompositionAsState
import com.airbnb.lottie.compose.rememberLottieComposition
import com.airbnb.lottie.compose.rememberLottieDynamicProperties
import com.airbnb.lottie.compose.rememberLottieDynamicProperty
import com.android.settingslib.spa.R
@Composable
fun Lottie(
@@ -38,6 +47,34 @@ fun Lottie(
}
}
object LottieColorUtils {
private val DARK_TO_LIGHT_THEME_COLOR_MAP = mapOf(
".grey600" to R.color.settingslib_color_grey400,
".grey800" to R.color.settingslib_color_grey300,
".grey900" to R.color.settingslib_color_grey50,
".red400" to R.color.settingslib_color_red600,
".black" to android.R.color.white,
".blue400" to R.color.settingslib_color_blue600,
".green400" to R.color.settingslib_color_green600,
".green200" to R.color.settingslib_color_green500,
".red200" to R.color.settingslib_color_red500,
)
@Composable
private fun getDefaultPropertiesList() =
DARK_TO_LIGHT_THEME_COLOR_MAP.map { (key, colorRes) ->
val color = colorResource(colorRes).toArgb()
rememberLottieDynamicProperty(
property = LottieProperty.COLOR_FILTER,
keyPath = arrayOf("**", key, "**")
){ PorterDuffColorFilter(color, PorterDuff.Mode.SRC_ATOP) }
}
@Composable
fun getDefaultDynamicProperties() =
rememberLottieDynamicProperties(*getDefaultPropertiesList().toTypedArray())
}
@Composable
private fun BaseLottie(resId: Int) {
val composition by rememberLottieComposition(
@@ -47,8 +84,10 @@ private fun BaseLottie(resId: Int) {
composition,
iterations = LottieConstants.IterateForever,
)
val isLightMode = !isSystemInDarkTheme()
LottieAnimation(
composition = composition,
dynamicProperties = LottieColorUtils.getDefaultDynamicProperties().takeIf { isLightMode },
progress = { progress },
)
}