Reputation: 81
Building a flutter app. I want one page to display in landscape, and the rest of the app to display in portrait. I can make that happen using techniques that I've found here and elsewhere, but it doesn't work very well. On initially entering the landscape screen, there's a kind of "shudder" while the app seems to be figuring out what to do. Then it displays ok. But on going back, the original screen first is displayed in landscape for a considerable time (nearly a second), and then there's another "shudder" before the screen is displayed in portrait. Simplified main.dart below. What am I doing wrong?
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
void main() => runApp(MyApp());
class ScreenOne extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('screen one'),
),
body: Column(
children: <Widget>[
Center(
child: Text('some text'),
),
RaisedButton(
child: Text('Go to screen two'),
onPressed: () {
Navigator.pushNamed(
context,
'screenTwo',
);
},
)
],
),
);
}
}
class ScreenTwo extends StatefulWidget {
@override
_ScreenTwoState createState() => _ScreenTwoState();
}
class _ScreenTwoState extends State<ScreenTwo> {
@override
void dispose() {
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
]);
super.dispose();
}
@override
Widget build(BuildContext context) {
if (MediaQuery.of(context).orientation != null) {
SystemChrome.setPreferredOrientations([
DeviceOrientation.landscapeLeft,
]);
}
return Scaffold(
appBar: AppBar(
title: Text('screen two'),
),
body: Center(
child: Text('other text'),
),
);
}
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: ScreenOne(),
routes: {
'screenTwo': (ctx) => ScreenTwo(),
},
);
}
}
Upvotes: 1
Views: 1401
Reputation: 34210
Modify your second screen like this
return WillPopScope(
onWillPop: () {
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
]);
Navigator.of(context).pop();
//we need to return a future
return Future.value(false);
},
child: Scaffold(
appBar: AppBar(
title: Text('screen two'),
),
body: Center(
child: Text('other text'),
),
),
);
Upvotes: 1