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

Commit c81e5cd7 authored by harinirajan's avatar harinirajan
Browse files

[UX fixes] Text alignment: https://hsv.googleplex.com/5891097690636288 

No useless manage sign-ins title: https://hsv.googleplex.com/6199286827057152
Button color fix: https://hsv.googleplex.com/6672594588663808

Convert margins from dp to percentage and increase max lines to 2:
Screens with Percentages Margins + other Teamfood UI bug fixes :
Sign in options page: https://hsv.googleplex.com/4613594028179456, https://hsv.googleplex.com/5418564180770816
Choose a sign in: https://hsv.googleplex.com/4982413338869760
Single passkey screen: https://hsv.googleplex.com/5974787426877440

After maxLines set to 2 and alignment in chips fixed: https://hsv.googleplex.com/5014505334505472

Flag: EXEMPT bugfix
Bug: 355236535, 355246297, 356047923, 337068075, 356048574
Test: Manual observation
Change-Id: I6bafdd679a9fe9a73019280b5af14c92d9ec740b
parent 4a12a946

packages/CredentialManager/wear/src/com/android/credentialmanager/ui/WearApp.kt

+0 −1
Original line number Diff line number Diff line
@@ -104,7 +104,6 @@ fun WearApp( 
        scrollable(Screen.MultipleCredentialsScreenFlatten.route) {

            MultiCredentialsFlattenScreen(

                credentialSelectorUiState = (remember { uiState } as MultipleEntry),

                columnState = it.columnState,

                flowEngine = flowEngine,

            )

        }

packages/CredentialManager/wear/src/com/android/credentialmanager/ui/components/CredentialsScreenChip.kt

+12 −3
Original line number Diff line number Diff line
@@ -19,10 +19,11 @@ import androidx.wear.compose.material.MaterialTheme as WearMaterialTheme 
import androidx.compose.foundation.layout.Row

import androidx.compose.material3.Icon

import android.graphics.drawable.Drawable

import androidx.compose.foundation.layout.fillMaxWidth

import androidx.compose.foundation.layout.Arrangement

import androidx.compose.foundation.layout.BoxScope

import androidx.compose.foundation.layout.RowScope

import androidx.compose.foundation.layout.size

import androidx.compose.foundation.layout.fillMaxWidth

import androidx.compose.material.icons.Icons

import androidx.compose.material.icons.outlined.Lock

import androidx.compose.material.icons.outlined.LockOpen
@@ -62,7 +63,7 @@ fun CredentialsScreenChip( 
                        WearButtonText(

                            text = label,

                            textAlign = textAlign,

                            maxLines = if (secondaryLabel != null) 1 else 2

                            maxLines = 2

                        )

                    },

                    secondaryLabel,
@@ -88,8 +89,14 @@ fun CredentialsScreenChip( 
    ) {

    val labelParam: (@Composable RowScope.() -> Unit) =

        {

            var horizontalArrangement = Arrangement.Start

            if (icon == null) {

                horizontalArrangement = Arrangement.Center

            }

            Row(horizontalArrangement = horizontalArrangement, modifier = modifier.fillMaxWidth()) {

                text()

            }

        }



    val secondaryLabelParam: (@Composable RowScope.() -> Unit)? =

        secondaryLabel?.let {
@@ -97,6 +104,7 @@ fun CredentialsScreenChip( 
                Row {

                    WearSecondaryLabel(

                        text = secondaryLabel,

                        color = WearMaterialTheme.colors.onSurfaceVariant

                    )



                    if (isAuthenticationEntryLocked != null) {
@@ -178,6 +186,7 @@ fun ContinueChip(onClick: () -> Unit) { 
            WearButtonText(

                text = stringResource(R.string.dialog_continue_button),

                textAlign = TextAlign.Center,

                color = WearMaterialTheme.colors.surface,

            )

        },

        colors = ChipDefaults.primaryChipColors(),

packages/CredentialManager/wear/src/com/android/credentialmanager/ui/components/SignInHeader.kt

+25 −19
Original line number Diff line number Diff line
@@ -16,9 +16,11 @@ 


package com.android.credentialmanager.ui.components



import androidx.compose.foundation.layout.Row

import androidx.compose.foundation.layout.Spacer

import android.graphics.drawable.Drawable

import androidx.compose.foundation.layout.Column

import androidx.compose.foundation.layout.Spacer

import androidx.compose.foundation.layout.fillMaxSize

import androidx.compose.foundation.layout.size

import androidx.compose.material3.Icon

import androidx.compose.runtime.Composable
@@ -36,8 +38,11 @@ fun SignInHeader( 
    icon: Drawable?,

    title: String,

) {



    Row {

        Spacer(Modifier.weight(0.073f)) // 7.3% side margin

        Column(

        modifier = Modifier,

            modifier = Modifier.weight(0.854f).fillMaxSize(),

            horizontalAlignment = Alignment.CenterHorizontally

        ) {

            if (icon != null) {
@@ -47,7 +52,6 @@ fun SignInHeader( 
                    // Decorative purpose only.

                    contentDescription = null,

                    tint = Color.Unspecified,



                    )

            }

            Spacer(modifier = Modifier.size(8.dp))
@@ -58,4 +62,6 @@ fun SignInHeader( 


            Spacer(modifier = Modifier.size(8.dp))

        }

        Spacer(Modifier.weight(0.073f)) // 7.3% side margin

    }

}

packages/CredentialManager/wear/src/com/android/credentialmanager/ui/components/Texts.kt

+7 −5
Original line number Diff line number Diff line
@@ -16,6 +16,7 @@ 


package com.android.credentialmanager.common.ui.components



import androidx.compose.foundation.layout.fillMaxSize

import androidx.compose.foundation.layout.padding

import androidx.compose.foundation.layout.wrapContentSize

import androidx.compose.material3.Text
@@ -43,7 +44,7 @@ fun WearDisplayNameText(text: String, modifier: Modifier = Modifier) { 
    Text(

        modifier = modifier.wrapContentSize(),

        text = text,

        color = WearMaterialTheme.colors.onSurfaceVariant,

        color = WearMaterialTheme.colors.onSurface,

        textAlign = TextAlign.Center,

        overflow = TextOverflow.Ellipsis,

        maxLines = 2,
@@ -60,7 +61,7 @@ fun WearUsernameText( 
    Text(

        modifier = modifier.padding(start = 8.dp, end = 8.dp).wrapContentSize(),

        text = text,

        color = WearMaterialTheme.colors.onSurfaceVariant,

        color = WearMaterialTheme.colors.onSurface,

        style = WearMaterialTheme.typography.caption1,

        overflow = TextOverflow.Ellipsis,

        textAlign = textAlign,
@@ -91,12 +92,13 @@ fun WearButtonText( 
@Composable

fun WearSecondaryLabel(

    text: String,

    modifier: Modifier = Modifier,

    color: Color = WearMaterialTheme.colors.onSurface,

    modifier: Modifier = Modifier

) {

    Text(

        modifier = modifier.wrapContentSize(),

        modifier = modifier.fillMaxSize(),

        text = text,

        color = WearMaterialTheme.colors.onSurfaceVariant,

        color = color,

        style = WearMaterialTheme.typography.caption1,

        overflow = TextOverflow.Ellipsis,

        textAlign = TextAlign.Start,

packages/CredentialManager/wear/src/com/android/credentialmanager/ui/screens/multiple/MultiCredentialsFlattenScreen.kt

+60 −25
Original line number Diff line number Diff line
@@ -15,14 +15,18 @@ 
 */

package com.android.credentialmanager.ui.screens.multiple



import com.android.credentialmanager.ui.components.CredentialsScreenChip

import androidx.compose.foundation.layout.Row

import androidx.compose.foundation.layout.Spacer

import androidx.compose.foundation.layout.fillMaxSize

import com.android.credentialmanager.ui.components.CredentialsScreenChip

import androidx.compose.foundation.layout.fillMaxWidth

import androidx.compose.foundation.layout.padding

import androidx.compose.runtime.Composable

import androidx.compose.ui.Modifier

import androidx.compose.ui.res.stringResource

import androidx.compose.ui.text.style.TextAlign

import androidx.compose.ui.unit.dp

import androidx.compose.ui.Alignment

import com.android.credentialmanager.CredentialSelectorUiState.Get.MultipleEntry

import com.android.credentialmanager.FlowEngine

import com.android.credentialmanager.R
@@ -32,13 +36,13 @@ import com.android.credentialmanager.model.get.CredentialEntryInfo 
import com.android.credentialmanager.ui.components.CredentialsScreenChipSpacer

import com.google.android.horologist.annotations.ExperimentalHorologistApi

import com.google.android.horologist.compose.layout.ScalingLazyColumn

import com.google.android.horologist.compose.layout.ScalingLazyColumnState

import com.google.android.horologist.compose.layout.rememberColumnState

import com.google.android.horologist.compose.layout.ScalingLazyColumnDefaults



/**

 * Screen that shows multiple credentials to select from, grouped by accounts

 *

 * @param credentialSelectorUiState The app bar view model.

 * @param columnState ScalingLazyColumn configuration to be be applied

 * @param modifier styling for composable

 * @param flowEngine [FlowEngine] that updates ui state for this screen

 */
@@ -46,28 +50,45 @@ import com.google.android.horologist.compose.layout.ScalingLazyColumnState 
@Composable

fun MultiCredentialsFlattenScreen(

    credentialSelectorUiState: MultipleEntry,

    columnState: ScalingLazyColumnState,

    flowEngine: FlowEngine,

) {

    val selectEntry = flowEngine.getEntrySelector()

    Row {

        Spacer(Modifier.weight(0.052f)) // 5.2% side margin

        ScalingLazyColumn(

        columnState = columnState,

        modifier = Modifier.fillMaxSize(),

            columnState = rememberColumnState(

                ScalingLazyColumnDefaults.belowTimeText(horizontalAlignment = Alignment.Start),

            ),

            modifier = Modifier.weight(0.896f).fillMaxSize(), // 5.2% side margin

        ) {



        item {

            // make this credential specific if all credentials are same

            Row {

                Spacer(Modifier.weight(0.073f)) // 7.3% side margin

                WearButtonText(

                    text = stringResource(R.string.sign_in_options_title),

                textAlign = TextAlign.Start,

                    textAlign = TextAlign.Center,

                    modifier = Modifier.weight(0.854f).fillMaxSize(),

                )

                Spacer(Modifier.weight(0.073f)) // 7.3% side margin

            }

        }



        credentialSelectorUiState.accounts.forEach { userNameEntries ->

            item {

                Row {

                    Spacer(Modifier.weight(0.0624f)) // 6.24% side margin

                    WearSecondaryLabel(

                        text = userNameEntries.userName,

                    modifier = Modifier.padding(top = 12.dp, bottom = 4.dp)

                        modifier = Modifier.padding(

                            top = 12.dp,

                            bottom = 4.dp,

                            start = 0.dp,

                            end = 0.dp

                        ).fillMaxWidth(0.87f)

                    )

                    Spacer(Modifier.weight(0.0624f)) // 6.24% side margin

                }

            }



            userNameEntries.sortedCredentialEntryList.forEach { credential: CredentialEntryInfo ->
@@ -87,11 +108,22 @@ fun MultiCredentialsFlattenScreen( 
                }

            }

        }



        if (credentialSelectorUiState.actionEntryList.isNotEmpty()) {

            item {

                Row {

                    Spacer(Modifier.weight(0.0624f)) // 6.24% side margin

                    WearSecondaryLabel(

                        text = stringResource(R.string.provider_list_title),

                modifier = Modifier.padding(top = 12.dp, bottom = 4.dp)

                        modifier = Modifier.padding(

                            top = 12.dp,

                            bottom = 4.dp,

                            start = 0.dp,

                            end = 0.dp

                        ).fillMaxWidth(0.87f)

                )

                    Spacer(Modifier.weight(0.0624f)) // 6.24% side margin

                }

            }

            credentialSelectorUiState.actionEntryList.forEach { actionEntry ->

                item {
@@ -106,3 +138,6 @@ fun MultiCredentialsFlattenScreen( 
            }

        }

    }

    Spacer(Modifier.weight(0.052f)) // 5.2% side margin

    }

}