/* * 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.annotation.StringRes import androidx.compose.foundation.Image import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxHeight import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.width import androidx.compose.foundation.layout.widthIn import androidx.compose.material3.Button import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.res.dimensionResource import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import com.example.cupcake.R import com.example.cupcake.data.DataSource /** * Composable that allows the user to select the desired cupcake quantity and expects * [onNextButtonClicked] lambda that expects the selected quantity and triggers the navigation to * next screen */ @Composable fun StartOrderScreen( quantityOptions: List>, onNextButtonClicked: (Int) -> Unit, modifier: Modifier = Modifier ){ Column( modifier = modifier, verticalArrangement = Arrangement.SpaceBetween ) { Column( modifier = Modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.padding_small)) ) { Spacer(modifier = Modifier.height(dimensionResource(R.dimen.padding_medium))) Image( painter = painterResource(R.drawable.cupcake), contentDescription = null, modifier = Modifier.width(300.dp) ) Spacer(modifier = Modifier.height(dimensionResource(R.dimen.padding_medium))) Text( text = stringResource(R.string.order_cupcakes), style = MaterialTheme.typography.headlineSmall ) Spacer(modifier = Modifier.height(dimensionResource(R.dimen.padding_small))) } Row(modifier = Modifier.weight(1f, false)) { Column( modifier = Modifier.fillMaxWidth(), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.spacedBy( dimensionResource(id = R.dimen.padding_medium) ) ) { quantityOptions.forEach { item -> SelectQuantityButton( labelResourceId = item.first, onClick = { onNextButtonClicked(item.second) } ) } } } } } /** * Customizable button composable that displays the [labelResourceId] * and triggers [onClick] lambda when this composable is clicked */ @Composable fun SelectQuantityButton( @StringRes labelResourceId: Int, onClick: () -> Unit, modifier: Modifier = Modifier ){ Button( onClick = onClick, modifier = modifier.widthIn(min = 250.dp) ) { Text(stringResource(labelResourceId)) } } @Preview @Composable fun StartOrderPreview(){ StartOrderScreen( quantityOptions = DataSource.quantityOptions, onNextButtonClicked = {}, modifier = Modifier.fillMaxSize().padding(dimensionResource(R.dimen.padding_medium)) ) }