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

Commit a22f44ba authored by Olivier St-Onge's avatar Olivier St-Onge
Browse files

Move from using color resources to composables 

Color resources don't work in Flexiglass for some reason, but instead of trying to fix this I figured it was time to use a more Compose friendly way of getting the colors we need.
Also swaps the edit mode tile state from active to inactive to align with the mocks

Bug: 331598956
Flag: com.android.systemui.qs_ui_refactor
Flag: com.android.systemui.dual_shade
Test: manually opening QS dual shade with two fingers swipe

Change-Id: Ie4d4f00a545e5a7244927efb610b38765621f5fb
parent a67ab230

packages/SystemUI/src/com/android/systemui/qs/panels/ui/compose/PartitionedGridLayout.kt

+1 −1
Original line number Diff line number Diff line
@@ -284,7 +284,7 @@ class PartitionedGridLayout @Inject constructor(private val viewModel: Partition 
        Box(

            Modifier.fillMaxWidth()

                .background(

                    color = MaterialTheme.colorScheme.surfaceVariant,

                    color = MaterialTheme.colorScheme.background,

                    alpha = { 1f },

                    shape = RoundedCornerShape(dimensionResource(R.dimen.qs_corner_radius))

                )

packages/SystemUI/src/com/android/systemui/qs/panels/ui/compose/Tile.kt

+61 −16
Original line number Diff line number Diff line
@@ -17,6 +17,8 @@ 
package com.android.systemui.qs.panels.ui.compose



import android.graphics.drawable.Animatable

import android.service.quicksettings.Tile.STATE_ACTIVE

import android.service.quicksettings.Tile.STATE_INACTIVE

import android.text.TextUtils

import androidx.appcompat.content.res.AppCompatResources

import androidx.compose.animation.graphics.ExperimentalAnimationGraphicsApi
@@ -49,6 +51,7 @@ import androidx.compose.material.icons.Icons 
import androidx.compose.material.icons.filled.Add

import androidx.compose.material.icons.filled.Remove

import androidx.compose.material3.Icon

import androidx.compose.material3.MaterialTheme

import androidx.compose.material3.Text

import androidx.compose.runtime.Composable

import androidx.compose.runtime.LaunchedEffect
@@ -75,14 +78,11 @@ import androidx.compose.ui.unit.Dp 
import androidx.compose.ui.unit.dp

import androidx.lifecycle.compose.collectAsStateWithLifecycle

import com.android.compose.animation.Expandable

import com.android.compose.theme.colorAttr

import com.android.systemui.common.shared.model.Icon

import com.android.systemui.common.ui.compose.Icon

import com.android.systemui.common.ui.compose.load

import com.android.systemui.qs.panels.ui.viewmodel.ActiveTileColorAttributes

import com.android.systemui.qs.panels.ui.viewmodel.AvailableEditActions

import com.android.systemui.qs.panels.ui.viewmodel.EditTileViewModel

import com.android.systemui.qs.panels.ui.viewmodel.TileColorAttributes

import com.android.systemui.qs.panels.ui.viewmodel.TileUiState

import com.android.systemui.qs.panels.ui.viewmodel.TileViewModel

import com.android.systemui.qs.panels.ui.viewmodel.toUiState
@@ -108,10 +108,12 @@ fun Tile( 
        tile.state

            .mapLatest { it.toUiState() }

            .collectAsStateWithLifecycle(tile.currentState.toUiState())

    val colors = TileDefaults.getColorForState(state.state)



    val context = LocalContext.current



    Expandable(

        color = colorAttr(state.colors.background),

        color = colors.background,

        shape = RoundedCornerShape(dimensionResource(R.dimen.qs_corner_radius)),

    ) {

        Row(
@@ -121,7 +123,7 @@ fun Tile( 
                        onClick = { tile.onClick(it) },

                        onLongClick = { tile.onLongClick(it) }

                    )

                    .tileModifier(state.colors),

                    .tileModifier(colors),

            verticalAlignment = Alignment.CenterVertically,

            horizontalArrangement = tileHorizontalArrangement(iconOnly),

        ) {
@@ -139,7 +141,7 @@ fun Tile( 
                label = state.label.toString(),

                secondaryLabel = state.secondaryLabel.toString(),

                icon = icon,

                colors = state.colors,

                colors = colors,

                iconOnly = iconOnly,

                showLabels = showLabels,

            )
@@ -292,7 +294,7 @@ fun EditTile( 
    modifier: Modifier = Modifier,

) {

    val label = tileViewModel.label.load() ?: tileViewModel.tileSpec.spec

    val colors = ActiveTileColorAttributes

    val colors = TileDefaults.inactiveTileColors()



    Row(

        modifier = modifier.tileModifier(colors).semantics { this.contentDescription = label },
@@ -361,10 +363,10 @@ private fun TileIcon( 
}



@Composable

private fun Modifier.tileModifier(colors: TileColorAttributes): Modifier {

private fun Modifier.tileModifier(colors: TileColors): Modifier {

    return fillMaxWidth()

        .clip(RoundedCornerShape(dimensionResource(R.dimen.qs_corner_radius)))

        .background(colorAttr(colors.background))

        .background(colors.background)

        .padding(horizontal = dimensionResource(id = R.dimen.qs_label_container_margin))

}
@@ -387,7 +389,7 @@ private fun TileContent( 
    label: String,

    secondaryLabel: String?,

    icon: Icon,

    colors: TileColorAttributes,

    colors: TileColors,

    iconOnly: Boolean,

    showLabels: Boolean = false,

    animateIconToEnd: Boolean = false,
@@ -397,13 +399,13 @@ private fun TileContent( 
        verticalArrangement = Arrangement.Center,

        modifier = Modifier.fillMaxHeight()

    ) {

        TileIcon(icon, colorAttr(colors.icon), animateIconToEnd)

        TileIcon(icon, colors.icon, animateIconToEnd)



        if (iconOnly && showLabels) {

            Text(

                label,

                maxLines = 2,

                color = colorAttr(colors.label),

                color = colors.label,

                overflow = TextOverflow.Ellipsis,

                textAlign = TextAlign.Center,

            )
@@ -414,13 +416,13 @@ private fun TileContent( 
        Column(verticalArrangement = Arrangement.Center, modifier = Modifier.fillMaxHeight()) {

            Text(

                label,

                color = colorAttr(colors.label),

                color = colors.label,

                modifier = Modifier.basicMarquee(),

            )

            if (!TextUtils.isEmpty(secondaryLabel)) {

                Text(

                    secondaryLabel ?: "",

                    color = colorAttr(colors.secondaryLabel),

                    color = colors.secondaryLabel,

                    modifier = Modifier.basicMarquee(),

                )

            }
@@ -431,12 +433,55 @@ private fun TileContent( 
@Composable

fun tileHeight(iconWithLabel: Boolean = false): Dp {

    return if (iconWithLabel) {

        TileDimensions.IconTileWithLabelHeight

        TileDefaults.IconTileWithLabelHeight

    } else {

        dimensionResource(id = R.dimen.qs_tile_height)

    }

}



private object TileDimensions {

private data class TileColors(

    val background: Color,

    val label: Color,

    val secondaryLabel: Color,

    val icon: Color,

)



private object TileDefaults {

    val IconTileWithLabelHeight = 100.dp



    @Composable

    fun activeTileColors(): TileColors =

        TileColors(

            background = MaterialTheme.colorScheme.primary,

            label = MaterialTheme.colorScheme.onPrimary,

            secondaryLabel = MaterialTheme.colorScheme.onPrimary,

            icon = MaterialTheme.colorScheme.onPrimary,

        )



    @Composable

    fun inactiveTileColors(): TileColors =

        TileColors(

            background = MaterialTheme.colorScheme.surfaceVariant,

            label = MaterialTheme.colorScheme.onSurfaceVariant,

            secondaryLabel = MaterialTheme.colorScheme.onSurfaceVariant,

            icon = MaterialTheme.colorScheme.onSurfaceVariant,

        )



    @Composable

    fun unavailableTileColors(): TileColors =

        TileColors(

            background = MaterialTheme.colorScheme.surface,

            label = MaterialTheme.colorScheme.onSurface,

            secondaryLabel = MaterialTheme.colorScheme.onSurface,

            icon = MaterialTheme.colorScheme.onSurface,

        )



    @Composable

    fun getColorForState(state: Int): TileColors {

        return when (state) {

            STATE_ACTIVE -> activeTileColors()

            STATE_INACTIVE -> inactiveTileColors()

            else -> unavailableTileColors()

        }

    }

}

packages/SystemUI/src/com/android/systemui/qs/panels/ui/viewmodel/TileColorAttributes.kt

deleted100644 → 0
+0 −61
Original line number Diff line number Diff line 
/*

 * Copyright (C) 2024 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.

 */



package com.android.systemui.qs.panels.ui.viewmodel



import android.service.quicksettings.Tile

import androidx.annotation.AttrRes

import com.android.systemui.plugins.qs.QSTile

import com.android.systemui.res.R



data class TileColorAttributes(

    @AttrRes val background: Int = 0,

    @AttrRes val label: Int = 0,

    @AttrRes val secondaryLabel: Int = 0,

    @AttrRes val icon: Int = 0,

)



val ActiveTileColorAttributes =

    TileColorAttributes(

        background = R.attr.shadeActive,

        label = R.attr.onShadeActive,

        secondaryLabel = R.attr.onShadeActiveVariant,

        icon = R.attr.onShadeActive,

    )



val InactiveTileColorAttributes =

    TileColorAttributes(

        background = R.attr.shadeInactive,

        label = R.attr.onShadeInactive,

        secondaryLabel = R.attr.onShadeInactiveVariant,

        icon = R.attr.onShadeInactiveVariant,

    )



val UnavailableTileColorAttributes =

    TileColorAttributes(

        background = R.attr.shadeDisabled,

        label = R.attr.outline,

        secondaryLabel = R.attr.outline,

        icon = R.attr.outline,

    )



fun QSTile.State.colors(): TileColorAttributes =

    when (state) {

        Tile.STATE_UNAVAILABLE -> UnavailableTileColorAttributes

        Tile.STATE_ACTIVE -> ActiveTileColorAttributes

        Tile.STATE_INACTIVE -> InactiveTileColorAttributes

        else -> TileColorAttributes()

    }

packages/SystemUI/src/com/android/systemui/qs/panels/ui/viewmodel/TileUiState.kt

+2 −2
Original line number Diff line number Diff line
@@ -22,7 +22,7 @@ import java.util.function.Supplier 
data class TileUiState(

    val label: CharSequence,

    val secondaryLabel: CharSequence,

    val colors: TileColorAttributes,

    val state: Int,

    val icon: Supplier<QSTile.Icon>,

)
@@ -30,7 +30,7 @@ fun QSTile.State.toUiState(): TileUiState { 
    return TileUiState(

        label ?: "",

        secondaryLabel ?: "",

        colors(),

        state,

        icon?.let { Supplier { icon } } ?: iconSupplier,

    )

}