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

Commit 0c434e59 authored by Anton Potapov's avatar Anton Potapov
Browse files

Implement a Spinner for selecting capture target in the Screen Recording toolbar 

Flag: com.android.systemui.new_screen_record_toolbar
Test: manual in a test app
Bug: 428171948
Change-Id: I439919d1f5031f49e3476d81290465c80b89a3c0
parent 5c435f87

packages/SystemUI/res/drawable/ic_check_expressive.xml

0 → 100644
+29 −0
Original line number Diff line number Diff line 
<!--

  ~ Copyright (C) 2025 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.

  -->



<vector xmlns:android="http://schemas.android.com/apk/res/android"

    android:width="24dp"

    android:height="24dp"

    android:viewportWidth="24"

    android:viewportHeight="24">

  <group>

    <clip-path

        android:pathData="M0,0h24v24h-24z"/>

    <path

        android:pathData="M9.55,15.15L18.025,6.675C18.225,6.475 18.458,6.375 18.725,6.375C18.992,6.375 19.225,6.475 19.425,6.675C19.625,6.875 19.725,7.117 19.725,7.4C19.725,7.667 19.625,7.9 19.425,8.1L10.25,17.3C10.05,17.5 9.817,17.6 9.55,17.6C9.283,17.6 9.05,17.5 8.85,17.3L4.55,13C4.35,12.8 4.25,12.567 4.25,12.3C4.267,12.017 4.375,11.775 4.575,11.575C4.775,11.375 5.008,11.275 5.275,11.275C5.558,11.275 5.8,11.375 6,11.575L9.55,15.15Z"

        android:fillColor="#000000"/>

  </group>

</vector>

packages/SystemUI/res/drawable/ic_expressive_spinner_arrow.xml

0 → 100644
+29 −0
Original line number Diff line number Diff line 
<!--

  ~ Copyright (C) 2025 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.

  -->



<vector xmlns:android="http://schemas.android.com/apk/res/android"

    android:width="24dp"

    android:height="24dp"

    android:viewportWidth="24"

    android:viewportHeight="24">

  <group>

    <clip-path

        android:pathData="M0,0h24v24h-24z"/>

    <path

        android:pathData="M12,14.975C11.867,14.975 11.742,14.958 11.625,14.925C11.508,14.875 11.4,14.8 11.3,14.7L6.7,10.1C6.517,9.917 6.425,9.683 6.425,9.4C6.425,9.117 6.517,8.883 6.7,8.7C6.883,8.517 7.117,8.425 7.4,8.425C7.683,8.425 7.917,8.517 8.1,8.7L12,12.6L15.9,8.7C16.083,8.517 16.317,8.425 16.6,8.425C16.883,8.425 17.117,8.517 17.3,8.7C17.483,8.883 17.575,9.117 17.575,9.4C17.575,9.683 17.483,9.917 17.3,10.1L12.7,14.7C12.6,14.8 12.492,14.875 12.375,14.925C12.258,14.958 12.133,14.975 12,14.975Z"

        android:fillColor="#000000"/>

  </group>

</vector>

packages/SystemUI/src/com/android/systemui/screencapture/record/shared/ui/viewmodel/SingleSelectViewModel.kt

0 → 100644
+24 −0
Original line number Diff line number Diff line 
/*

 * Copyright (C) 2025 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.screencapture.record.shared.ui.viewmodel



/** Models a generic ViewModel that supports selecting a single item from a list. */

data class SingleSelectViewModel<T>(

    val items: List<T>,

    val selectedItemIndex: Int,

    val onItemSelect: (Int) -> Unit,

)

packages/SystemUI/src/com/android/systemui/screencapture/record/smallscreen/ui/compose/CaptureTargetSpinner.kt

0 → 100644
+158 −0
Original line number Diff line number Diff line 
/*

 * Copyright (C) 2025 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.screencapture.record.smallscreen.ui.compose



import androidx.annotation.DrawableRes

import androidx.compose.animation.AnimatedContent

import androidx.compose.animation.AnimatedVisibility

import androidx.compose.animation.animateContentSize

import androidx.compose.animation.fadeIn

import androidx.compose.animation.fadeOut

import androidx.compose.animation.togetherWith

import androidx.compose.foundation.BorderStroke

import androidx.compose.foundation.layout.Box

import androidx.compose.foundation.layout.Column

import androidx.compose.foundation.layout.IntrinsicSize

import androidx.compose.foundation.layout.PaddingValues

import androidx.compose.foundation.layout.fillMaxSize

import androidx.compose.foundation.layout.fillMaxWidth

import androidx.compose.foundation.layout.height

import androidx.compose.foundation.layout.size

import androidx.compose.foundation.layout.width

import androidx.compose.foundation.shape.RoundedCornerShape

import androidx.compose.material3.ButtonDefaults

import androidx.compose.material3.Icon

import androidx.compose.material3.MaterialTheme

import androidx.compose.material3.Surface

import androidx.compose.material3.Text

import androidx.compose.material3.TextButton

import androidx.compose.runtime.Composable

import androidx.compose.runtime.getValue

import androidx.compose.runtime.mutableStateOf

import androidx.compose.runtime.remember

import androidx.compose.runtime.setValue

import androidx.compose.ui.Modifier

import androidx.compose.ui.draw.clip

import androidx.compose.ui.graphics.Color

import androidx.compose.ui.res.painterResource

import androidx.compose.ui.unit.Dp

import androidx.compose.ui.unit.dp

import androidx.compose.ui.util.fastForEachIndexed

import com.android.systemui.res.R

import com.android.systemui.screencapture.record.shared.ui.viewmodel.SingleSelectViewModel

import com.android.systemui.screencapture.record.smallscreen.ui.viewmodel.CaptureTargetSpinnerItemViewModel



@Composable

fun CaptureTargetSpinner(

    viewModel: SingleSelectViewModel<CaptureTargetSpinnerItemViewModel>,

    modifier: Modifier = Modifier,

) {

    val itemHeight: Dp = 56.dp

    val cornerRadius: Dp = itemHeight / 2

    var expanded by remember { mutableStateOf(false) }

    Box(

        modifier = modifier.animateContentSize().height(IntrinsicSize.Min).width(IntrinsicSize.Min)

    ) {

        AnimatedContent(

            targetState = expanded,

            transitionSpec = { fadeIn() togetherWith fadeOut() },

        ) { currentExpanded ->

            if (currentExpanded) {

                Surface(

                    content = {},

                    shape = RoundedCornerShape(cornerRadius),

                    color = MaterialTheme.colorScheme.surfaceBright,

                    modifier = Modifier.fillMaxSize(),

                )

            } else {

                Surface(

                    content = {},

                    color = Color.Transparent,

                    shape = RoundedCornerShape(cornerRadius),

                    border = BorderStroke(1.dp, MaterialTheme.colorScheme.outline),

                    modifier = Modifier.fillMaxWidth().height(itemHeight),

                )

            }

        }

        Column(modifier = Modifier.clip(RoundedCornerShape(cornerRadius))) {

            viewModel.items.fastForEachIndexed { index, itemViewModel ->

                val isCurrentOption = index == viewModel.selectedItemIndex

                AnimatedVisibility(visible = expanded || isCurrentOption) {

                    ToolbarItem(

                        label = itemViewModel.label,

                        icon =

                            if (expanded) {

                                if (isCurrentOption) {

                                    R.drawable.ic_check_expressive

                                } else {

                                    null

                                }

                            } else {

                                R.drawable.ic_expressive_spinner_arrow

                            },

                        onClick = {

                            if (expanded) {

                                expanded = false

                                viewModel.onItemSelect(index)

                            } else {

                                expanded = true

                            }

                        },

                        active = !expanded && isCurrentOption,

                        modifier = Modifier.fillMaxWidth().height(itemHeight),

                    )

                }

            }

        }

    }

}



@Composable

private fun ToolbarItem(

    label: String,

    onClick: () -> Unit,

    active: Boolean,

    modifier: Modifier = Modifier,

    @DrawableRes icon: Int? = null,

) {

    TextButton(

        onClick = onClick,

        modifier = modifier,

        colors =

            if (active) {

                ButtonDefaults.textButtonColors(

                    containerColor = MaterialTheme.colorScheme.secondaryContainer,

                    contentColor = MaterialTheme.colorScheme.onSecondaryContainer,

                )

            } else {

                ButtonDefaults.textButtonColors(

                    containerColor = Color.Transparent,

                    contentColor = MaterialTheme.colorScheme.onSurface,

                )

            },

        contentPadding = PaddingValues(horizontal = 16.dp),

    ) {

        Text(text = label, modifier = Modifier.weight(1f))

        icon?.let {

            Icon(

                painter = painterResource(it),

                contentDescription = null,

                modifier = Modifier.size(24.dp),

            )

        }

    }

}

packages/SystemUI/src/com/android/systemui/screencapture/record/smallscreen/ui/viewmodel/CaptureTargetSpinnerItemViewModel.kt

0 → 100644
+22 −0
Original line number Diff line number Diff line 
/*

 * Copyright (C) 2025 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.screencapture.record.smallscreen.ui.viewmodel



import com.android.systemui.screencapture.record.smallscreen.ui.compose.CaptureTargetSpinner



/** Models a single item for the [CaptureTargetSpinner]. */

data class CaptureTargetSpinnerItemViewModel(val label: String)