133 lines
		
	
	
		
			4.9 KiB
		
	
	
	
		
			Kotlin
		
	
	
	
	
	
			
		
		
	
	
			133 lines
		
	
	
		
			4.9 KiB
		
	
	
	
		
			Kotlin
		
	
	
	
	
	
/*
 | 
						|
 * Copyright (C) 2023 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
 | 
						|
 *
 | 
						|
 *      https://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.example.cupcake.ui
 | 
						|
 | 
						|
import androidx.compose.foundation.layout.Arrangement
 | 
						|
import androidx.compose.foundation.layout.Column
 | 
						|
import androidx.compose.foundation.layout.Row
 | 
						|
import androidx.compose.foundation.layout.fillMaxHeight
 | 
						|
import androidx.compose.foundation.layout.fillMaxWidth
 | 
						|
import androidx.compose.foundation.layout.padding
 | 
						|
import androidx.compose.foundation.selection.selectable
 | 
						|
import androidx.compose.material3.Button
 | 
						|
import androidx.compose.material3.Divider
 | 
						|
import androidx.compose.material3.OutlinedButton
 | 
						|
import androidx.compose.material3.RadioButton
 | 
						|
import androidx.compose.material3.Text
 | 
						|
import androidx.compose.runtime.Composable
 | 
						|
import androidx.compose.runtime.getValue
 | 
						|
import androidx.compose.runtime.mutableStateOf
 | 
						|
import androidx.compose.runtime.saveable.rememberSaveable
 | 
						|
import androidx.compose.runtime.setValue
 | 
						|
import androidx.compose.ui.Alignment
 | 
						|
import androidx.compose.ui.Modifier
 | 
						|
import androidx.compose.ui.res.dimensionResource
 | 
						|
import androidx.compose.ui.res.stringResource
 | 
						|
import androidx.compose.ui.tooling.preview.Preview
 | 
						|
import com.example.cupcake.R
 | 
						|
import com.example.cupcake.ui.components.FormattedPriceLabel
 | 
						|
 | 
						|
/**
 | 
						|
 * Composable that displays the list of items as [RadioButton] options,
 | 
						|
 * [onSelectionChanged] lambda that notifies the parent composable when a new value is selected,
 | 
						|
 * [onCancelButtonClicked] lambda that cancels the order when user clicks cancel and
 | 
						|
 * [onNextButtonClicked] lambda that triggers the navigation to next screen
 | 
						|
 */
 | 
						|
@Composable
 | 
						|
fun SelectOptionScreen(
 | 
						|
    subtotal: String,
 | 
						|
    options: List<String>,
 | 
						|
    onSelectionChanged: (String) -> Unit = {},
 | 
						|
    onCancelButtonClicked: () -> Unit = {},
 | 
						|
    onNextButtonClicked: () -> Unit = {},
 | 
						|
    modifier: Modifier = Modifier
 | 
						|
){
 | 
						|
    var selectedValue by rememberSaveable { mutableStateOf("") }
 | 
						|
 | 
						|
    Column(
 | 
						|
        modifier = modifier,
 | 
						|
        verticalArrangement = Arrangement.SpaceBetween
 | 
						|
    ) {
 | 
						|
        Column(modifier = Modifier.padding(dimensionResource(R.dimen.padding_medium))){
 | 
						|
            options.forEach { item ->
 | 
						|
                Row(
 | 
						|
                    modifier = Modifier.selectable(
 | 
						|
                        selected = selectedValue == item,
 | 
						|
                        onClick = {
 | 
						|
                            selectedValue = item
 | 
						|
                            onSelectionChanged(item)
 | 
						|
                        }
 | 
						|
                    ),
 | 
						|
                    verticalAlignment = Alignment.CenterVertically
 | 
						|
                ){
 | 
						|
                    RadioButton(
 | 
						|
                        selected = selectedValue == item,
 | 
						|
                        onClick = {
 | 
						|
                            selectedValue = item
 | 
						|
                            onSelectionChanged(item)
 | 
						|
                        }
 | 
						|
                    )
 | 
						|
                    Text(item)
 | 
						|
                }
 | 
						|
            }
 | 
						|
            Divider(
 | 
						|
                thickness = dimensionResource(R.dimen.thickness_divider),
 | 
						|
                modifier = Modifier.padding(bottom = dimensionResource(R.dimen.padding_medium))
 | 
						|
            )
 | 
						|
            FormattedPriceLabel(
 | 
						|
                subtotal = subtotal,
 | 
						|
                modifier = Modifier
 | 
						|
                    .align(Alignment.End)
 | 
						|
                    .padding(
 | 
						|
                        top = dimensionResource(R.dimen.padding_medium),
 | 
						|
                        bottom = dimensionResource(R.dimen.padding_medium)
 | 
						|
                    )
 | 
						|
            )
 | 
						|
        }
 | 
						|
        Row(
 | 
						|
            modifier = Modifier
 | 
						|
                .fillMaxWidth()
 | 
						|
                .padding(dimensionResource(R.dimen.padding_medium))
 | 
						|
                .weight(1f, false),
 | 
						|
            horizontalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.padding_medium)),
 | 
						|
            verticalAlignment = Alignment.Bottom
 | 
						|
        ){
 | 
						|
            OutlinedButton(modifier = Modifier.weight(1f), onClick = onCancelButtonClicked) {
 | 
						|
                Text(stringResource(R.string.cancel))
 | 
						|
            }
 | 
						|
            Button(
 | 
						|
                modifier = Modifier.weight(1f),
 | 
						|
                // the button is enabled when the user makes a selection
 | 
						|
                enabled = selectedValue.isNotEmpty(),
 | 
						|
                onClick = onNextButtonClicked
 | 
						|
            ) {
 | 
						|
                Text(stringResource(R.string.next))
 | 
						|
            }
 | 
						|
        }
 | 
						|
    }
 | 
						|
 | 
						|
}
 | 
						|
 | 
						|
@Preview
 | 
						|
@Composable
 | 
						|
fun SelectOptionPreview(){
 | 
						|
    SelectOptionScreen(
 | 
						|
        subtotal = "299.99",
 | 
						|
        options = listOf("Option 1", "Option 2", "Option 3", "Option 4"),
 | 
						|
        modifier = Modifier.fillMaxHeight()
 | 
						|
    )
 | 
						|
}
 |