responsive_ux

Description:

responsive ux

Library to create Responsive UI more easily
The current state is under active development and might change heavily until the first stable release.
Feel free to reach out on GitHub
Features #


Implementation of (Jetpack Compose) WindowSizeClass


Implementation of (Apple) UserInterfaceSizeClass


Implementation of (Material) WindowSizeClass


BreakpointBuilder for efficiently rebuilding widgets based on a list of Breakpoints


Getting started #
dart pub add responsive_ux
copied to clipboard
Usage #
(see /example folder for a working example and different use cases)
MaterialApp(
// WindowSizeConfiguration must only be injected for custom boundaries, otherwise defaults are used (check documentation)
home: WindowSizeConfiguration(
data: WindowSizeConfigurationData(
sizes: [WindowSizes.compact]
),
child: BuilderScreen(),
),
);
copied to clipboard
WindowSizeBuilder(
builder: (width, height, child) {
String w = "";
String h = "";

switch (width) {
case WindowSizes.compact:
w = "Compact";
case WindowSizes.medium:
w = "Medium";
case WindowSizes.expanded:
w = "Expanded";
}

switch (height) {
case WindowSizes.compact:
h = "Compact";
case WindowSizes.medium:
h = "Medium";
case WindowSizes.expanded:
h = "Expanded";
}

print(width.width); // The WindowSize width boundary that is matched
print(height.height); // The WindowSize height boundary that is matched

return Text("W: $w\nH: $h");
},
);
copied to clipboard
Additional information #
This package has been developed as Flutter does not has an implementation right now
As the name suggests, we are open for ideas and do not limit this package on what there currently is.
Every improvement can be requested and contributed on GitHub.

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Share

• Share on Facebook
• Share on Twitter