You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

38 lines
932 B

2 years ago
  1. import 'dart:developer';
  2. import 'package:flutter/material.dart';
  3. class ResponsiveLayout extends StatelessWidget {
  4. const ResponsiveLayout({
  5. Key? key,
  6. required this.largeChild,
  7. this.mediumChild,
  8. this.smallChild,
  9. this.largeBreakPoint = 1200.0,
  10. this.mediumBreakPoint = 580.0,
  11. }) : super(key: key);
  12. final Widget largeChild;
  13. final Widget? mediumChild;
  14. final Widget? smallChild;
  15. final double largeBreakPoint;
  16. final double mediumBreakPoint;
  17. @override
  18. Widget build(BuildContext context) {
  19. final smallestWidth = MediaQuery.of(context).size.width;
  20. log('width: $smallestWidth');
  21. return AnimatedSwitcher(
  22. duration: const Duration(milliseconds: 300),
  23. child: smallestWidth >= largeBreakPoint
  24. ? largeChild
  25. : smallestWidth >= mediumBreakPoint
  26. ? mediumChild ?? largeChild
  27. : smallChild ?? mediumChild ?? largeChild,
  28. );
  29. }
  30. }