falconGitHub

prefer-dedicated-media-query-methods

Same as prefer_dedicated_media_query_methods in Pyramid Lint

Group
Style
Path
lint/style/prefer-dedicated-media-query-methods
Default
On (recommended)
Origin
Pyramid Lint
Domain
flutter
Rule
346 of 512
recommendedflutter

Flags MediaQuery.of(context).size access in favor of MediaQuery.sizeOf.

Reading .width or .height off MediaQuery.of(context).size subscribes the widget to the entire MediaQueryData, so it rebuilds whenever any media property changes — text scale, padding, orientation — not just the screen size. Flutter's dedicated MediaQuery.sizeOf(context) aspect getter subscribes only to size changes, avoiding those spurious rebuilds. Use MediaQuery.sizeOf(context) (and its siblings) instead of pulling fields out of the whole MediaQueryData.

Invalid

example.dartdart
import 'package:flutter/material.dart';

// Bad: using MediaQuery.of(context).size.width
class ResponsiveWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final width = MediaQuery.of(context).size.width;
    return SizedBox(width: width);
  }
}

// Bad: using MediaQuery.of(context).size.height
class HeightWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final height = MediaQuery.of(context).size.height;
    return SizedBox(height: height);
  }
}

// Bad: chaining size.width directly
class ContainerWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: MediaQuery.of(context).size.width,
      child: Text('Full width'),
    );
  }
}

// Bad: accessing height in a calculation
class DynamicHeightWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final availableHeight = MediaQuery.of(context).size.height - 100;
    return SizedBox(height: availableHeight);
  }
}

// Bad: using both width and height
class ResponsiveBoxWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final w = MediaQuery.of(context).size.width;
    final h = MediaQuery.of(context).size.height;
    return SizedBox(width: w, height: h);
  }
}

// Regression: the violation must still be found inside Dart 3 containers
// (pattern declaration, labeled statement, switch expression and subject,
// collection if/spread, record field).
void containersRegression(int rcount, BuildContext context) {
  final (ra, _) = (MediaQuery.of(context).size.width, 0);
  lbl: {
    final rb = MediaQuery.of(context).size.width;
    print(rb);
  }
  final rc = switch (rcount) {
    0 => MediaQuery.of(context).size.width,
    _ => null,
  };
  final rd = switch (MediaQuery.of(context).size.width) {
    _ => 0,
  };
  final re = [if (rcount > 0) MediaQuery.of(context).size.width];
  final rf = [...[MediaQuery.of(context).size.width]];
  final rg = (p: MediaQuery.of(context).size.width, q: 0);
  print([ra, rc, rd, re, rf, rg]);
}
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
6 Widget build(BuildContext context) {
7 final width = MediaQuery.of(context).size.width;
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
15 Widget build(BuildContext context) {
16 final height = MediaQuery.of(context).size.height;
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
25 return Container(
26 width: MediaQuery.of(context).size.width,
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
35 Widget build(BuildContext context) {
36 final availableHeight = MediaQuery.of(context).size.height - 100;
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
44 Widget build(BuildContext context) {
45 final w = MediaQuery.of(context).size.width;
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
45 final w = MediaQuery.of(context).size.width;
46 final h = MediaQuery.of(context).size.height;
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
54void containersRegression(int rcount, BuildContext context) {
55 final (ra, _) = (MediaQuery.of(context).size.width, 0);
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
56 lbl: {
57 final rb = MediaQuery.of(context).size.width;
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
60 final rc = switch (rcount) {
61 0 => MediaQuery.of(context).size.width,
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
63 };
64 final rd = switch (MediaQuery.of(context).size.width) {
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
66 };
67 final re = [if (rcount > 0) MediaQuery.of(context).size.width];
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
67 final re = [if (rcount > 0) MediaQuery.of(context).size.width];
68 final rf = [...[MediaQuery.of(context).size.width]];
Use `MediaQuery.sizeOf(context)` instead of `MediaQuery.of(context).size`.
68 final rf = [...[MediaQuery.of(context).size.width]];
69 final rg = (p: MediaQuery.of(context).size.width, q: 0);

Valid

example.dartdart
import 'package:flutter/material.dart';

// Good: using MediaQuery.sizeOf() for width
class ResponsiveWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final width = MediaQuery.sizeOf(context).width;
    return SizedBox(width: width);
  }
}

// Good: using MediaQuery.sizeOf() for height
class HeightWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final height = MediaQuery.sizeOf(context).height;
    return SizedBox(height: height);
  }
}

// Good: using dedicated extension method (if available)
class ContainerWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: MediaQuery.sizeOf(context).width,
      child: Text('Full width'),
    );
  }
}

// Good: using other MediaQuery methods correctly
class PaddingWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final devicePadding = MediaQuery.of(context).padding;
    return Padding(
      padding: devicePadding,
      child: Text('Safe area'),
    );
  }
}

// Good: using sizeOf for dynamic height calculation
class DynamicHeightWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final availableHeight = MediaQuery.sizeOf(context).height - 100;
    return SizedBox(height: availableHeight);
  }
}

// Good: using sizeOf for both dimensions
class ResponsiveBoxWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final size = MediaQuery.sizeOf(context);
    return SizedBox(width: size.width, height: size.height);
  }
}

// Good: using dedicated MediaQuery methods
class DeviceInfoWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final textScaleFactor = MediaQuery.of(context).textScaleFactor;
    final orientation = MediaQuery.of(context).orientation;
    return Column(
      children: [
        Text('Scale: $textScaleFactor'),
        Text('Orientation: $orientation'),
      ],
    );
  }
}

Configure prefer-dedicated-media-query-methods

Set its severity in falcon.json. See the configuration guide.

falcon.jsonjson
{
  "linter": {
    "rules": {
      "style": {
        "prefer-dedicated-media-query-methods": "error"
      }
    }
  }
}

Or silence one occurrence with a suppression comment; the reason is required.

example.dartdart
// falcon-ignore lint/style/prefer-dedicated-media-query-methods: <reason>
  • prefer-double-quotesprefer_double_quotes

    Flags single-quoted string literals that could use double quotes without needing an escape.

  • prefer-early-return

    Flags a trailing if that wraps multiple statements in a void function.

  • prefer-equatable-mixinequatable

    Prefer EquatableMixin to directly extending package:equatable's Equatable.

  • prefer-final-fieldsprefer_final_fieldsrecommended

    Flags a private field that is initialized but never reassigned, so it could be final (prefer-final-fields, adopted from package:lints).

  • prefer-final-in-for-eachprefer_final_in_for_eachrecommended

    Prefer final for a for-each loop variable that is never reassigned.

  • prefer-final-localsprefer_final_localsrecommended

    Prefer final for local variable declarations that are never reassigned.

  • prefer-final-parametersprefer_final_parameters

    Prefer final for parameters that are never reassigned.

  • prefer-firstprefer-first

    Flags [0] index access that should use the .first getter.