flutter_conditional

Description:

flutter conditional

flutter_conditonal #
Conditional rendering made easy! 💎


Developed with 💙 and maintained by scial.app

Migration 🆙 #

Migrating to 2.0.0

Replace builder functions with named parameters:

Before #
class SomeWidget extends StatelessWidget {

Widget build(BuildContext context) {

final bool someCondition = false;

return Conditional.single(
someCondition,
builder: (BuildContext _) => WidgetA(),
fallbackBuilder: (BuildContext _) => WidgetB()
);
}
}
copied to clipboard
After #
class SomeWidget extends StatelessWidget {

Widget build(BuildContext context) {

final bool someCondition = false;

return Conditional.single(
condition: someCondition,
widget: WidgetA(),
fallback: WidgetB()
);
}
}
copied to clipboard

Or make use of the methods introduced in version 2.1.0:

.singleBuilder(...)
.multiCaseBuilder(...)
.multiMatchBuilder<T>(...)
.optionalSingleBuilder(...)
.optionalMultiCaseBuilder(...)
.optionalMultiMatchBuilder<T>(...)




Quick Start 🚀 #
Installation 🧑‍💻 #
In the dependencies section of your pubspec.yaml, add the following line:
dependencies:
flutter_conditional: <latest_version>
copied to clipboard
Usage 👽 #
Import the package:
import 'package:flutter_conditional/flutter_conditional.dart';
copied to clipboard
Make use of the named constructors:
.single(...)
This constructor aims to be as simple as possible. This constructor lets you pass in a simple boolean expression.
class TrueOrFalseWidget extends StatelessWidget {

Widget build(BuildContext context) {

final bool ideaForName = false;

return Conditional.single(
condition: ideaForName,
widget: TrueWidget(),
fallback: FalseWidget()
);
}
}
copied to clipboard
.multiCase(...)
This constructor lets you pass multiple cases where every case consists of a boolean expression and a widget builder.
class MultiWidget extends StatelessWidget {

Widget build(BuildContext context) {

final int randomNumber = 69;
final String randomOS = 'Linux';
final bool isSchroedingersCatAlive = true; // Hopefully

return Conditional.multiCase(
cases: [
Case(
condition: randomNumber == 0,
widget: NumberWidget()
),
Case(
condition: randomOS == 'Linux',
widget: OSWidget() // <-- This is returned
),
Case(
condition: isSchroedingersCatAlive,
widget: SchroedingersWidget()
)
],
fallback: OtherWidget()
)
}
}
copied to clipboard
.multiMatch<T>(...)
This constructor lets you compare objects.
class CarWidget extends StatelessWidget {

Widget build(BuildContext context) {

final String carCompany = 'Tesla';

return Conditional.multiMatch<String>(
value: carCompany,
values: [
Value(
value: 'Tesla',
widget: TeslaWidget() // <-- This is returned
),
Value(
value: 'Mercedes',
widget: MercedesWidget()
),
Value(
value: 'BMW',
widget: BMWWidget()
)
],
fallback: OtherWidget()
);
}
}
copied to clipboard
or
enum Seasons {
summer,
autumn,
winter,
spring
}

class SeasonWidget extends StatelessWidget {

Widget build(BuildContext context) {

final Seasons season = Seasons.winter;

return Conditional.multiMatch<Seasons>(
value: season,
values: [
Value(
value: Seasons.summer,
widget: SummerWidget()
),
Value(
value: Seasons.autumn,
widget: AutumnWidget()
),
Value(
value: Seasons.winter,
widget: WinterWidget() // <-- This is returned
),
Value(
value: Seasons.spring,
widget: SpringWidget()
)
],
fallback: OtherWidget()
);
}
}
copied to clipboard
Additional features ⚜️ #
Optional Widgets #
In some cases you don't even want to render any widget if a given condition isn't fullfilled.
Therefore we introduced additional functions that can also return null:

.optionalSingle(...)
.optionalMultiCase(...)
.optionalMultiMatch<T>(...)

Builder Functions #
In some cases you want to make use of builder functions instead.
Therefore we introduced additional functions that accept builder functions:

.singleBuilder(...)
.multiCaseBuilder(...)
.multiMatchBuilder<T>(...)
.optionalSingleBuilder(...)
.optionalMultiCaseBuilder(...)
.optionalMultiMatchBuilder<T>(...)

isActive #
Sometimes you even want to make cases conditional. Therefore we introduces isActive as a parameter. If you don't want one or more cases to be in considered for the build method, just pass true to it like in the following example:
class ProfileWidget extends StatelessWidget {

Widget build(BuildContext context) {

final bool iLoveDart = true;
final bool possiblyChanging = false;

return Conditional.multiCase(
cases: [
Case(
condition: iLoveDart,
isActive: possiblyChanging,
widget: FirstWidget()
),
Case(
condition: iLoveDart,
widget: SecondWidget() // <-- This is returned
)
],
fallback: OtherWidget()
)
}
}
copied to clipboard
Rules ✅ #


Only cases marked as isActive will be considered. This is true by default.


The first widget whose case is true will be returned.


The default fallback widget is SizedBox.shrink() if you're not using one of the functions introduced in version 2.0.0.


Contribution 💙 #
Always open for contribution! Contributors will be listed here.