Donate to e Foundation | Murena handsets with /e/OS | Own a part of Murena! Learn more

Commit 7f60fb54 authored by burakov's avatar burakov
Browse files

[Dual Shade] Define dynamic colors for the shade header chips. 

Also, reduce the horizontal paddings to 6dp per the latest UX spec.

Bug: 397223606
Test: Unit tests still pass.
Test: Manually by opening the notifications shade and quick settings
 shades and observing the colors appear as expected.
Flag: com.android.systemui.scene_container
Change-Id: I4a250c7fba9c795cf0d16c5851a3417236f4d721
parent aa6b9b69

packages/SystemUI/compose/features/src/com/android/systemui/shade/ui/composable/ShadeHeader.kt

+16 −28
Original line number Diff line number Diff line
@@ -65,6 +65,7 @@ import com.android.compose.animation.scene.ValueKey 
import com.android.compose.animation.scene.animateElementFloatAsState

import com.android.compose.animation.scene.content.state.TransitionState

import com.android.compose.modifiers.thenIf

import com.android.compose.theme.colorAttr

import com.android.settingslib.Utils

import com.android.systemui.battery.BatteryMeterView

import com.android.systemui.battery.BatteryMeterViewController
@@ -75,8 +76,6 @@ import com.android.systemui.compose.modifiers.sysuiResTag 
import com.android.systemui.privacy.OngoingPrivacyChip

import com.android.systemui.res.R

import com.android.systemui.scene.shared.model.Scenes

import com.android.systemui.shade.ui.composable.ShadeHeader.Colors.chipBackground

import com.android.systemui.shade.ui.composable.ShadeHeader.Colors.chipHighlighted

import com.android.systemui.shade.ui.composable.ShadeHeader.Colors.onScrimDim

import com.android.systemui.shade.ui.composable.ShadeHeader.Dimensions.ChipPaddingHorizontal

import com.android.systemui.shade.ui.composable.ShadeHeader.Dimensions.ChipPaddingVertical
@@ -107,7 +106,7 @@ object ShadeHeader { 
    object Dimensions {

        val CollapsedHeight = 48.dp

        val ExpandedHeight = 120.dp

        val ChipPaddingHorizontal = 8.dp

        val ChipPaddingHorizontal = 6.dp

        val ChipPaddingVertical = 4.dp

    }
@@ -117,12 +116,6 @@ object ShadeHeader { 


        val ColorScheme.onScrimDim: Color

            get() = Color.DarkGray



        val ColorScheme.chipBackground: Color

            get() = Color.DarkGray



        val ColorScheme.chipHighlighted: Color

            get() = Color.LightGray

    }



    object TestTags {
@@ -165,7 +158,7 @@ fun ContentScope.CollapsedShadeHeader( 
                VariableDayDate(

                    longerDateText = viewModel.longerDateText,

                    shorterDateText = viewModel.shorterDateText,

                    chipHighlight = viewModel.notificationsChipHighlight,

                    textColor = colorAttr(android.R.attr.textColorPrimary),

                    modifier = Modifier.element(ShadeHeader.Elements.CollapsedContentStart),

                )

            }
@@ -265,7 +258,7 @@ fun ContentScope.ExpandedShadeHeader( 
                VariableDayDate(

                    longerDateText = viewModel.longerDateText,

                    shorterDateText = viewModel.shorterDateText,

                    chipHighlight = viewModel.notificationsChipHighlight,

                    textColor = colorAttr(android.R.attr.textColorPrimary),

                    modifier = Modifier.widthIn(max = 90.dp),

                )

                Spacer(modifier = Modifier.weight(1f))
@@ -310,6 +303,7 @@ fun ContentScope.OverlayShadeHeader( 
                verticalAlignment = Alignment.CenterVertically,

                modifier = Modifier.padding(horizontal = horizontalPadding),

            ) {

                val chipHighlight = viewModel.notificationsChipHighlight

                if (isShadeLayoutWide) {

                    Clock(

                        scale = 1f,
@@ -319,13 +313,13 @@ fun ContentScope.OverlayShadeHeader( 
                    Spacer(modifier = Modifier.width(5.dp))

                }

                NotificationsChip(

                    chipHighlight = viewModel.notificationsChipHighlight,

                    onClick = viewModel::onNotificationIconChipClicked,

                    backgroundColor = chipHighlight.backgroundColor(MaterialTheme.colorScheme),

                ) {

                    VariableDayDate(

                        longerDateText = viewModel.longerDateText,

                        shorterDateText = viewModel.shorterDateText,

                        chipHighlight = viewModel.notificationsChipHighlight,

                        textColor = chipHighlight.foregroundColor(MaterialTheme.colorScheme),

                    )

                }

            }
@@ -338,14 +332,13 @@ fun ContentScope.OverlayShadeHeader( 
            ) {

                val chipHighlight = viewModel.quickSettingsChipHighlight

                SystemIconChip(

                    chipHighlight = chipHighlight,

                    backgroundColor = chipHighlight.backgroundColor(MaterialTheme.colorScheme),

                    onClick = viewModel::onSystemIconChipClicked,

                ) {

                    StatusIcons(

                        viewModel = viewModel,

                        useExpandedFormat = false,

                        modifier = Modifier.padding(end = 6.dp).weight(1f, fill = false),

                        chipHighlight = chipHighlight,

                    )

                    BatteryIcon(

                        createBatteryMeterViewController =
@@ -515,6 +508,7 @@ private fun BatteryIcon( 
            batteryIcon.setPercentShowMode(

                if (useExpandedFormat) BatteryMeterView.MODE_ESTIMATE else BatteryMeterView.MODE_ON

            )

            // TODO(b/397223606): Get the actual spec for this.

            if (chipHighlight is HeaderChipHighlight.Strong) {

                batteryIcon.updateColors(primaryColor, inverseColor, inverseColor)

            } else if (chipHighlight is HeaderChipHighlight.Weak) {
@@ -553,7 +547,6 @@ private fun ContentScope.StatusIcons( 
    viewModel: ShadeHeaderViewModel,

    useExpandedFormat: Boolean,

    modifier: Modifier = Modifier,

    chipHighlight: HeaderChipHighlight = HeaderChipHighlight.None,

) {

    val localContext = LocalContext.current

    val themedContext =
@@ -581,6 +574,8 @@ private fun ContentScope.StatusIcons( 
        viewModel.createTintedIconManager(iconContainer, StatusBarLocation.QS)

    }



    val chipHighlight = viewModel.quickSettingsChipHighlight



    AndroidView(

        factory = { context ->

            iconManager.setTint(primaryColor, inverseColor)
@@ -617,6 +612,7 @@ private fun ContentScope.StatusIcons( 
                iconContainer.removeIgnoredSlot(locationSlot)

            }



            // TODO(b/397223606): Get the actual spec for this.

            if (chipHighlight is HeaderChipHighlight.Strong) {

                iconManager.setTint(inverseColor, primaryColor)

            } else if (chipHighlight is HeaderChipHighlight.Weak) {
@@ -629,16 +625,12 @@ private fun ContentScope.StatusIcons( 


@Composable

private fun NotificationsChip(

    chipHighlight: HeaderChipHighlight,

    onClick: () -> Unit,

    modifier: Modifier = Modifier,

    backgroundColor: Color = Color.Unspecified,

    content: @Composable BoxScope.() -> Unit,

) {

    val interactionSource = remember { MutableInteractionSource() }

    val chipBackground =

        with(MaterialTheme.colorScheme) {

            if (chipHighlight is HeaderChipHighlight.Strong) chipHighlighted else chipBackground

        }

    Box(

        modifier =

            modifier
@@ -647,7 +639,7 @@ private fun NotificationsChip( 
                    indication = null,

                    onClick = onClick,

                )

                .background(chipBackground, RoundedCornerShape(25.dp))

                .background(backgroundColor, RoundedCornerShape(25.dp))

                .padding(horizontal = ChipPaddingHorizontal, vertical = ChipPaddingVertical)

    ) {

        content()
@@ -657,7 +649,7 @@ private fun NotificationsChip( 
@Composable

private fun SystemIconChip(

    modifier: Modifier = Modifier,

    chipHighlight: HeaderChipHighlight = HeaderChipHighlight.None,

    backgroundColor: Color = Color.Unspecified,

    onClick: (() -> Unit)? = null,

    content: @Composable RowScope.() -> Unit,

) {
@@ -667,16 +659,12 @@ private fun SystemIconChip( 
        with(MaterialTheme.colorScheme) {

            Modifier.background(onScrimDim, RoundedCornerShape(CollapsedHeight / 4))

        }

    val backgroundColor =

        with(MaterialTheme.colorScheme) {

            if (chipHighlight is HeaderChipHighlight.Strong) chipHighlighted else chipBackground

        }



    Row(

        verticalAlignment = Alignment.CenterVertically,

        modifier =

            modifier

                .thenIf(chipHighlight !is HeaderChipHighlight.None) {

                .thenIf(backgroundColor != Color.Unspecified) {

                    Modifier.background(backgroundColor, RoundedCornerShape(25.dp))

                        .padding(horizontal = ChipPaddingHorizontal, vertical = ChipPaddingVertical)

                }

packages/SystemUI/compose/features/src/com/android/systemui/shade/ui/composable/VariableDayDate.kt

+2 −8
Original line number Diff line number Diff line
@@ -4,22 +4,16 @@ import androidx.compose.material3.MaterialTheme 
import androidx.compose.material3.Text

import androidx.compose.runtime.Composable

import androidx.compose.ui.Modifier

import androidx.compose.ui.graphics.Color

import androidx.compose.ui.layout.Layout

import com.android.compose.theme.colorAttr

import com.android.systemui.shade.ui.viewmodel.ShadeHeaderViewModel.HeaderChipHighlight



@Composable

fun VariableDayDate(

    longerDateText: String,

    shorterDateText: String,

    chipHighlight: HeaderChipHighlight,

    textColor: Color,

    modifier: Modifier = Modifier,

) {

    val textColor =

        if (chipHighlight is HeaderChipHighlight.Strong)

            colorAttr(android.R.attr.textColorPrimaryInverse)

        else colorAttr(android.R.attr.textColorPrimary)



    Layout(

        contents =

            listOf(

packages/SystemUI/src/com/android/systemui/shade/ui/viewmodel/ShadeHeaderViewModel.kt

+23 −3
Original line number Diff line number Diff line
@@ -22,7 +22,9 @@ import android.icu.text.DateFormat 
import android.icu.text.DisplayContext

import android.provider.Settings

import android.view.ViewGroup

import androidx.compose.material3.ColorScheme

import androidx.compose.runtime.getValue

import androidx.compose.ui.graphics.Color

import com.android.app.tracing.coroutines.launchTraced as launch

import com.android.systemui.battery.BatteryMeterViewController

import com.android.systemui.lifecycle.ExclusiveActivatable
@@ -244,11 +246,29 @@ constructor( 


    /** Represents the background highlight of a header icons chip. */

    sealed interface HeaderChipHighlight {

        data object None : HeaderChipHighlight



        data object Weak : HeaderChipHighlight

        fun backgroundColor(colorScheme: ColorScheme): Color



        data object Strong : HeaderChipHighlight

        fun foregroundColor(colorScheme: ColorScheme): Color



        data object None : HeaderChipHighlight {

            override fun backgroundColor(colorScheme: ColorScheme): Color = Color.Unspecified



            override fun foregroundColor(colorScheme: ColorScheme): Color = colorScheme.primary

        }



        data object Weak : HeaderChipHighlight {

            override fun backgroundColor(colorScheme: ColorScheme): Color =

                colorScheme.primary.copy(alpha = 0.1f)



            override fun foregroundColor(colorScheme: ColorScheme): Color = colorScheme.primary

        }



        data object Strong : HeaderChipHighlight {

            override fun backgroundColor(colorScheme: ColorScheme): Color = colorScheme.secondary



            override fun foregroundColor(colorScheme: ColorScheme): Color = colorScheme.onSecondary

        }

    }



    private fun getFormatFromPattern(pattern: String?): DateFormat {