github/flutter
7
0
Fork 0
mirror of https://github.com/flutter/flutter.git synced 2025-06-03 00:51:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

Enhances intuitiveness of RawMagnifier's example (#150308)

Browse Source 
### Demo

| Before | After |
| --------------- | --------------- |
<video src="https://github.com/flutter/flutter/assets/104349824/ee6d45f1-bcf0-4136-8d1d-a642e0767322"/> | <video src="https://github.com/flutter/flutter/assets/104349824/1e2bb33d-40f1-4cf6-9999-f67bef638633"/>

### Related issue

Fixes https://github.com/flutter/flutter/issues/150307
This commit is contained in:
Huy 2024-07-19 17:09:18 +03:00 committed by GitHub
parent 89c88ae8e8
commit 7d5c1c04fb
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 29 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
examples/api/lib/widgets/magnifier/magnifier.0.dart
View File

@ -14,7 +14,8 @@ class MagnifierExampleApp extends StatefulWidget {
} }
class _MagnifierExampleAppState extends State<MagnifierExampleApp> { class _MagnifierExampleAppState extends State<MagnifierExampleApp> {
Offset dragGesturePosition = Offset.zero; static const double magnifierRadius = 50.0;
Offset dragGesturePosition = const Offset(100, 100);
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
@ -34,18 +35,23 @@ class _MagnifierExampleAppState extends State<MagnifierExampleApp> {
dragGesturePosition = details.localPosition; dragGesturePosition = details.localPosition;
}, },
), ),
onPanDown: (DragDownDetails details) => setState(
() {
dragGesturePosition = details.localPosition;
},
),
child: const FlutterLogo(size: 200), child: const FlutterLogo(size: 200),
), ),
Positioned( Positioned(
left: dragGesturePosition.dx, left: dragGesturePosition.dx - magnifierRadius,
top: dragGesturePosition.dy, top: dragGesturePosition.dy - magnifierRadius,
child: const RawMagnifier( child: const RawMagnifier(
decoration: MagnifierDecoration( decoration: MagnifierDecoration(
shape: CircleBorder( shape: CircleBorder(
side: BorderSide(color: Colors.pink, width: 3), side: BorderSide(color: Colors.pink, width: 3),
), ),
), ),
size: Size(100, 100), size: Size(magnifierRadius * 2, magnifierRadius * 2),
magnificationScale: 2, magnificationScale: 2,
), ),
) )

33
examples/api/test/widgets/magnifier/magnifier.0_test.dart
View File

@ -19,33 +19,38 @@ void main() {
); );
} }
expect( // Make sure magnifier is present.
tester.widget(find.byType(Positioned)), final Finder positionedWidget = find.byType(Positioned);
isPositionedAt(Offset.zero), final Widget positionedWidgetInTree = tester.widget(positionedWidget);
); final Positioned oldConcretePositioned = positionedWidgetInTree as Positioned;
expect(positionedWidget, findsOneWidget);
final Offset centerOfFlutterLogo = tester.getCenter(find.byType(Positioned)); // Confirm if magnifier is in the center of the FlutterLogo.
final Offset topLeftOfFlutterLogo = tester.getTopLeft(find.byType(FlutterLogo)); final Offset centerOfPositioned = tester.getCenter(positionedWidget);
final Offset centerOfFlutterLogo = tester.getCenter(find.byType(FlutterLogo));
expect(centerOfPositioned, equals(centerOfFlutterLogo));
// Drag the magnifier and confirm its new position is expected.
const Offset dragDistance = Offset(10, 10); const Offset dragDistance = Offset(10, 10);
final Offset updatedPositioned = Offset(
await tester.dragFrom(centerOfFlutterLogo, dragDistance); oldConcretePositioned.left ?? 0.0 + 10.0,
oldConcretePositioned.top ?? 0.0 + 10.0,
);
await tester.dragFrom(centerOfPositioned, dragDistance);
await tester.pump(); await tester.pump();
expect( expect(
tester.widget(find.byType(Positioned)), positionedWidgetInTree,
// Need to adjust by the topleft since the position is local. isPositionedAt(updatedPositioned),
isPositionedAt((centerOfFlutterLogo - topLeftOfFlutterLogo) + dragDistance),
); );
}); });
testWidgets('should match golden', (WidgetTester tester) async { testWidgets('should match golden', (WidgetTester tester) async {
await tester.pumpWidget(const example.MagnifierExampleApp()); await tester.pumpWidget(const example.MagnifierExampleApp());
final Offset centerOfFlutterLogo = tester.getCenter(find.byType(Positioned)); final Offset centerOfPositioned = tester.getCenter(find.byType(Positioned));
const Offset dragDistance = Offset(10, 10); const Offset dragDistance = Offset(10, 10);
await tester.dragFrom(centerOfFlutterLogo, dragDistance); await tester.dragFrom(centerOfPositioned, dragDistance);
await tester.pump(); await tester.pump();
await expectLater( await expectLater(