45 lines
1.3 KiB
Dart
45 lines
1.3 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:responsive_framework/responsive_framework.dart';
|
|
|
|
class AppBreakpoints {
|
|
AppBreakpoints._();
|
|
|
|
static const double mobile = 0;
|
|
static const double tablet = 600;
|
|
static const double desktop = 1024;
|
|
static const double wide = 1440;
|
|
}
|
|
|
|
extension ResponsiveContext on BuildContext {
|
|
bool get isMobile => ResponsiveBreakpoints.of(this).isMobile;
|
|
bool get isTablet => ResponsiveBreakpoints.of(this).isTablet;
|
|
bool get isDesktop => ResponsiveBreakpoints.of(this).largerThan(TABLET);
|
|
bool get isWide => ResponsiveBreakpoints.of(this).largerThan(DESKTOP);
|
|
|
|
double get contentMaxWidth {
|
|
if (isWide) return 1400;
|
|
if (isDesktop) return 1200;
|
|
return double.infinity;
|
|
}
|
|
|
|
/// Form grid columns: 4 on medium+, 2 on small screens.
|
|
int get formGridColumns {
|
|
final width = MediaQuery.sizeOf(this).width;
|
|
return formGridColumnsForWidth(width);
|
|
}
|
|
}
|
|
|
|
/// Responsive form field columns based on viewport width.
|
|
int formGridColumnsForWidth(
|
|
double width, {
|
|
int smallColumns = 2,
|
|
int mediumColumns = 4,
|
|
int largeColumns = 4,
|
|
double mediumBreakpoint = AppBreakpoints.tablet,
|
|
double largeBreakpoint = AppBreakpoints.desktop,
|
|
}) {
|
|
if (width >= largeBreakpoint) return largeColumns;
|
|
if (width >= mediumBreakpoint) return mediumColumns;
|
|
return smallColumns;
|
|
}
|