1 /*
2  * Copyright (C) 2023 The Android Open Source Project
3  *
4  * Licensed under the Apache License, Version 2.0 (the "License");
5  * you may not use this file except in compliance with the License.
6  * You may obtain a copy of the License at
7  *
8  *      http://www.apache.org/licenses/LICENSE-2.0
9  *
10  * Unless required by applicable law or agreed to in writing, software
11  * distributed under the License is distributed on an "AS IS" BASIS,
12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13  * See the License for the specific language governing permissions and
14  * limitations under the License.
15  */
16 
17 package com.android.settingslib.spa.widget.ui
18 
19 import androidx.compose.foundation.background
20 import androidx.compose.foundation.layout.Box
21 import androidx.compose.foundation.layout.PaddingValues
22 import androidx.compose.foundation.layout.padding
23 import androidx.compose.foundation.selection.selectableGroup
24 import androidx.compose.material.icons.Icons
25 import androidx.compose.material.icons.outlined.ExpandLess
26 import androidx.compose.material.icons.outlined.ExpandMore
27 import androidx.compose.material3.Button
28 import androidx.compose.material3.ButtonDefaults
29 import androidx.compose.material3.DropdownMenu
30 import androidx.compose.material3.DropdownMenuItem
31 import androidx.compose.material3.Icon
32 import androidx.compose.material3.MaterialTheme
33 import androidx.compose.material3.Text
34 import androidx.compose.runtime.Composable
35 import androidx.compose.runtime.getValue
36 import androidx.compose.runtime.mutableIntStateOf
37 import androidx.compose.runtime.mutableStateOf
38 import androidx.compose.runtime.saveable.rememberSaveable
39 import androidx.compose.runtime.setValue
40 import androidx.compose.ui.Modifier
41 import androidx.compose.ui.graphics.Color
42 import androidx.compose.ui.tooling.preview.Preview
43 import androidx.compose.ui.semantics.Role
44 import androidx.compose.ui.semantics.role
45 import androidx.compose.ui.semantics.semantics
46 import androidx.compose.ui.unit.dp
47 import com.android.settingslib.spa.framework.theme.SettingsDimension
48 import com.android.settingslib.spa.framework.theme.SettingsTheme
49 
50 data class SpinnerOption(
51     val id: Int,
52     val text: String,
53 )
54 
55 @Composable
Spinnernull56 fun Spinner(options: List<SpinnerOption>, selectedId: Int?, setId: (id: Int) -> Unit) {
57     if (options.isEmpty()) {
58         return
59     }
60 
61     var expanded by rememberSaveable { mutableStateOf(false) }
62 
63     Box(
64         modifier = Modifier
65             .padding(
66                 start = SettingsDimension.itemPaddingStart,
67                 top = SettingsDimension.itemPaddingAround,
68                 end = SettingsDimension.itemPaddingEnd,
69                 bottom = SettingsDimension.itemPaddingAround,
70             )
71             .selectableGroup(),
72     ) {
73         val contentPadding = PaddingValues(horizontal = SettingsDimension.itemPaddingEnd)
74         Button(
75             modifier = Modifier.semantics { role = Role.DropdownList },
76             onClick = { expanded = true },
77             colors = ButtonDefaults.buttonColors(
78                 containerColor = MaterialTheme.colorScheme.primaryContainer,
79                 contentColor = MaterialTheme.colorScheme.onPrimaryContainer,
80             ),
81             contentPadding = contentPadding,
82         ) {
83             SpinnerText(options.find { it.id == selectedId })
84             ExpandIcon(expanded)
85         }
86         DropdownMenu(
87             expanded = expanded,
88             onDismissRequest = { expanded = false },
89             modifier = Modifier.background(MaterialTheme.colorScheme.secondaryContainer),
90         ) {
91             for (option in options) {
92                 DropdownMenuItem(
93                     text = {
94                         SpinnerText(
95                             option = option,
96                             modifier = Modifier.padding(end = 24.dp),
97                             color = MaterialTheme.colorScheme.onSecondaryContainer,
98                         )
99                     },
100                     onClick = {
101                         expanded = false
102                         setId(option.id)
103                     },
104                     contentPadding = contentPadding,
105                 )
106             }
107         }
108     }
109 }
110 
111 @Composable
ExpandIconnull112 internal fun ExpandIcon(expanded: Boolean) {
113     Icon(
114         imageVector = when {
115             expanded -> Icons.Outlined.ExpandLess
116             else -> Icons.Outlined.ExpandMore
117         },
118         contentDescription = null,
119     )
120 }
121 
122 @Composable
SpinnerTextnull123 private fun SpinnerText(
124     option: SpinnerOption?,
125     modifier: Modifier = Modifier,
126     color: Color = Color.Unspecified,
127 ) {
128     Text(
129         text = option?.text ?: "",
130         modifier = modifier
131             .padding(end = SettingsDimension.itemPaddingEnd)
132             .padding(vertical = SettingsDimension.itemPaddingAround),
133         color = color,
134         style = MaterialTheme.typography.labelLarge,
135     )
136 }
137 
138 @Preview(showBackground = true)
139 @Composable
SpinnerPreviewnull140 private fun SpinnerPreview() {
141     SettingsTheme {
142         var selectedId by rememberSaveable { mutableIntStateOf(1) }
143         Spinner(
144             options = (1..3).map { SpinnerOption(id = it, text = "Option $it") },
145             selectedId = selectedId,
146             setId = { selectedId = it },
147         )
148     }
149 }
150