-
Notifications
You must be signed in to change notification settings - Fork 157
Closed
Description
I noticed that the breakpoint value will be null on initial build and a subsequent build update would have the breakpoint value. This would cause a sudden change on the screen which is most noticeable when using the SingleChildScrollView widget. I used an iPad (10th generation) simulator and ran Flutter's hot restart multiple times to see the screen changing size. This is happening on v1.0.0 to v1.1.1.
Print logs:
flutter: MediaQuery width: 1180.0
flutter: breakpoint: Breakpoint(start: 0.0, end: 0.0, name: null)
flutter: isDesktop: false
flutter: isTablet: false
flutter: isMobile: false
flutter: isPhone: false
flutter: -=-=-=-=-=-=-=-=
flutter: MediaQuery width: 700.0
flutter: breakpoint: Breakpoint(start: 801.0, end: 1920.0, name: DESKTOP)
flutter: isDesktop: true
flutter: isTablet: false
flutter: isMobile: false
flutter: isPhone: false
flutter: -=-=-=-=-=-=-=-=
Code:
import 'package:flutter/material.dart';
import 'package:responsive_framework/responsive_framework.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
useMaterial3: true,
),
builder: (context, child) => ResponsiveBreakpoints.builder(
child: child!,
breakpoints: [
const Breakpoint(start: 0, end: 450, name: MOBILE),
const Breakpoint(start: 451, end: 800, name: TABLET),
const Breakpoint(start: 801, end: 1920, name: DESKTOP),
const Breakpoint(start: 1921, end: double.infinity, name: '4K'),
],
),
onGenerateRoute: (RouteSettings settings) {
return MaterialPageRoute(
builder: (context) {
return MaxWidthBox(
maxWidth: 1200,
background: Container(color: const Color(0xFFF5F5F5)),
child: ResponsiveScaledBox(
width: ResponsiveValue<double>(
context,
conditionalValues: [
Condition.equals(name: MOBILE, value: 450),
Condition.between(start: 800, end: 1100, value: 800),
Condition.between(start: 1000, end: 1200, value: 700),
],
).value,
child: BouncingScrollWrapper.builder(
context,
const MyHomePage(title: 'Flutter Demo Home Page'),
dragWithMouse: true,
),
),
);
},
);
},
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
print('MediaQuery width: ${MediaQuery.of(context).size.width}');
print('breakpoint: ${ResponsiveBreakpoints.of(context).breakpoint}');
print('isDesktop: ${ResponsiveBreakpoints.of(context).isDesktop}');
print('isTablet: ${ResponsiveBreakpoints.of(context).isTablet}');
print('isMobile: ${ResponsiveBreakpoints.of(context).isMobile}');
print('isPhone: ${ResponsiveBreakpoints.of(context).isPhone}');
print('-=-=-=-=-=-=-=-=');
return Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
title: Text(widget.title),
),
body: SingleChildScrollView(
child: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headlineMedium,
),
],
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: const Icon(Icons.add),
),
);
}
}
BoudyNEON
Metadata
Metadata
Assignees
Labels
No labels