breakpoint_base

Creator: coderz1093

Last updated:

0 purchases

breakpoint_base Image
breakpoint_base Images

Languages

Categories

Add to Cart

Description:

breakpoint base

A base class to define Flutter breakpoint properties.
Basic usage #
Use default breakpoints:



Width(Logical pixels)
Size
Columns
Gutter




0 - 599
xsmall
4
16


600 - 719
small
8
16


720 - 839
small
8
24


840 - 1023
small
12
24


1024 - 1439
medium
12
24


1440 - 1919
large
12
24


1920+
xlarge
12
24



final media = MediaQuery.of(context);

final breakpoint = BreakpointBase(
orientation: media.orientation,
width: media.size.width,
);
copied to clipboard
Advanced usage #
To customise breakpoints:



Width
Size
Gutter
Expanded(portrait)
Expanded(landscape)




0 - 799
small
16
false
true


800 - 1599
medium
24
false
true


1600+
large
50
true
true



final media = MediaQuery.of(context);

final breakpoint = Breakpoint(
orientation: media.orientation,
width: media.size.width,
);

//
class Breakpoint extends BreakpointBase {
Breakpoint({required Orientation orientation, required double width})
: super(orientation: orientation, width: width);

@override
LayoutSize get size => _findValue({
0: LayoutSize.small,
800: LayoutSize.medium,
1600: LayoutSize.large,
});

@override
int get gutter => _findValue({0: 16, 800: 24, 1600: 50});

// Add one more property
bool get expanded => orientation == Orientation.landscape || width >= 1600;
}
copied to clipboard

License

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

Files In This Product:

Customer Reviews

There are no reviews.