Skip to content

Commit

Permalink
Update ResponsiveFramework v1.2.0
Browse files Browse the repository at this point in the history
  • Loading branch information
@rayliverified
rayliverified committed Feb 24, 2024
1 parent 05c2400 commit 1471d3b
Show file tree
Hide file tree
Showing 5 changed files with 49 additions and 38 deletions.
7 changes: 4 additions & 3 deletions lib/components/spacing.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,12 +16,13 @@ const List<Condition> blockWidthConstraints = [
Condition.largerThan(name: TABLET, value: BoxConstraints(maxWidth: 1280)),
];

EdgeInsets blockPadding(BuildContext context) => ResponsiveValue(context,
EdgeInsets blockPadding(BuildContext context) =>
ResponsiveValue<EdgeInsets>(context,
defaultValue: const EdgeInsets.symmetric(horizontal: 55, vertical: 80),
valueWhen: [
conditionalValues: [
const Condition.smallerThan(
name: TABLET,
value: EdgeInsets.symmetric(horizontal: 15, vertical: 45))
]).value!;
]).value;

const EdgeInsets blockMargin = EdgeInsets.fromLTRB(10, 0, 10, 32);
48 changes: 29 additions & 19 deletions lib/main.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import 'package:flutter_website/ui/block_wrapper.dart';
import 'package:flutter_website/ui/carousel/carousel.dart';
import 'package:responsive_framework/responsive_framework.dart';

import 'components/components.dart';
import 'ui/blocks.dart';

void main() {
Expand All @@ -16,18 +15,23 @@ class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
builder: (context, widget) => ResponsiveWrapper.builder(
ClampingScrollWrapper.builder(context, widget!),
defaultScale: true,
minWidth: 480,
defaultName: MOBILE,
breakpoints: [
const ResponsiveBreakpoint.autoScale(480, name: MOBILE),
const ResponsiveBreakpoint.resize(600, name: MOBILE),
const ResponsiveBreakpoint.resize(850, name: TABLET),
const ResponsiveBreakpoint.resize(1080, name: DESKTOP),
],
background: Container(color: background)),
builder: (context, widget) => ResponsiveBreakpoints.builder(
child: Builder(builder: (context) {
return ResponsiveScaledBox(
width: ResponsiveValue<double?>(context,
defaultValue: null,
conditionalValues: [
const Condition.equals(name: 'MOBILE_SMALL', value: 480),
]).value,
child: ClampingScrollWrapper.builder(context, widget!));
}),
breakpoints: [
const Breakpoint(start: 0, end: 480, name: 'MOBILE_SMALL'),
const Breakpoint(start: 481, end: 850, name: MOBILE),
const Breakpoint(start: 850, end: 1080, name: TABLET),
const Breakpoint(start: 1081, end: double.infinity, name: DESKTOP),
],
),
home: Scaffold(
appBar: const PreferredSize(
preferredSize: Size(double.infinity, 66), child: WebsiteMenuBar()),
Expand All @@ -43,12 +47,18 @@ class MyApp extends StatelessWidget {
}

List<Widget> blocks = [
ResponsiveWrapper(
maxWidth: 1200,
minWidth: 1200,
defaultScale: true,
mediaQueryData: const MediaQueryData(size: Size(1200, 640)),
child: RepaintBoundary(child: Carousel())),
MaxWidthBox(
maxWidth: 1200,
child: FittedBox(
fit: BoxFit.fitWidth,
alignment: Alignment.topCenter,
child: Container(
width: 1200,
height: 640,
alignment: Alignment.center,
child: RepaintBoundary(child: Carousel())),
),
),
const BlockWrapper(GetStarted()),
const BlockWrapper(Features()),
const BlockWrapper(FastDevelopment()),
Expand Down
2 changes: 1 addition & 1 deletion lib/ui/block_wrapper.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ class BlockWrapper extends StatelessWidget {
Widget build(BuildContext context) {
return Center(
child: ResponsiveConstraints(
constraintsWhen: blockWidthConstraints, child: widget),
conditionalConstraints: blockWidthConstraints, child: widget),
);
}
}
28 changes: 14 additions & 14 deletions lib/ui/blocks.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ class WebsiteMenuBar extends StatelessWidget {
const Spacer(),
ResponsiveVisibility(
visible: false,
visibleWhen: const [Condition.largerThan(name: MOBILE)],
visibleConditions: const [Condition.largerThan(name: MOBILE)],
child: MouseRegion(
cursor: SystemMouseCursors.click,
child: GestureDetector(
Expand All @@ -61,7 +61,7 @@ class WebsiteMenuBar extends StatelessWidget {
),
ResponsiveVisibility(
visible: false,
visibleWhen: const [Condition.largerThan(name: MOBILE)],
visibleConditions: const [Condition.largerThan(name: MOBILE)],
child: MouseRegion(
cursor: SystemMouseCursors.click,
child: GestureDetector(
Expand All @@ -79,7 +79,7 @@ class WebsiteMenuBar extends StatelessWidget {
),
ResponsiveVisibility(
visible: false,
visibleWhen: const [Condition.largerThan(name: MOBILE)],
visibleConditions: const [Condition.largerThan(name: MOBILE)],
child: MouseRegion(
cursor: SystemMouseCursors.click,
child: GestureDetector(
Expand All @@ -96,7 +96,7 @@ class WebsiteMenuBar extends StatelessWidget {
),
const ResponsiveVisibility(
visible: false,
visibleWhen: [Condition.largerThan(name: MOBILE)],
visibleConditions: [Condition.largerThan(name: MOBILE)],
child: MouseRegion(
cursor: SystemMouseCursors.click,
child: Padding(
Expand Down Expand Up @@ -149,7 +149,7 @@ class WebsiteMenuBar extends StatelessWidget {
),
ResponsiveVisibility(
visible: false,
visibleWhen: const [Condition.largerThan(name: MOBILE)],
visibleConditions: const [Condition.largerThan(name: MOBILE)],
child: Padding(
padding: const EdgeInsets.only(left: 8, right: 0),
child: TextButton(
Expand Down Expand Up @@ -290,7 +290,7 @@ class GetStarted extends StatelessWidget {
Padding(
padding: const EdgeInsets.only(bottom: 32),
child: ResponsiveRowColumn(
layout: ResponsiveWrapper.of(context).isSmallerThan(DESKTOP)
layout: ResponsiveBreakpoints.of(context).smallerThan(DESKTOP)
? ResponsiveRowColumnType.COLUMN
: ResponsiveRowColumnType.ROW,
rowMainAxisAlignment: MainAxisAlignment.center,
Expand Down Expand Up @@ -468,7 +468,7 @@ class Features extends StatelessWidget {
border: Border.all(color: border)),
margin: blockMargin,
child: ResponsiveRowColumn(
layout: ResponsiveWrapper.of(context).isSmallerThan(DESKTOP)
layout: ResponsiveBreakpoints.of(context).smallerThan(DESKTOP)
? ResponsiveRowColumnType.COLUMN
: ResponsiveRowColumnType.ROW,
rowCrossAxisAlignment: CrossAxisAlignment.start,
Expand Down Expand Up @@ -616,7 +616,7 @@ class _FastDevelopmentState extends State<FastDevelopment> {
margin: blockMargin,
padding: blockPadding(context),
child: ResponsiveRowColumn(
layout: ResponsiveWrapper.of(context).isSmallerThan(DESKTOP)
layout: ResponsiveBreakpoints.of(context).smallerThan(DESKTOP)
? ResponsiveRowColumnType.COLUMN
: ResponsiveRowColumnType.ROW,
rowCrossAxisAlignment: CrossAxisAlignment.start,
Expand Down Expand Up @@ -740,7 +740,7 @@ class _BeautifulUIState extends State<BeautifulUI> {
margin: blockMargin,
padding: blockPadding(context),
child: ResponsiveRowColumn(
layout: ResponsiveWrapper.of(context).isSmallerThan(DESKTOP)
layout: ResponsiveBreakpoints.of(context).smallerThan(DESKTOP)
? ResponsiveRowColumnType.COLUMN
: ResponsiveRowColumnType.ROW,
rowCrossAxisAlignment: CrossAxisAlignment.start,
Expand Down Expand Up @@ -862,7 +862,7 @@ class _NativePerformanceState extends State<NativePerformance> {
margin: blockMargin,
padding: blockPadding(context),
child: ResponsiveRowColumn(
layout: ResponsiveWrapper.of(context).isSmallerThan(DESKTOP)
layout: ResponsiveBreakpoints.of(context).smallerThan(DESKTOP)
? ResponsiveRowColumnType.COLUMN
: ResponsiveRowColumnType.ROW,
rowCrossAxisAlignment: CrossAxisAlignment.start,
Expand Down Expand Up @@ -995,7 +995,7 @@ class _LearnFromDevelopersState extends State<LearnFromDevelopers> {
margin: blockMargin,
padding: blockPadding(context),
child: ResponsiveRowColumn(
layout: ResponsiveWrapper.of(context).isSmallerThan(DESKTOP)
layout: ResponsiveBreakpoints.of(context).smallerThan(DESKTOP)
? ResponsiveRowColumnType.COLUMN
: ResponsiveRowColumnType.ROW,
rowCrossAxisAlignment: CrossAxisAlignment.start,
Expand Down Expand Up @@ -1080,7 +1080,7 @@ class WhoUsesFlutter extends StatelessWidget {
margin: blockMargin,
padding: blockPadding(context),
child: ResponsiveRowColumn(
layout: ResponsiveWrapper.of(context).isSmallerThan(DESKTOP)
layout: ResponsiveBreakpoints.of(context).smallerThan(DESKTOP)
? ResponsiveRowColumnType.COLUMN
: ResponsiveRowColumnType.ROW,
rowCrossAxisAlignment: CrossAxisAlignment.center,
Expand Down Expand Up @@ -1140,7 +1140,7 @@ class FlutterNewsRow extends StatelessWidget {
return Container(
margin: blockMargin,
child: ResponsiveRowColumn(
layout: ResponsiveWrapper.of(context).isSmallerThan(DESKTOP)
layout: ResponsiveBreakpoints.of(context).smallerThan(DESKTOP)
? ResponsiveRowColumnType.COLUMN
: ResponsiveRowColumnType.ROW,
rowCrossAxisAlignment: CrossAxisAlignment.start,
Expand Down Expand Up @@ -1473,7 +1473,7 @@ class Footer extends StatelessWidget {
width: double.infinity,
padding: const EdgeInsets.symmetric(horizontal: 25),
child: ResponsiveRowColumn(
layout: ResponsiveWrapper.of(context).isMobile
layout: ResponsiveBreakpoints.of(context).isMobile
? ResponsiveRowColumnType.COLUMN
: ResponsiveRowColumnType.ROW,
columnMainAxisSize: MainAxisSize.min,
Expand Down
2 changes: 1 addition & 1 deletion responsive_framework
Submodule responsive_framework updated 21 files
+4 −21 .gitignore
+6 −0 .run/main.dart.run.xml
+53 −82 CHANGELOG.md
+1 −1 LICENSE
+84 −25 README.md
+1 −1 example
+40 −0 lib/breakpoint.dart
+43 −0 lib/max_width_box.dart
+421 −0 lib/responsive_breakpoints.dart
+4 −1 lib/responsive_framework.dart
+8 −6 lib/responsive_row_column.dart
+135 −0 lib/responsive_scaled_box.dart
+119 −105 lib/responsive_value.dart
+0 −1,307 lib/responsive_wrapper.dart
+26 −53 lib/utils/responsive_utils.dart
+34 −10 lib/utils/scroll_behavior.dart
+221 −0 migration_0.2.0_to_1.0.0.md
+5 −5 pubspec.yaml
+0 −893 test/responsive_breakpoint_test.dart
+0 −53 test/responsive_utils_test.dart
+0 −1,382 test/responsive_wrapper_test.dart

0 comments on commit 1471d3b

Please sign in to comment.