Search packages, repositories and app categories

Package detailsv2.1.0

flutter_conditional_rendering

A flutter package which enhances conditional rendering, supports if-else and switch conditions.

AndroidiOSWebmacOSWindowsLinux
30-day downloads
9.7K
Likes
114
Pub points
160

Install package

flutter pub add flutter_conditional_rendering

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

A Flutter package that simplifies conditional rendering in UI development by extending widget capabilities with if-else and switch statements. It allows developers to write cleaner, more readable code when conditionally displaying widgets based on runtime values. The package integrates seamlessly into existing Flutter projects and supports all major platforms including Android, iOS, Web, macOS, Windows, and Linux. Ideal for dynamic UIs requiring logic-driven visibility control.

Use cases

  • Dynamic UI elements based on state
  • Conditional widget display in forms
  • Switch-based layout changes
  • User role-based interface rendering
  • Simplified nested ternary expressions
  • Responsive design with platform-specific logic

Key features

  • Supports if-else syntax in widget trees
  • Provides switch-case conditional rendering
  • Reduces boilerplate in complex conditions
  • Works across all Flutter platforms
  • Minimal setup with pub add command
  • Clean, readable conditional logic

Suitable for

  • Developers seeking cleaner conditional UI code
  • Projects with frequent state-dependent rendering
  • Teams prioritizing maintainable widget logic
  • Apps requiring platform-specific UI variations
  • Frontend developers using declarative UI patterns

Considerations

  • May increase bundle size slightly
  • Requires understanding of Dart's expression syntax
  • Not suitable for very complex state management
  • Limited to simple condition types
  • Best used alongside state management solutions
  • Avoid overuse in deeply nested widget structures

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

flutter_conditional_rendering

A flutter package which enhances conditional rendering, supports if-else and switch conditions.

Why

In flutter if you want to do conditional rendering, you may do this:

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        if (someCondition == true)
          Text('The condition is true!'),
      ],
    );
  }
}

But what if you want to use a tertiary (if-else) condition?

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        someCondition == true ?
          Text('The condition is true!'):
          Text('The condition is false!'),
      ],
    );
  }
}

It is okay for a single Text widget, but the readability quickly become very bad when the child widget is multi-layered.

Usage

If-Else condition:
class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Conditional.single(
          context: context,
          conditionBuilder: (BuildContext context) => someCondition == true,
          widgetBuilder: (BuildContext context) => Text('The condition is true!'),
          fallbackBuilder: (BuildContext context) => Text('The condition is false!'),
        ),
      ],
    );
  }
}
Switch condition:
class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        ConditionalSwitch.single<String>(
          context: context,
          valueBuilder: (BuildContext context) => 'A',
          caseBuilders: {
            'A': (BuildContext context) => Text('The value is A!'),
            'B': (BuildContext context) => Text('The value is B!'),
          },
          fallbackBuilder: (BuildContext context) => Text('None of the cases matched!'),
        ),
      ],
    );
  }
}

Want a list of widgets?

If you want to conditionally render a list of widgets (List<Widget>) instead of a single one. Use Conditional.list() and ConditionalSwitch.list()!

Contributions

Feel free to contribute to this project.

If you find a bug or want a feature, but don't know how to fix/implement it, please fill an issue. If you fixed a bug or implemented a feature, please send a pull request.

Categories

Source repository

Projects using this package

No data available yet.