Flutter app resizing on different devices

183 Views Asked by At

I installed my app on 2 different devices, the problem is both devices show different widget sizes. Both devices have different screen sizes.

  1. The expected result -> image1 from Moto One Fusion+

  1. image2 from OnePlus 6pro

main.dart code ->

void main() {
  runApp(BmiApp());
}

class BmiApp extends StatelessWidget {
  const BmiApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      routes: {
        '/input': (context) => InputPage(),
        '/calculate': (context) => CalculatedResult(),
      },
      theme: ThemeData.dark().copyWith(
        appBarTheme: AppBarTheme(
          color: Color(0xFF0A1234),
        ),
        scaffoldBackgroundColor: Color(0xFF0A1234),
      ),
      initialRoute: '/input',
    );
  }
}

input_page.dart code ->

class InputPage extends StatefulWidget {
  const InputPage({Key? key}) : super(key: key);

  @override
  State<InputPage> createState() => _InputPageState();
}

class _InputPageState extends State<InputPage> {
@override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        appBar: AppBar(
          title: Text('BMI Calculator'),
          centerTitle: true,
        ),
        body:Column(),
      ),
    );
  }
}

Inside column I have stacked all the widgets. Github link for complete code

0

There are 0 best solutions below