75 lines
2.0 KiB
Dart
75 lines
2.0 KiB
Dart
import 'package:flutter/material.dart';
|
|
|
|
class ResponsiveBreakpoints {
|
|
static const double mobile = 768.0;
|
|
static const double desktop = 1024.0;
|
|
static const double wideDesktop = 1440.0;
|
|
}
|
|
|
|
class ResponsiveLayout {
|
|
static bool isMobile(BuildContext context) =>
|
|
MediaQuery.sizeOf(context).width < ResponsiveBreakpoints.mobile;
|
|
|
|
static bool isTablet(BuildContext context) {
|
|
final width = MediaQuery.sizeOf(context).width;
|
|
return width >= ResponsiveBreakpoints.mobile && width < ResponsiveBreakpoints.desktop;
|
|
}
|
|
|
|
static bool isDesktop(BuildContext context) =>
|
|
MediaQuery.sizeOf(context).width >= ResponsiveBreakpoints.mobile;
|
|
|
|
static bool isWideDesktop(BuildContext context) =>
|
|
MediaQuery.sizeOf(context).width >= ResponsiveBreakpoints.wideDesktop;
|
|
}
|
|
|
|
class MaxContentWidth extends StatelessWidget {
|
|
final Widget child;
|
|
final double maxWidth;
|
|
final EdgeInsetsGeometry padding;
|
|
|
|
const MaxContentWidth({
|
|
super.key,
|
|
required this.child,
|
|
this.maxWidth = 1200.0,
|
|
this.padding = EdgeInsets.zero,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Center(
|
|
child: ConstrainedBox(
|
|
constraints: BoxConstraints(maxWidth: maxWidth),
|
|
child: Padding(
|
|
padding: padding,
|
|
child: child,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
class ResponsiveBuilder extends StatelessWidget {
|
|
final Widget Function(BuildContext context) mobile;
|
|
final Widget Function(BuildContext context)? tablet;
|
|
final Widget Function(BuildContext context) desktop;
|
|
|
|
const ResponsiveBuilder({
|
|
super.key,
|
|
required this.mobile,
|
|
this.tablet,
|
|
required this.desktop,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final width = MediaQuery.sizeOf(context).width;
|
|
if (width >= ResponsiveBreakpoints.desktop) {
|
|
return desktop(context);
|
|
} else if (width >= ResponsiveBreakpoints.mobile) {
|
|
return (tablet ?? desktop)(context);
|
|
} else {
|
|
return mobile(context);
|
|
}
|
|
}
|
|
}
|