Relation Widgets #

A Flutter package providing relational widgets for conditional rendering, designed to make your code cleaner, more readable, and expressive.

This package offers a set of widgets that handle common conditional UI patterns, replacing messy if/else logic or ternary operators with declarative, self-documenting widgets.

Features #

• EnemiesWidget: Manages two widgets that cannot coexist. Shows one based on a condition, with smooth transitions.
• ManyToOneWidget: Selects exactly one widget to display from a list of conditional candidates. Enforces strict exclusive selection.
• LoadWidget: A dedicated widget for handling Loading, Loaded, and Error states with proper error handling logic.

Getting started #

Add the package to your pubspec.yaml:

dependencies:
  relation_widgets: ^0.0.1

Or run:

flutter pub add relation_widgets

Usage #

EnemiesWidget #

Use EnemiesWidget when you have two widgets that are "enemies" and cannot be shown at the same time (e.g., "Login" vs "Logout" button, or "Seller" vs "Buyer" view).

import 'package:relation_widgets/relation_widgets.dart';

// check if user is a seller
bool isItSeller() {
  return true; // your logic here
}

EnemiesWidget(
  firstWidget: Text("Im a seller"),
  secondWidget: Text("Im a buyer"),
  // Pass the function reference, cleaner than closures
  showFirstWidgetWhen: isItSeller, 
),

ManyToOneWidget #

Use ManyToOneWidget when you have a list of potential widgets, but only one should be visible at a time based on complex specific conditions. It enforces that exactly one condition is met, helping you catch logical errors in your UI states.

import 'package:relation_widgets/relation_widgets.dart';

ManyToOneWidget(
  conditionalChildren: [
    ConditionalElement(
      showWhen: () => userType == 'seller',
      child: Text('Hello seller'),
    ),
    ConditionalElement(
      showWhen: () => userType == 'buyer',
      child: Text('Hello buyer'),
    ),
    ConditionalElement(
      showWhen: () => userType == 'delivery',
      child: Text('Hello delivery guy'),
    ),
  ],
),

LoadWidget #

LoadWidget simplifies the common pattern of checking isLoading and hasError flags. It ensures you don't accidentally show a loading spinner when you have an error, or show content when it's still loading.

import 'package:relation_widgets/relation_widgets.dart';

LoadWidget(
  loadStatus: LoadStatus.loading,
  hasError: false,
  loadingWidget: CircularProgressIndicator(),
  loadedWidget: Text('Data Loaded Successfully'),
  errorWidget: Text('Something went wrong'),
),

Additional information #

This package aims to improve code readability by replacing imperative logic with declarative widgets. For more examples, check the /example folder in the package repository.