Compose Layout: Column, Row, Box

import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

@Composable
fun ProductRow(name: String, price: String, onAdd: () -> Unit) {
    Row(
        modifier = Modifier
            .fillMaxWidth()
            .padding(16.dp),
        verticalAlignment   = Alignment.CenterVertically,
        horizontalArrangement = Arrangement.spacedBy(12.dp),
    ) {
        Column(modifier = Modifier.weight(1f)) {              // takes leftover space
            Text(name, style = MaterialTheme.typography.titleMedium)
            Text(price, style = MaterialTheme.typography.bodySmall)
        }
        Button(onClick = onAdd) { Text("Add") }
    }
}

@Composable
fun ImageWithBadge() {
    Box {
        Card(modifier = Modifier.size(120.dp)) { /* image */ }
        // Overlay a badge in the corner
        Surface(
            color = MaterialTheme.colorScheme.error,
            modifier = Modifier
                .align(Alignment.TopEnd)
                .padding(4.dp)
        ) {
            Text("NEW", modifier = Modifier.padding(horizontal = 6.dp))
        }
    }
}