Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion app/build.gradle.kts
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,6 @@ dependencies {
implementation(libs.androidx.ui.graphics)
implementation(libs.androidx.ui.tooling.preview)
implementation(libs.androidx.material3)
implementation(libs.androidx.appcompat)
testImplementation(libs.junit)
androidTestImplementation(libs.androidx.junit)
androidTestImplementation(libs.androidx.espresso.core)
Expand Down
2 changes: 1 addition & 1 deletion app/src/main/java/com/uniandes/ecobites/MainActivity.kt
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.example.ecobites.LoginScreen
import com.uniandes.ecobites.ui.screens.CartScreen
import com.uniandes.ecobites.ui.screens.HomeScreen
import com.uniandes.ecobites.ui.screens.home.HomeScreen
import com.uniandes.ecobites.ui.screens.ProfileScreen
import com.uniandes.ecobites.ui.theme.AppTheme
import com.uniandes.ecobites.ui.components.NavBar
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ package com.uniandes.ecobites.ui.navigation

import androidx.compose.runtime.Composable
import com.uniandes.ecobites.ui.screens.CartScreen
import com.uniandes.ecobites.ui.screens.HomeScreen
import com.uniandes.ecobites.ui.screens.home.HomeScreen
import com.uniandes.ecobites.ui.screens.OrdersScreen
import com.uniandes.ecobites.ui.screens.ProfileScreen

Expand Down

This file was deleted.

Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.carousel.HorizontalMultiBrowseCarousel
import androidx.compose.material3.carousel.rememberCarouselState
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import com.uniandes.ecobites.R

@ExperimentalMaterial3Api
@Composable
fun OfferCarousel() {
// List of images to be shown in the carousel
val items = listOf(
R.drawable.percent,
R.drawable.free_delivery,
R.drawable.two_for_one,
R.drawable.fiftyoff
)

// Remember Carousel State
val carouselState = rememberCarouselState { items.size }

// Carousel implementation using Hero Strategy
HorizontalMultiBrowseCarousel(
state = rememberCarouselState { items.count() },
modifier = Modifier.height(250.dp).fillMaxWidth(),
preferredItemWidth = 250.dp,
itemSpacing = 8.dp,
// contentPadding = PaddingValues(horizontal = 40.dp)
) { index ->
// Content of each carousel item
Image(
painter = painterResource(id = items[index]),
contentDescription = "Carousel Image",
contentScale = ContentScale.Crop,
modifier = Modifier
.height(300.dp).maskClip(MaterialTheme.shapes.extraLarge)
)
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
import androidx.compose.foundation.layout.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.rounded.Check
import androidx.compose.material.icons.rounded.Edit
import androidx.compose.material.icons.rounded.Home
import androidx.compose.material.icons.rounded.ShoppingCart
import androidx.compose.material.icons.rounded.Star
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp

// Categories for the Tabs with Icons from Material Icons
data class Category(val name: String, val icon: ImageVector)

val categories = listOf(
Category("Restaurant", Icons.Rounded.Home),
Category("Ingredients", Icons.Rounded.Edit),
Category("Store", Icons.Rounded.ShoppingCart),
Category("Diet", Icons.Rounded.Check)
)

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun CategoriesRow() {
var selectedTabIndex by remember { mutableStateOf(0) }

ScrollableTabRow(
selectedTabIndex = selectedTabIndex,
modifier = Modifier.fillMaxWidth(),
containerColor = MaterialTheme.colorScheme.surface,
contentColor = MaterialTheme.colorScheme.onSurface,
edgePadding = 16.dp // Optional padding at the edges
) {
categories.forEachIndexed { index, category ->
Tab(
selected = selectedTabIndex == index,
onClick = { selectedTabIndex = index },
text = {
// Row to place the icon and text horizontally
Row(
verticalAlignment = androidx.compose.ui.Alignment.CenterVertically
) {
Icon(
imageVector = category.icon,
contentDescription = "${category.name} Icon",
modifier = Modifier.size(20.dp)
)
Spacer(modifier = Modifier.width(8.dp)) // Space between icon and text
Text(
text = category.name,
maxLines = 1,
overflow = TextOverflow.Ellipsis
)
}
}
)
}
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
package com.uniandes.ecobites.ui.screens.home

import StoresGrid
import CategoriesRow
import OfferCarousel
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.verticalScroll
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp


@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun HomeScreen() {
Column(
modifier = Modifier
.fillMaxSize()
.verticalScroll(rememberScrollState())
.padding(16.dp)
) {
// Top Location and Search Bar Section
TopSection()

Spacer(modifier = Modifier.height(16.dp))

// Offer Carousel Section
OfferCarousel()

Spacer(modifier = Modifier.height(16.dp))

// Categories Filter Section
CategoriesRow()

Spacer(modifier = Modifier.height(16.dp))

// Stores/Restaurants Grid Section
StoresGrid()
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import androidx.compose.ui.Alignment
import com.uniandes.ecobites.R

// Data class representing a store
data class Store(val name: String, val imageResId: Int)

// List of stores with their images
val stores = listOf(
Store("Éxito", R.drawable.exito),
Store("Hornitos", R.drawable.hornitos),
Store("McDonalds", R.drawable.mc_donalds),
Store("Dunkin Donuts", R.drawable.dunkin_donuts),
Store("Pan Pa' Ya!", R.drawable.pan_pa_ya)
)

@Composable
fun StoresGrid() {
Column(
modifier = Modifier.fillMaxWidth(),
verticalArrangement = Arrangement.spacedBy(16.dp),
horizontalAlignment = Alignment.CenterHorizontally
) {
// First row with 2 items
Row(
horizontalArrangement = Arrangement.spacedBy(16.dp),
modifier = Modifier.fillMaxWidth()
) {
stores.take(2).forEach { store ->
StoreItem(store = store, modifier = Modifier.weight(1f))
}
}

// Second row with 3 items
Row(
horizontalArrangement = Arrangement.spacedBy(16.dp),
modifier = Modifier.fillMaxWidth()
) {
stores.drop(2).take(3).forEach { store ->
StoreItem(store = store, modifier = Modifier.weight(1f))
}
}
}
}

@Composable
fun StoreItem(store: Store, modifier: Modifier = Modifier) {
Column(
horizontalAlignment = Alignment.CenterHorizontally,
modifier = modifier
) {
// Display the store image
Image(
painter = painterResource(id = store.imageResId),
contentDescription = store.name,
contentScale = ContentScale.Crop,
modifier = Modifier
.size(150.dp).clip(MaterialTheme.shapes.extraLarge) // Rounded corners for the image
)
Spacer(modifier = Modifier.height(8.dp))

// Display the store name below the image
Text(
text = store.name,
style = MaterialTheme.typography.bodyMedium
)
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
package com.uniandes.ecobites.ui.screens.home

import androidx.compose.foundation.layout.*
import androidx.compose.material.icons.Icons
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.Alignment
import androidx.compose.material.icons.outlined.LocationOn
import androidx.compose.material.icons.outlined.Search
import androidx.compose.material.icons.outlined.Close
import androidx.compose.ui.unit.dp
import androidx.compose.ui.graphics.Color
import androidx.compose.material3.*
import androidx.compose.runtime.getValue
import androidx.compose.runtime.setValue
import androidx.compose.runtime.remember
import androidx.compose.runtime.mutableStateOf
import androidx.compose.ui.tooling.preview.Preview

// Top Section with Location and Search Bar
@Preview(showBackground = true)
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun TopSection() {
var query by remember { mutableStateOf("") }
var isActive by remember { mutableStateOf(false) }

Column(
modifier = Modifier
.fillMaxWidth()
.padding(8.dp),
horizontalAlignment = Alignment.CenterHorizontally
) {
// Location Row
Row(
verticalAlignment = Alignment.CenterVertically,
modifier = Modifier
) {
Icon(Icons.Outlined.LocationOn, contentDescription = "Location", tint = Color.Gray)
Spacer(modifier = Modifier.width(8.dp))
Text(text = "Calle 13 #10-22", style = MaterialTheme.typography.bodyMedium)
}
Spacer(modifier = Modifier.height(8.dp))

// Material 3 Search Bar with Size Constraint
SearchBar(
query = query,
onQueryChange = { query = it },
onSearch = {
// Handle search logic
},
active = isActive,
onActiveChange = { isActive = it },
placeholder = { Text("Search deals...") },
leadingIcon = { Icon(Icons.Outlined.Search, contentDescription = "Search Icon") },
trailingIcon = {
if (query.isNotEmpty()) {
IconButton(onClick = { query = "" }) {
Icon(Icons.Outlined.Close, contentDescription = "Clear")
}
}
},
modifier = Modifier
.fillMaxWidth() // Ensure it fills the parent width properly
.heightIn(min = 56.dp, max = 72.dp) // Control the min and max height
.padding(horizontal = 8.dp) // Add some padding
) {
// You can provide additional content here if needed
}
}
}
Binary file added app/src/main/res/drawable/dunkin_donuts.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/src/main/res/drawable/exito.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/src/main/res/drawable/fiftyoff.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/src/main/res/drawable/free_delivery.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/src/main/res/drawable/hornitos.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/src/main/res/drawable/mc_donalds.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/src/main/res/drawable/pan_pa_ya.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/src/main/res/drawable/percent.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/src/main/res/drawable/two_for_one.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
7 changes: 4 additions & 3 deletions gradle/libs.versions.toml
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@ espressoCore = "3.6.1"
lifecycleRuntimeKtx = "2.8.5"
activityCompose = "1.9.2"
composeBom = "2024.04.01"
appcompat = "1.7.0"
composeVersion = "1.3.0"
runtimeAndroid = "1.7.2"

[libraries]
androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref = "coreKtx" }
Expand All @@ -24,8 +25,8 @@ androidx-ui-tooling = { group = "androidx.compose.ui", name = "ui-tooling" }
androidx-ui-tooling-preview = { group = "androidx.compose.ui", name = "ui-tooling-preview" }
androidx-ui-test-manifest = { group = "androidx.compose.ui", name = "ui-test-manifest" }
androidx-ui-test-junit4 = { group = "androidx.compose.ui", name = "ui-test-junit4" }
androidx-material3 = { group = "androidx.compose.material3", name = "material3" }
androidx-appcompat = { group = "androidx.appcompat", name = "appcompat", version.ref = "appcompat" }
androidx-material3 = { group = "androidx.compose.material3", name = "material3", version.ref="composeVersion" }
androidx-runtime-android = { group = "androidx.compose.runtime", name = "runtime-android", version.ref = "runtimeAndroid" }

[plugins]
android-application = { id = "com.android.application", version.ref = "agp" }
Expand Down