Skip to main content

Components Overview

The TechSales Android application follows a modern Android architecture using Material Design 3, EdgeToEdge UI, and ConstraintLayout for building responsive user interfaces.

Architecture Pattern

TechSales uses a single-activity architecture with the following structure:
  • MainActivity: The main entry point and container for the app
  • ConstraintLayout: Flexible layout system for complex UI designs
  • Material Design 3: Modern UI components and theming
  • EdgeToEdge: Immersive display utilizing the entire screen
The app is configured with NoActionBar theme to provide full control over the UI and enable modern edge-to-edge displays.

Material Design 3 Integration

The app implements Material Design 3 (Material You) through the following configuration:

Theme Configuration

From themes.xml:3-8:
<style name="Base.Theme.TechSales" parent="Theme.Material3.DayNight.NoActionBar">
    <!-- Customize your light theme here. -->
    <!-- <item name="colorPrimary">@color/my_light_primary</item> -->
</style>

<style name="Theme.TechSales" parent="Base.Theme.TechSales" />

Key Features

Provides automatic switching between light and dark themes based on system settings. This ensures the app respects user preferences and provides optimal viewing in different lighting conditions.
Removes the traditional ActionBar to enable modern UI patterns with custom toolbars and edge-to-edge display. This gives developers full control over the status bar and navigation bar areas.

EdgeToEdge UI Implementation

The app utilizes AndroidX EdgeToEdge functionality to create immersive, full-screen experiences:
EdgeToEdge.enable(this);
This enables:
  • Drawing content behind system bars
  • Transparent status and navigation bars
  • Modern, immersive user experience
  • Proper window insets handling
EdgeToEdge requires careful handling of window insets to prevent content from being obscured by system UI elements.

Application Configuration

From AndroidManifest.xml:5-23:
<application
    android:allowBackup="true"
    android:dataExtractionRules="@xml/data_extraction_rules"
    android:fullBackupContent="@xml/backup_rules"
    android:icon="@mipmap/ic_launcher"
    android:label="@string/app_name"
    android:roundIcon="@mipmap/ic_launcher_round"
    android:supportsRtl="true"
    android:theme="@style/Theme.TechSales">

Component Structure

The app follows this component hierarchy:
TechSales Application
├── MainActivity (Entry Point)
│   ├── EdgeToEdge Configuration
│   ├── Window Insets Handling
│   └── Layout Inflation
└── activity_main.xml
    └── ConstraintLayout (Root)
        └── UI Components

Key Technologies

TechnologyPurposeVersion
Material Design 3UI components and themingLatest
AndroidX EdgeToEdgeImmersive displayLatest
ConstraintLayoutFlexible layoutsLatest
AppCompatBackwards compatibilityLatest

Next Steps

MainActivity

Learn about the main activity implementation

Layouts

Explore the layout structure and XML

Build docs developers (and LLMs) love