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

Commit afc6f814 authored by Caitlin Shkuratov's avatar Caitlin Shkuratov
Browse files

[SB][Notif] Add a subtle outline to notification chips. 

Now that the chips are system theme color, we need an outline to ensure
the chip is visible on all backgrounds. See b/394611253#comment2 for
screenshots.

Bug: 394611253
Bug: 364653005
Flag: com.android.systemui.status_bar_notification_chips

Test: Trigger notif chip -> verify outline shown around chip (verify
with chips_modernization both OFF and ON)
Test: Trigger notif chip, then dismiss it, then trigger screen share
chip -> verify screen share chip doesn't have an outline

Change-Id: I63ae4d12d438b0e1a88fb8f1dfb896188d43e831
parent a411d8c8

packages/SystemUI/res/values/dimens.xml

+1 −0
Original line number Diff line number Diff line
@@ -1811,6 +1811,7 @@ 
    <dimen name="ongoing_activity_chip_text_end_padding_for_embedded_padding_icon">6dp</dimen>

    <dimen name="ongoing_activity_chip_text_fading_edge_length">12dp</dimen>

    <dimen name="ongoing_activity_chip_corner_radius">28dp</dimen>

    <dimen name="ongoing_activity_chip_outline_width">2px</dimen>



    <!-- Status bar user chip -->

    <dimen name="status_bar_user_chip_avatar_size">16dp</dimen>

packages/SystemUI/src/com/android/systemui/statusbar/chips/ui/binder/OngoingActivityChipBinder.kt

+21 −2
Original line number Diff line number Diff line
@@ -17,6 +17,7 @@ 
package com.android.systemui.statusbar.chips.ui.binder



import android.annotation.IdRes

import android.content.Context

import android.content.res.ColorStateList

import android.graphics.drawable.GradientDrawable

import android.view.View
@@ -32,6 +33,7 @@ import com.android.systemui.common.ui.binder.IconViewBinder 
import com.android.systemui.res.R

import com.android.systemui.statusbar.StatusBarIconView

import com.android.systemui.statusbar.chips.notification.shared.StatusBarNotifChips

import com.android.systemui.statusbar.chips.ui.model.ColorsModel

import com.android.systemui.statusbar.chips.ui.model.OngoingActivityChipModel

import com.android.systemui.statusbar.chips.ui.view.ChipBackgroundContainer

import com.android.systemui.statusbar.chips.ui.view.ChipChronometer
@@ -76,8 +78,10 @@ object OngoingActivityChipBinder { 
                chipTimeView.setTextColor(textColor)

                chipTextView.setTextColor(textColor)

                chipShortTimeDeltaView.setTextColor(textColor)

                (chipBackgroundView.background as GradientDrawable).color =

                    chipModel.colors.background(chipContext)

                (chipBackgroundView.background as GradientDrawable).setBackgroundColors(

                    chipModel.colors,

                    chipContext,

                )

            }

            is OngoingActivityChipModel.Inactive -> {

                // The Chronometer should be stopped to prevent leaks -- see b/192243808 and
@@ -460,5 +464,20 @@ object OngoingActivityChipBinder { 
        chipView.minimumWidth = minimumWidth

    }



    private fun GradientDrawable.setBackgroundColors(colors: ColorsModel, context: Context) {

        this.color = colors.background(context)

        val outline = colors.outline(context)

        if (outline != null) {

            this.setStroke(

                context.resources.getDimensionPixelSize(

                    R.dimen.ongoing_activity_chip_outline_width

                ),

                outline,

            )

        } else {

            this.setStroke(0, /* color= */ 0)

        }

    }



    @IdRes private val CUSTOM_ICON_VIEW_ID = R.id.ongoing_activity_chip_custom_icon

}

packages/SystemUI/src/com/android/systemui/statusbar/chips/ui/compose/OngoingActivityChip.kt

+17 −7
Original line number Diff line number Diff line
@@ -19,6 +19,7 @@ package com.android.systemui.statusbar.chips.ui.compose 
import android.content.res.ColorStateList

import android.view.ViewGroup

import androidx.compose.foundation.background

import androidx.compose.foundation.border

import androidx.compose.foundation.clickable

import androidx.compose.foundation.layout.Arrangement

import androidx.compose.foundation.layout.Box
@@ -103,6 +104,13 @@ private fun ChipBody( 
        } else {

            dimensionResource(id = R.dimen.ongoing_activity_chip_min_text_width) + chipSidePadding

        }



    val outline = model.colors.outline(context)

    val outlineWidth = dimensionResource(R.dimen.ongoing_activity_chip_outline_width)



    val shape =

        RoundedCornerShape(dimensionResource(id = R.dimen.ongoing_activity_chip_corner_radius))



    // Use a Box with `fillMaxHeight` to create a larger click surface for the chip. The visible

    // height of the chip is determined by the height of the background of the Row below.

    Box(
@@ -121,12 +129,7 @@ private fun ChipBody( 
            horizontalArrangement = Arrangement.Center,

            verticalAlignment = Alignment.CenterVertically,

            modifier =

                Modifier.clip(

                        RoundedCornerShape(

                            dimensionResource(id = R.dimen.ongoing_activity_chip_corner_radius)

                        )

                    )

                    .height(dimensionResource(R.dimen.ongoing_appops_chip_height))

                Modifier.height(dimensionResource(R.dimen.ongoing_appops_chip_height))

                    .thenIf(isClickable) { Modifier.widthIn(min = minWidth) }

                    .layout { measurable, constraints ->

                        val placeable = measurable.measure(constraints)
@@ -136,7 +139,14 @@ private fun ChipBody( 
                            }

                        }

                    }

                    .background(Color(model.colors.background(context).defaultColor))

                    .background(Color(model.colors.background(context).defaultColor), shape = shape)

                    .thenIf(outline != null) {

                        Modifier.border(

                            width = outlineWidth,

                            color = Color(outline!!),

                            shape = shape,

                        )

                    }

                    .padding(

                        horizontal =

                            if (hasEmbeddedIcon) {

packages/SystemUI/src/com/android/systemui/statusbar/chips/ui/model/ColorsModel.kt

+14 −0
Original line number Diff line number Diff line
@@ -30,6 +30,9 @@ sealed interface ColorsModel { 
    /** The color for the text (and icon) on the chip. */

    @ColorInt fun text(context: Context): Int



    /** The color to use for the chip outline, or null if the chip shouldn't have an outline. */

    @ColorInt fun outline(context: Context): Int?



    /** The chip should match the theme's primary accent color. */

    // TODO(b/347717946): The chip's color isn't getting updated when the user switches theme, it

    // only gets updated when a different configuration change happens, like a rotation.
@@ -39,6 +42,8 @@ sealed interface ColorsModel { 


        override fun text(context: Context) =

            Utils.getColorAttrDefaultColor(context, com.android.internal.R.attr.colorPrimary)



        override fun outline(context: Context) = null

    }



    /** The chip should match the system theme main color. */
@@ -52,6 +57,11 @@ sealed interface ColorsModel { 


        override fun text(context: Context) =

            context.getColor(com.android.internal.R.color.materialColorOnSurface)



        override fun outline(context: Context) =

            // Outline is required on the SystemThemed chip to guarantee the chip doesn't completely

            // blend in with the background.

            context.getColor(com.android.internal.R.color.materialColorOutlineVariant)

    }



    /** The chip should have the given background color and primary text color. */
@@ -60,6 +70,8 @@ sealed interface ColorsModel { 
            ColorStateList.valueOf(backgroundColorInt)



        override fun text(context: Context): Int = primaryTextColorInt



        override fun outline(context: Context) = null

    }



    /** The chip should have a red background with white text. */
@@ -69,5 +81,7 @@ sealed interface ColorsModel { 
        }



        override fun text(context: Context) = context.getColor(android.R.color.white)



        override fun outline(context: Context) = null

    }

}