LEDA - Dating & Social App UI Kit

A beautiful, modern Flutter UI Kit for dating and social networking applications

LEDA is a comprehensive open-source Flutter UI Kit that provides a complete set of screens and components for building modern dating and social networking applications. This kit features a beautiful dark theme with vibrant gradient accents, card-based swiping interface, real-time messaging components, and comprehensive profile management screens.

Perfect for developers who want to build a dating app or need inspiration for modern mobile UI design patterns.

• Login & Sign Up: Secure authentication with email and password
• OTP Verification: Two-factor authentication via email
• Password Recovery: Forgot password flow with OTP verification
• Profile Setup: Multi-step onboarding process
  • Gender selection
  • Profile information (nickname, age, bio, height, weight)
  • Photo upload with camera integration
  • Interest selection
  • Relationship preferences (One-night, Long-term, Settlement)

• Card Swiping: Interactive card-based discovery interface
• Match System: Real-time matching when both users like each other
• Premium Features:
  • Unlimited swipes
  • Rewind functionality
  • Daily hot picks
  • Country select feature

• Real-time Chat: Full-featured messaging system
• Media Sharing: Send photos and videos
• Voice & Video Calls: Communication options (prepared for integration)
• Match Notifications: Alerts for new matches and messages

• Profile Page: View and edit your profile
• Matches List: Browse all your matches
• Settings:
  • General settings
  • Push notifications
  • Dark mode
  • Extra security options
  • Language selection
  • Show online status

• Camera Integration: Capture photos directly in-app
• Image Picker: Select photos from gallery with cropping
• Distance Filtering: Find people within your preferred distance
• Age Range Filter: Customize age preferences
• Interest Categories: Art & Design, TV & Music, Tech, Books, Fitness & Health, Food, Sports, Animals, Cars

This project follows Clean Architecture principles with BLoC (Business Logic Component) pattern for state management:

lib/
├── commons/           # Shared utilities and widgets
│   ├── gradient.dart
│   ├── pages/
│   └── widgets/      # Reusable UI components
├── features/          # Feature modules (each with clean architecture)
│   ├── auth/
│   │   ├── data/     # Data sources, models, repositories
│   │   ├── domain/   # Entities, repositories, use cases
│   │   └── presentation/  # BLoC, pages, widgets
│   ├── discover/
│   ├── chat/
│   ├── matches/
│   └── ...
└── gen/              # Generated code (assets, colors, fonts, locales)

• Presentation Layer: UI components, BLoC state management, pages
• Domain Layer: Business logic, entities, use cases, repository interfaces
• Data Layer: Data sources, models, repository implementations

• Flutter SDK: ^3.8.1
• State Management: flutter_bloc ^9.1.1, bloc, equatable
• Localization: easy_localization ^3.0.8
• UI Components:
  • flutter_card_swiper ^7.1.0 - Card swiping interface
  • chatview ^2.5.0 - Chat UI components
  • carousel_slider ^5.1.1 - Image carousels
  • extended_image ^10.0.1 - Advanced image handling
  • flutter_gradient_slider ^0.0.12 - Custom sliders

• Camera: camerawesome ^2.5.0
• Image Picker: insta_assets_picker - Instagram-style picker with cropping
• Gallery: gal - Media gallery access
• File Handling: open_filex ^4.7.0, path_provider ^2.1.5, cross_file ^0.3.4+2

• country_code_picker ^3.4.1 - Country selection
• flutter_otp_text_field ^1.5.1+1 - OTP input fields
• styled_text ^8.1.0 - Rich text formatting
• flutter_skeleton_ui ^0.0.6 - Loading skeletons
• flutter_native_splash ^2.4.7 - Splash screen

• build_runner ^2.4.11 - Code generation
• flutter_gen_runner ^5.9.0 - Asset generation
• flutter_launcher_icons ^0.14.4 - App icon generation
• flutter_lints ^5.0.0 - Linting rules

• ✅ Android (API 21+)
• ✅ iOS

• Flutter SDK 3.8.1 or higher
• Dart SDK (included with Flutter)
• Android Studio / Xcode (for mobile development)
• Git

1. Clone the repository

   git clone <repository-url>
   cd leda_app

2. Install dependencies

   flutter pub get

3. Generate code (assets, colors, fonts, locales)

   Generate Localizations

   flutter pub run easy_localization:generate --source-dir 'assets/localizations' --output-dir lib/gen -f keys -o locale_keys.g.dart

   Generate Splash Screen

   dart run flutter_native_splash:create

   Generate Launcher Icons

   dart run flutter_launcher_icons 

   Generate Supporting Classes

   dart pub global activate flutter_gen
   fluttergen

4. Run the app

   flutter run

• Minimum SDK: 21
• Target SDK: Configured in android/app/build.gradle.kts

• Minimum iOS version: Configured in ios/Podfile

Colors are defined in assets/colors/colors.xml and generated as AppColors class.

• Raleway: Regular, Medium (500), SemiBold (600), Bold (700)
• Keyline: Logo and branding font

All assets are organized in assets/ directory:

• images/ - App icons and images
• fonts/ - Custom fonts
• localizations/ - Translation files (JSON format)
• colors/ - Color definitions

Assets are automatically generated into lib/gen/assets.gen.dart.

The app supports internationalization using easy_localization:

• Current supported locale: English (en)
• Translation files: assets/localizations/en.json
• Generated keys: lib/gen/locale_keys.g.dart

To add new locales:

1. Add translation file: assets/localizations/<locale>.json
2. Update supportedLocales in main.dart
3. Run flutter pub run build_runner build

leda_app/
├── android/          # Android-specific files
├── ios/              # iOS-specific files
├── lib/
│   ├── commons/      # Shared code
│   ├── features/      # Feature modules
│   ├── gen/          # Generated code
│   └── main.dart     # App entry point
├── assets/           # Images, fonts, localizations
├── test/             # Unit and widget tests
├── pubspec.yaml      # Dependencies
└── README.md         # This file

Run tests using:

flutter test

• Follow Flutter/Dart style guidelines
• Use flutter_lints for code quality
• Run flutter analyze before committing

• Use BLoC pattern for all state management
• Keep business logic in domain layer
• Use repositories for data access

• Files: snake_case.dart
• Classes: PascalCase
• Variables/Functions: camelCase
• Constants: lowerCamelCase or UPPER_SNAKE_CASE

Implemented using flutter_card_swiper with custom card builders and swipe handlers.

Built with chatview package, supporting text messages, media sharing, and reply functionality.

• Camera integration via camerawesome
• Gallery picker with cropping via insta_assets_picker
• Image display with extended_image for advanced features

Multi-step wizard guiding users through:

1. Gender selection
2. Profile information
3. Photo upload
4. Interests
5. Relationship preferences

This UI Kit is perfect for:

• Learning Flutter: Study clean architecture and BLoC pattern implementation
• Quick Prototyping: Jumpstart your dating app development
• UI Inspiration: Explore modern mobile UI patterns and animations
• Customization: Use as a base and customize to match your brand
• Component Library: Extract reusable widgets for your own projects

The UI Kit includes screens for:

• Splash & Authentication (Login, Sign Up, OTP)
• Onboarding Flow (Gender Selection, Profile Setup, Interests)
• Discovery & Matching (Card Swiping, Match Dialog)
• Chat Interface (Messaging, Media Sharing)
• Profile Management (View Profile, Edit Profile, Settings)
• Premium Features (Subscription Screens)

Contributions are welcome! This is an open-source project, and we appreciate any help.

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

• Follow the existing code style and architecture patterns
• Add comments for complex logic
• Update documentation if needed
• Test your changes before submitting

This project is open source and available under the MIT License.

Long Hoang

• Built with Flutter framework
• UI inspired by modern dating app designs
• Thanks to all contributors and the Flutter community

For issues, questions, or contributions:

• Open an issue on GitHub
• Check existing issues and discussions
• Review the codebase documentation