Flutter Basic Responsiveness

main.dart

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Layout(),
      ),
    );
  }
}



class Box extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var screenWidth = MediaQuery.of(context).size.width;
    double boxSize = 132;
    Color boxColor = Color.fromRGBO(133, 162, 163, 1);
    if (screenWidth > 600) {
      boxSize = 264;
      boxColor = Color.fromRGBO(23, 114, 117, 1);
    }

    return Container(
        child: Text("Box"), width: boxSize, height: boxSize, color: boxColor);
  }
}

class Layout extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Row(
        mainAxisSize: MainAxisSize.max,
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [Box()]);
  }
}