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

Commit 9da9ecc6 authored by shirleyqian's avatar shirleyqian
Browse files

Edu tooltip polish.

1. Add close button.
2. Add spacing between title and content.
3. Add a corner radius for the arrow in the bottom.

Bug: 429199668
Test: local
Flag: com.android.systemui.enable_underlay
Change-Id: I629de231948cdab9c933e7bf083783707b45d1b3
parent d37a9688
Loading
Loading
Loading
Loading
+1 −0
Original line number Diff line number Diff line
@@ -268,6 +268,7 @@ private fun NavBarAmbientCue(
            }
        },
        onCloseClick = { viewModel.hide() },
        onCloseEducation = { viewModel.disableFirstTimeHint() },
    )
}

+20 −2
Original line number Diff line number Diff line
@@ -20,6 +20,9 @@ import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.widthIn
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
@@ -32,7 +35,11 @@ import com.android.systemui.ambientcue.ui.compose.modifier.eduBalloon
import com.android.systemui.res.R

@Composable
fun FirstTimeEducation(horizontalAlignment: Alignment.Horizontal, modifier: Modifier = Modifier) {
fun FirstTimeEducation(
    horizontalAlignment: Alignment.Horizontal,
    modifier: Modifier = Modifier,
    onCloseClick: () -> Unit,
) {
    val backgroundColor = MaterialTheme.colorScheme.surfaceBright
    Row(
        verticalAlignment = Alignment.Top,
@@ -45,7 +52,10 @@ fun FirstTimeEducation(horizontalAlignment: Alignment.Horizontal, modifier: Modi
                stringResource(R.string.ambientcue_first_time_edu_icon_description),
            modifier = Modifier.size(56.dp),
        )
        Column {
        Column(
            verticalArrangement = Arrangement.spacedBy(8.dp),
            modifier = Modifier.widthIn(max = 204.dp),
        ) {
            Text(
                text = stringResource(R.string.ambientcue_first_time_edu_title),
                style = MaterialTheme.typography.titleMedium,
@@ -57,5 +67,13 @@ fun FirstTimeEducation(horizontalAlignment: Alignment.Horizontal, modifier: Modi
                color = MaterialTheme.colorScheme.onSurfaceVariant,
            )
        }
        IconButton(onClick = onCloseClick, modifier = modifier.size(24.dp)) {
            Icon(
                painter = painterResource(R.drawable.ic_close_white),
                contentDescription =
                    stringResource(id = R.string.underlay_close_button_content_description),
                tint = MaterialTheme.colorScheme.primary,
            )
        }
    }
}
+2 −1
Original line number Diff line number Diff line
@@ -93,6 +93,7 @@ fun NavBarPill(
    showEducation: Boolean = false,
    onClick: () -> Unit = {},
    onCloseClick: () -> Unit = {},
    onCloseEducation: () -> Unit = {},
) {
    val maxPillWidth = 248.dp
    val backgroundColor = if (isSystemInDarkTheme()) Color.Black else Color.White
@@ -187,7 +188,7 @@ fun NavBarPill(
            },
    ) {
        if (visible && !expanded && showEducation) {
            FirstTimeEducation(Alignment.CenterHorizontally)
            FirstTimeEducation(Alignment.CenterHorizontally, onCloseClick = onCloseEducation)
        }
        Row(
            horizontalArrangement = Arrangement.spacedBy(6.dp),
+19 −2
Original line number Diff line number Diff line
@@ -29,6 +29,7 @@ import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Path
import androidx.compose.ui.graphics.drawscope.translate
import androidx.compose.ui.unit.dp
import kotlin.math.sqrt

@Composable
fun Modifier.eduBalloon(
@@ -41,6 +42,7 @@ fun Modifier.eduBalloon(
            val oneDp = with(density) { 1.dp.toPx() }
            val translationX = with(density) { 6.dp.toPx() }
            val translationY = with(density) { 10.dp.toPx() }
            val cornerRadius = with(density) { 2.dp.toPx() }

            val center =
                when (horizontalAlignment) {
@@ -54,7 +56,22 @@ fun Modifier.eduBalloon(
                    path =
                        Path().apply {
                            moveTo(-translationX, 0f)
                            lineTo(0f, translationY)
                            // Calculate the tangent point coordinates.
                            val arrowLegLength =
                                sqrt(translationX * translationX + translationY * translationY)
                            val tangentPointX = translationY * cornerRadius / arrowLegLength
                            val tangentPointY =
                                translationY - translationX * tangentPointX / translationY
                            lineTo(-tangentPointX, tangentPointY)
                            // Draw a curve connecting the two tangent points via a control point,
                            // forming the rounded tip of the arrow.
                            quadraticTo(
                                0f,
                                translationY + cornerRadius -
                                    (arrowLegLength - cornerRadius) / translationX,
                                tangentPointX,
                                tangentPointY,
                            )
                            lineTo(translationX, 0f)
                        },
                    color = backgroundColor,
@@ -62,7 +79,7 @@ fun Modifier.eduBalloon(
            }
        }
        .clip(RoundedCornerShape(28.dp))
        .widthIn(max = 296.dp)
        .widthIn(max = 348.dp)
        .background(backgroundColor)
        .padding(16.dp)
}
+2 −2
Original line number Diff line number Diff line
@@ -27,8 +27,8 @@ import androidx.compose.ui.graphics.toComposeRect
import androidx.core.content.edit
import com.android.app.tracing.coroutines.coroutineScopeTraced
import com.android.systemui.Dumpable
import com.android.systemui.ambientcue.shared.logger.AmbientCueLogger
import com.android.systemui.ambientcue.domain.interactor.AmbientCueInteractor
import com.android.systemui.ambientcue.shared.logger.AmbientCueLogger
import com.android.systemui.dagger.qualifiers.Application
import com.android.systemui.domain.interactor.SharedPreferencesInteractor
import com.android.systemui.dump.DumpManager
@@ -283,7 +283,7 @@ constructor(
        }
    }

    private fun disableFirstTimeHint() {
    fun disableFirstTimeHint() {
        if (showFirstTimeEducation) {
            sharedPreferences.value?.edit {
                Log.i(TAG, "suppressing first time tooltip")