Repository navigation
feat(transitions): modern transitions & motion (Material 3, Cupertino, WCAG & Pure Widgets example) - #11
Merged
Conversation
…gets example - Add Material 3 motion transitions (fade_through, fade_scale, shared_axis_x/y/z, scale) - Add authentic iOS 16-18 Cupertino transition (slide_cupertino with 1/3 parallax & edge shadow) - Add CustomBuildTransition support across BrowserRoute and TraceRoute - Add platform-adaptive transition default (Browser.defaultAdaptiveTransition) - Add zero-config reduced motion / WCAG accessibility bypass - Add RepaintBoundary rendering isolation to route transitions - Fix Banner hit-testing pass-through and OverlayModal secondary animation - Refactor example to 100% pure widgets.dart with interactive duration: Duration.zero banner - Add comprehensive unit & widget tests (99 passing tests, >95% coverage)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
📝 Overview
This PR implements version 0.3.0 of
browser_router, adding comprehensive support for modern Material 3 Transitions, authentic iOS 16–18 Cupertino Motion, custom transition builders, platform adaptivity, zero-configuration WCAG reduced-motion accessibility, overlay hit-testing fixes, and a purepackage:flutter/widgets.dartexample app.🚀 Key Features & Improvements
1. Modern Transitions Catalog (
RouteTransition)fade_through: Material 3 top-level tab/bar transition (scale 0.92 -> 1.0 with staggered fades).shared_axis_x: Directional horizontal slide & fade for wizards/linear steps.shared_axis_y: Directional vertical slide & fade for expansions.shared_axis_z: Depth zoom (0.8 -> 1.0 / 1.0 -> 1.1) for drill-down flows.scale: Smooth scale & fade transition for popup/modal dialogs.slide_cupertino: Authentic iOS push with left-edge gradient drop shadow and 1/3 horizontal parallax on the exiting route.fade_scale: Snappy SPA zoom-fade (0.95 -> 1.0) with fast easing.2. Custom Transition Builders (
CustomBuildTransition)CustomBuildTransitionaccepting any({required Animation<double> animation, required Animation<double> secondaryAnimation, required Widget child}).customTransitionparameter toBrowserRoute,TraceRoute,PageTraceRoute,PopupTraceRoute,SwipeTraceRoute, andOverlayTraceRoute.3. Platform Adaptivity & WCAG Accessibility
Browser.defaultAdaptiveTransition: Detects target platform automatically (Cupertino on iOS/macOS, Shared Axis X on Android/Fuchsia, Fade Scale on Web/Desktop).MediaQuery.disableAnimationsOf(context)andMediaQuery.accessibleNavigationOf(context)to bypass animations with zero configuration.RepaintBoundaryto isolate repaint boundaries and prevent ancestor re-renders during motion.4. Overlay & Banner Improvements
Banner, allowing seamless pass-through scrolling and clicking on underlying screens.OverlayModalsecondary animation to returnkAlwaysDismissedAnimation, avoiding visual translation / collision box misalignment.5. Pure
widgets.dartExample Appexample/to 100% purepackage:flutter/widgets.dart, completely decoupled from Material/Cupertino libraries.duration: Duration.zero) with close button.🧪 Quality & Verification
flutter analyze: 0 issues found across package and example.flutter test: 99/99 tests passing with >95% overall test coverage.README.md,CHANGELOG.md, and version bump to0.3.0inpubspec.yaml.