Reverse & Subtract - Clean Architecture Flutter App

A Flutter application that calculates the absolute difference between a number and its reverse, built with Clean Architecture principles and Riverpod for state management.

📋 Table of Contents

• Features
• Tech Stack
• Architecture
• Project Structure
• Getting Started
• Running the App
• Testing
• Calculation Logic

✨ Features

• ✅ Calculate absolute difference between a number and its reverse
• ✅ Handle large numbers using BigInt
• ✅ Clean UI with Material Design 3
• ✅ State management with Riverpod
• ✅ Reusable widget components
• ✅ Comprehensive unit tests

🛠 Tech Stack

• Flutter: 3.41.4 (Channel Stable)
• Dart: 3.11.1
• State Management: flutter_riverpod ^2.4.9
• Architecture: Clean Architecture + MVVM

🏗 Architecture

This project follows Clean Architecture principles with clear separation of concerns:

• Architecture & Clean Code: Inspired by ResoCoder's Flutter Clean Architecture—implementing a strict separation of concerns, repository patterns, and robust dependency management.

Layers:

• Presentation: UI logic dan widgets (Flutter).
• View Model: State management menggunakan Riverpod (Notifier & Providers).
• Data: Data models (JSON mapping) dan repository implementation.
• Core: Utility universal seperti AppTheme, AppColors, dan CalculationLogic.

Key Principles

1. Separation of Concerns - Each layer has a single responsibility
2. Dependency Rule - Dependencies only point inward
3. Testability - Each layer can be tested independently
4. Reusability - Components can be reused across features

📁 Project Structure

lib/
├── core/                              # Shared resources
│   ├── constants/
│   │   └── app_colors.dart         # App-wide color palette
│   ├── theme/
│   │   └── app_theme.dart          # Material Design 3 theme
│   └── utils/
│       └── reverse_calculator.dart  # Business logic utilities
│
└── feature/
    └── reverse_subtract/              # Feature module
        ├── data/                      # Data layer
        │   ├── models/
        │   │   └── reverse_result_model.dart
        │   └── repositories/
        │       └── reverse_repository.dart
        │
        ├── presentation/               # Presentation layer
        │   ├── screens/
        │   │   └── reverse_subtract_screen.dart
        │   └── widgets/
        │       ├── app_background_gradient.dart
        │       ├── app_back_button.dart
        │       ├── app_logo.dart
        │       ├── app_primary_button.dart
        │       ├── app_text_field.dart
        │       ├── result_display.dart
        │       └── screen_header.dart
        │
        └── view_model/                # View Model layer
            ├── reverse_state.dart        # State class
            ├── reverse_notifier.dart     # StateNotifier
            ├── reverse_providers.dart   # Riverpod providers
            └── reverse_view_model.dart  # Barrel export

test/
└── feature/
    └── reverse_subtract/
        └── view_model/
            └── reverse_notifier_test.dart  # Unit tests

🚀 Getting Started

Prerequisites

• Flutter SDK 3.0.0 or higher

Installation

1. Clone the repository:

git clone <repository-url>
cd reversesubtest

2. Install dependencies:

flutter pub get

3. Check Flutter installation:

flutter doctor

🏃 Running the App

Development Mode

Run the app in debug mode:

flutter run

Release Mode

Build for release:

# Android APK
flutter build apk --release

# Android App Bundle
flutter build appbundle --release

# iOS
flutter build ios --release

# Web
flutter build web --release

🧪 Testing

Run All Tests

flutter test

🔢 Calculation Logic

Algorithm

The calculation uses BigInt to handle very large numbers efficiently:

  static String calculateReverseDifference(String input) {
    String cleanInput = input.replaceAll(RegExp(r'[^0-9]'), '');
    if (cleanInput.isEmpty) return "-";

    try {
      BigInt original = BigInt.parse(cleanInput);
      BigInt temp = original;
      BigInt reversed = BigInt.zero;
      BigInt ten = BigInt.from(10);

      while (temp > BigInt.zero) {
        reversed = (reversed * ten) + (temp % ten);
        temp = temp ~/ ten;
      }

      return (original - reversed).abs().toString();
    } catch (e) {
      return "-";
    }
  }

Why BigInt?

BigInt is used instead of regular integers because:

• ✅ Handles arbitrarily large numbers
• ✅ No overflow issues
• ✅ Precise calculations
• ✅ Suitable for mathematical operations

Examples

Input	Reversed	Difference
21	12	9
123	321	198
123456789	987654321	864197532
121	121	0
0	0	0

Unit Testing

The calculation logic is thoroughly tested with unit tests covering:

• ✅ Normal cases (21 → 9)
• ✅ Edge cases (empty, zero, single digit)
• ✅ Large numbers (123456789 → 864197532)
• ✅ Special cases (palindromes, same digits)

See reverse_notifier_test.dart for complete test coverage.

📦 Dependencies

See pubspec.yaml for complete dependency list:

dependencies:
  flutter:
    sdk: flutter
  cupertino_icons: ^1.0.8
  flutter_riverpod: ^2.4.9

dev_dependencies:
  flutter_test:
    sdk: flutter
  flutter_lints: ^5.0.0

🎨 UI Components

Reusable Widgets

All widgets are reusable and customizable:

• AppBackgroundGradient - Decorative gradient background
• AppBackButton - Styled back button with shadow
• AppLogo - Customizable logo widget
• AppTextField - Styled text input with validation
• AppPrimaryButton - Primary button with loading state
• ResultDisplay - Result display widget
• ScreenHeader - Combined logo and header

📸 Demo