How to implement multi-item cart functionality in an Android e-commerce app using Kotlin?

Ecom
1

I’m working on an e-commerce app for Android using Kotlin. Right now, I can show products on the home screen and let users add one product to the cart from a detail screen. But I’m stuck on how to add multiple products with different quantities to the cart.

I want each product in the cart to have its own card and quantity. Currently, when I click to add items, all products get the same quantity. How can I fix this?

Here’s a simplified version of my ItemDetailScreen where users add stuff to the cart:

class ItemDetailScreen : Fragment() {
    private lateinit var binding: ScreenItemDetailBinding
    private val sharedViewModel: StoreViewModel by activityViewModels()
    
    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        
        binding.addToCartButton.setOnClickListener {
            sharedViewModel.itemCount++
            binding.quantityDisplay.text = sharedViewModel.itemCount.toString()
            Toast.makeText(context, "Added to cart", Toast.LENGTH_SHORT).show()
        }
        
        binding.goToCartButton.setOnClickListener {
            findNavController().navigate(R.id.action_itemDetail_to_cart)
        }
    }
}

Any ideas on how to make this work for multiple items? Thanks!

2

Hey there! I’m curious about your e-commerce app. Have you considered using a RecyclerView for your cart screen? It could make managing multiple items a breeze!

For the cart functionality, what if you created a Cart class to handle all the logic? Something like:

class Cart {
    private val items = mutableMapOf<String, Int>()

    fun addItem(productId: String) {
        items[productId] = (items[productId] ?: 0) + 1
    }

    fun getItems(): Map<String, Int> = items.toMap()
}

Then in your ViewModel, you could have:

class StoreViewModel : ViewModel() {
    private val cart = Cart()
    
    fun addToCart(productId: String) {
        cart.addItem(productId)
    }
}

What do you think about this approach? Have you tried something similar before? I’d love to hear your thoughts on how you might adapt this to fit your app’s needs!

3

hey daisy! i’ve dealt with this before. try using a hashmap in ur viewmodel to store product IDs and quantities. like this:

val cartItems = mutableMapOf<String, Int>()

fun addToCart(productId: String) {
    cartItems[productId] = (cartItems[productId] ?: 0) + 1
}

ten update ur UI based on the hashmap. this way each product keeps its own quantity. hope this helps!

4

To implement a multi-item cart, you’ll need to revise your data structure and ViewModel approach. Instead of a single itemCount, create a Map or List to store multiple products with their quantities.

Here’s a basic implementation:

  1. Define a CartItem data class:
data class CartItem(val productId: String, var quantity: Int)
  1. In your ViewModel, replace itemCount with a mutable list:
val cartItems = mutableListOf<CartItem>()
  1. Update your addToCart function:
fun addToCart(productId: String) {
    val existingItem = cartItems.find { it.productId == productId }
    if (existingItem != null) {
        existingItem.quantity++
    } else {
        cartItems.add(CartItem(productId, 1))
    }
    notifyCartUpdated()
}
  1. In your ItemDetailScreen, update the click listener:
binding.addToCartButton.setOnClickListener {
    sharedViewModel.addToCart(currentProductId)
    updateQuantityDisplay()
}

This approach allows you to manage multiple items with different quantities in your cart. You’ll need to adjust your cart display logic accordingly.