Overview EnvaSistema is built using modern Android development practices with Kotlin , Jetpack Compose , and Material 3 . The application follows a clean, modular architecture designed for warehouse management operations.
Technology Stack
UI Framework Jetpack Compose with Material 3
Navigation Navigation Compose 2.8.5
Build System Gradle with Version Catalog
Project Structure EnvaSistema/ ├── app/ │ ├── src/main/java/com/example/envasistema/ │ │ ├── MainActivity.kt │ │ └── ui/ │ │ ├── components/ # Reusable UI components │ │ ├── navigation/ # Navigation graph │ │ ├── screens/ # Screen-level composables │ │ │ ├── home/ │ │ │ ├── ingresos/ │ │ │ ├── salidas/ │ │ │ ├── movimientos/ │ │ │ └── transformaciones/ │ │ └── theme/ # Theme configuration │ └── build.gradle.kts ├── build.gradle.kts ├── settings.gradle.kts └── gradle/ └── libs.versions.toml # Version catalog
Architecture Layers 1. Application Entry Point The app starts with MainActivity, which sets up the Compose environment and applies the theme.
package com.example.envasistema import android.os.Bundle import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Surface import androidx.compose.ui.Modifier import com.example.envasistema.ui.navigation.AppNavigation import com.example.envasistema.ui.theme.EnvaSistemaTheme class MainActivity : ComponentActivity () { override fun onCreate (savedInstanceState: Bundle ?) { super . onCreate (savedInstanceState) setContent { EnvaSistemaTheme { Surface ( modifier = Modifier. fillMaxSize (), color = MaterialTheme.colorScheme.background ) { AppNavigation () } } } } }
2. Navigation Architecture EnvaSistema uses Navigation Compose with a sealed class pattern for type-safe routing.
Navigation Implementation
sealed class Screen ( val route: String ) { object Home : Screen ( "home" ) // Ingresos object Ingresos : Screen ( "ingresos" ) object ProduccionNueva : Screen ( "produccion_nueva" ) object IngresoArmado : Screen ( "ingreso_armado" ) object DevolucionNoArmado : Screen ( "devolucion_no_armado" ) object DevolucionMercaderia : Screen ( "devolucion_mercaderia" ) // Salidas object Salidas : Screen ( "salidas" ) object VentaPT : Screen ( "venta_pt" ) object ArmarPaquetes : Screen ( "armar_paquetes" ) object MermaMolino : Screen ( "merma_molino" ) object Donaciones : Screen ( "donaciones" ) // Others object Movimientos : Screen ( "movimientos" ) object Transformaciones : Screen ( "transformaciones" ) } @Composable fun AppNavigation () { val navController = rememberNavController () NavHost (navController = navController, startDestination = Screen.Home.route) { composable (Screen.Home.route) { HomeScreen ( onIngresosClick = { navController. navigate (Screen.Ingresos.route) }, onSalidasClick = { navController. navigate (Screen.Salidas.route) }, onMovimientosClick = { navController. navigate (Screen.Movimientos.route) }, onTransformacionesClick = { navController. navigate (Screen.Transformaciones.route) } ) } // ... additional routes } }
Key Features:
Type-safe navigation with sealed classes
Single NavController instance managed at app level
Lambda-based navigation callbacks for decoupled screens
Hierarchical navigation structure (Home → Category → Detail)
3. UI Layer Structure Screens Screen composables represent full-page views and handle:
User interactions
Navigation callbacks
Layout composition using reusable components
Components Reusable UI components are location-agnostic and handle:
Visual presentation
Local state management
Callback-based interactions
See UI Components Reference for detailed documentation.
Theme Centralized theming using Material 3:
Dynamic color support (Android 12+)
Custom color palette
Typography configuration
Build Configuration Module Configuration namespace
string
default: "com.example.envasistema"
Application package namespace
Target compilation SDK version
Minimum supported Android version (Android 13)
Target Android SDK version
Key Dependencies [ versions ] agp = "9.1.0" kotlin = "2.2.10" composeBom = "2024.09.00" navigationCompose = "2.8.5" coreKtx = "1.10.1" lifecycleRuntimeKtx = "2.6.1" activityCompose = "1.8.0" [ libraries ] androidx-compose-material3 = { group = "androidx.compose.material3" , name = "material3" } androidx-compose-material-icons-extended = { group = "androidx.compose.material" , name = "material-icons-extended" } androidx-navigation-compose = { group = "androidx.navigation" , name = "navigation-compose" , version.ref = "navigationCompose" }
The project uses Gradle Version Catalog for centralized dependency management. All versions are declared in gradle/libs.versions.toml.
Navigation Flow Design Patterns Composition Over Inheritance All UI is built using composable functions rather than traditional View hierarchies.
Unidirectional Data Flow
State flows down from parent to child composables
Events flow up through callback lambdas
No direct state mutation in child components
Separation of Concerns
Screens : Handle navigation and orchestrationComponents : Handle presentation and local interactionsTheme : Handle visual styling
The current architecture is optimized for a single-activity application with screen-based navigation. Future iterations may introduce ViewModels for complex state management.
Compose Optimizations
Reusable components are marked @Composable for recomposition efficiency
State is hoisted to minimize recomposition scope
Preview annotations enable rapid UI development
Build Optimizations compileOptions { sourceCompatibility = JavaVersion.VERSION_11 targetCompatibility = JavaVersion.VERSION_11 } buildFeatures { compose = true }
Next Steps
UI Components Learn about reusable components
Development Setup Set up your development environment