Skip to content

Commit

Permalink
refactor BuildContext extensions using MediaQuery for better performance
Browse files Browse the repository at this point in the history
  • Loading branch information
devj3ns committed May 8, 2024
1 parent b200b16 commit 3221a3a
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 15 deletions.
8 changes: 5 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -56,12 +56,14 @@ All features with links to their page in the documentation:


- ### Extensions on `BuildContext` (Adaptive helpers):
- #### [mediaQuery](https://pub.dev/documentation/fleasy/latest/fleasy/AdaptiveHelpers/mediaQuery.html)
The `MediaQueryData` from the closest instance of this class that encloses the given context.
- #### [screenSize](https://pub.dev/documentation/fleasy/latest/fleasy/AdaptiveHelpers/screenSize.html)
The `MediaQueryData.size` from the nearest `MediaQuery` ancestor.
- #### [screenWidth](https://pub.dev/documentation/fleasy/latest/fleasy/AdaptiveHelpers/screenWidth.html)
The horizontal extent of the screen size.
- #### [screenHeight](https://pub.dev/documentation/fleasy/latest/fleasy/AdaptiveHelpers/screenHeight.html)
The vertical extent of the screen size.
- #### [screenOrientation](https://pub.dev/documentation/fleasy/latest/fleasy/AdaptiveHelpers/screenOrientation.html)
The `MediaQueryData.orientation` from the nearest `MediaQuery` ancestor.
- #### [screenIsLandscape](https://pub.dev/documentation/fleasy/latest/fleasy/AdaptiveHelpers/screenIsLandscape.html)
Whether the device is in landscape mode.
- #### [screenIsPortrait](https://pub.dev/documentation/fleasy/latest/fleasy/AdaptiveHelpers/screenIsPortrait.html)
Expand Down Expand Up @@ -189,4 +191,4 @@ All features with links to their page in the documentation:
## Note:
**This package is still in early stages**. If you notice any bugs not present in issues, please file a [new issue](https://github.com/devj3ns/fleasy/issues). If you are willing to fix or enhance things yourself, **you are very welcome to make a [pull request](https://github.com/devj3ns/fleasy/pulls)**.

Also: **Feedback and suggestions are very welcome**. Just [open an issue](https://github.com/devj3ns/fleasy/issues) or write an email to [info@jensbecker.dev](mailto:info@jensbecker.dev).
Also: **Feedback and suggestions are very welcome**. Just [open an issue](https://github.com/devj3ns/fleasy/issues).
23 changes: 11 additions & 12 deletions lib/src/extensions/build_context/adaptive_helpers.dart
Original file line number Diff line number Diff line change
Expand Up @@ -27,23 +27,23 @@ extension FormFactorHelpers on FormFactor {
}

extension AdaptiveHelpers on BuildContext {
/// The [MediaQueryData] from the closest instance of this class that encloses the given context.
///
/// You can use this getter to query the size and orientation of the screen, as well as other media parameters.
/// When that information changes, your widget will be scheduled to be rebuilt, keeping your widget up-to-date.
MediaQueryData get mediaQuery => MediaQuery.of(this);
/// The [MediaQueryData.size] from the nearest [MediaQuery] ancestor.
Size get screenSize => MediaQuery.sizeOf(this);

/// The horizontal extent of the screen size.
double get screenWidth => mediaQuery.size.width;
double get screenWidth => screenSize.width;

/// The vertical extent of the screen size.
double get screenHeight => mediaQuery.size.height;
double get screenHeight => screenSize.height;

/// The [MediaQueryData.orientation] from the nearest [MediaQuery] ancestor.
Orientation get screenOrientation => MediaQuery.orientationOf(this);

/// Whether the device is in landscape mode.
bool get screenIsLandscape => mediaQuery.orientation == Orientation.landscape;
bool get screenIsLandscape => screenOrientation == Orientation.landscape;

/// Whether the device is in portrait mode.
bool get screenIsPortrait => mediaQuery.orientation == Orientation.portrait;
bool get screenIsPortrait => screenOrientation == Orientation.portrait;

/// Returns the correct [FormFactor] based on the [ScreenWidthBreakpoints].
///
Expand All @@ -56,9 +56,8 @@ extension AdaptiveHelpers on BuildContext {
/// is compared with the [ScreenWidthBreakpoints]. This means the [FormFactor]
/// does not change when the device orientation changes.
FormFactor formFactor({bool followDeviceOrientation = true}) {
final width = followDeviceOrientation
? mediaQuery.size.width
: mediaQuery.size.shortestSide;
final width =
followDeviceOrientation ? screenWidth : screenSize.shortestSide;

return width > ScreenWidthBreakpoints.desktop
? FormFactor.desktop
Expand Down

0 comments on commit 3221a3a

Please sign in to comment.