page_test.dart 20.9 KB
Newer Older
Ian Hickson's avatar
Ian Hickson committed
1
// Copyright 2014 The Flutter Authors. All rights reserved.
2 3 4 5 6 7 8
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

import 'package:flutter/cupertino.dart';
import 'package:flutter_test/flutter_test.dart';

void main() {
Ian Hickson's avatar
Ian Hickson committed
9
  testWidgets('test iOS page transition (LTR)', (WidgetTester tester) async {
10
    await tester.pumpWidget(
11
      CupertinoApp(
12
        onGenerateRoute: (RouteSettings settings) {
13
          return CupertinoPageRoute<void>(
14 15
            settings: settings,
            builder: (BuildContext context) {
Ian Hickson's avatar
Ian Hickson committed
16
              final String pageNumber = settings.name == '/' ? '1' : '2';
17
              return Center(child: Text('Page $pageNumber'));
18
            },
19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34
          );
        },
      ),
    );

    final Offset widget1InitialTopLeft = tester.getTopLeft(find.text('Page 1'));

    tester.state<NavigatorState>(find.byType(Navigator)).pushNamed('/next');

    await tester.pump();
    await tester.pump(const Duration(milliseconds: 150));

    Offset widget1TransientTopLeft = tester.getTopLeft(find.text('Page 1'));
    Offset widget2TopLeft = tester.getTopLeft(find.text('Page 2'));

    // Page 1 is moving to the left.
35
    expect(widget1TransientTopLeft.dx, lessThan(widget1InitialTopLeft.dx));
36
    // Page 1 isn't moving vertically.
37
    expect(widget1TransientTopLeft.dy, equals(widget1InitialTopLeft.dy));
38
    // iOS transition is horizontal only.
39
    expect(widget1InitialTopLeft.dy, equals(widget2TopLeft.dy));
40
    // Page 2 is coming in from the right.
41
    expect(widget2TopLeft.dx, greaterThan(widget1InitialTopLeft.dx));
42

43
    // Will need to be changed if the animation curve or duration changes.
44
    expect(widget1TransientTopLeft.dx, moreOrLessEquals(158, epsilon: 1.0));
45

46 47 48 49 50 51 52 53 54 55 56 57 58 59
    await tester.pumpAndSettle();

    // Page 2 covers page 1.
    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    tester.state<NavigatorState>(find.byType(Navigator)).pop();
    await tester.pump();
    await tester.pump(const Duration(milliseconds: 100));

    widget1TransientTopLeft = tester.getTopLeft(find.text('Page 1'));
    widget2TopLeft = tester.getTopLeft(find.text('Page 2'));

    // Page 1 is coming back from the left.
60
    expect(widget1TransientTopLeft.dx, lessThan(widget1InitialTopLeft.dx));
61
    // Page 1 isn't moving vertically.
62
    expect(widget1TransientTopLeft.dy, equals(widget1InitialTopLeft.dy));
63
    // iOS transition is horizontal only.
64
    expect(widget1InitialTopLeft.dy, equals(widget2TopLeft.dy));
65
    // Page 2 is leaving towards the right.
66
    expect(widget2TopLeft.dx, greaterThan(widget1InitialTopLeft.dx));
67

68
    // Will need to be changed if the animation curve or duration changes.
69
    expect(widget1TransientTopLeft.dx, moreOrLessEquals(220, epsilon: 1.0));
70

71 72 73 74 75 76 77 78
    await tester.pumpAndSettle();

    expect(find.text('Page 1'), isOnstage);
    expect(find.text('Page 2'), findsNothing);

    widget1TransientTopLeft = tester.getTopLeft(find.text('Page 1'));

    // Page 1 is back where it started.
79
    expect(widget1InitialTopLeft, equals(widget1TransientTopLeft));
80 81
  });

Ian Hickson's avatar
Ian Hickson committed
82 83
  testWidgets('test iOS page transition (RTL)', (WidgetTester tester) async {
    await tester.pumpWidget(
84
      CupertinoApp(
85
        localizationsDelegates: const <LocalizationsDelegate<dynamic>>[
86
          RtlOverrideWidgetsDelegate(),
Ian Hickson's avatar
Ian Hickson committed
87 88
        ],
        onGenerateRoute: (RouteSettings settings) {
89
          return CupertinoPageRoute<void>(
Ian Hickson's avatar
Ian Hickson committed
90 91 92
            settings: settings,
            builder: (BuildContext context) {
              final String pageNumber = settings.name == '/' ? '1' : '2';
93
              return Center(child: Text('Page $pageNumber'));
94
            },
Ian Hickson's avatar
Ian Hickson committed
95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152
          );
        },
      ),
    );
    await tester.pump(); // to load the localization, since it doesn't use a synchronous future

    final Offset widget1InitialTopLeft = tester.getTopLeft(find.text('Page 1'));

    tester.state<NavigatorState>(find.byType(Navigator)).pushNamed('/next');

    await tester.pump();
    await tester.pump(const Duration(milliseconds: 150));

    Offset widget1TransientTopLeft = tester.getTopLeft(find.text('Page 1'));
    Offset widget2TopLeft = tester.getTopLeft(find.text('Page 2'));

    // Page 1 is moving to the right.
    expect(widget1TransientTopLeft.dx, greaterThan(widget1InitialTopLeft.dx));
    // Page 1 isn't moving vertically.
    expect(widget1TransientTopLeft.dy, equals(widget1InitialTopLeft.dy));
    // iOS transition is horizontal only.
    expect(widget1InitialTopLeft.dy, equals(widget2TopLeft.dy));
    // Page 2 is coming in from the left.
    expect(widget2TopLeft.dx, lessThan(widget1InitialTopLeft.dx));

    await tester.pumpAndSettle();

    // Page 2 covers page 1.
    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    tester.state<NavigatorState>(find.byType(Navigator)).pop();
    await tester.pump();
    await tester.pump(const Duration(milliseconds: 100));

    widget1TransientTopLeft = tester.getTopLeft(find.text('Page 1'));
    widget2TopLeft = tester.getTopLeft(find.text('Page 2'));

    // Page 1 is coming back from the right.
    expect(widget1TransientTopLeft.dx, greaterThan(widget1InitialTopLeft.dx));
    // Page 1 isn't moving vertically.
    expect(widget1TransientTopLeft.dy, equals(widget1InitialTopLeft.dy));
    // iOS transition is horizontal only.
    expect(widget1InitialTopLeft.dy, equals(widget2TopLeft.dy));
    // Page 2 is leaving towards the left.
    expect(widget2TopLeft.dx, lessThan(widget1InitialTopLeft.dx));

    await tester.pumpAndSettle();

    expect(find.text('Page 1'), isOnstage);
    expect(find.text('Page 2'), findsNothing);

    widget1TransientTopLeft = tester.getTopLeft(find.text('Page 1'));

    // Page 1 is back where it started.
    expect(widget1InitialTopLeft, equals(widget1TransientTopLeft));
  });

153 154
  testWidgets('test iOS fullscreen dialog transition', (WidgetTester tester) async {
    await tester.pumpWidget(
155 156
      const CupertinoApp(
        home: Center(child: Text('Page 1')),
157 158 159 160 161
      ),
    );

    final Offset widget1InitialTopLeft = tester.getTopLeft(find.text('Page 1'));

162
    tester.state<NavigatorState>(find.byType(Navigator)).push(CupertinoPageRoute<void>(
163
      builder: (BuildContext context) {
164
        return const Center(child: Text('Page 2'));
165 166 167 168 169 170 171 172 173 174 175
      },
      fullscreenDialog: true,
    ));

    await tester.pump();
    await tester.pump(const Duration(milliseconds: 100));

    Offset widget1TransientTopLeft = tester.getTopLeft(find.text('Page 1'));
    Offset widget2TopLeft = tester.getTopLeft(find.text('Page 2'));

    // Page 1 doesn't move.
176
    expect(widget1TransientTopLeft, equals(widget1InitialTopLeft));
177
    // Fullscreen dialogs transitions vertically only.
178
    expect(widget1InitialTopLeft.dx, equals(widget2TopLeft.dx));
179
    // Page 2 is coming in from the bottom.
180
    expect(widget2TopLeft.dy, greaterThan(widget1InitialTopLeft.dy));
181 182 183 184 185 186 187 188 189 190 191 192 193 194 195

    await tester.pumpAndSettle();

    // Page 2 covers page 1.
    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    tester.state<NavigatorState>(find.byType(Navigator)).pop();
    await tester.pump();
    await tester.pump(const Duration(milliseconds: 100));

    widget1TransientTopLeft = tester.getTopLeft(find.text('Page 1'));
    widget2TopLeft = tester.getTopLeft(find.text('Page 2'));

    // Page 1 doesn't move.
196
    expect(widget1TransientTopLeft, equals(widget1InitialTopLeft));
197
    // Fullscreen dialogs transitions vertically only.
198
    expect(widget1InitialTopLeft.dx, equals(widget2TopLeft.dx));
199
    // Page 2 is leaving towards the bottom.
200
    expect(widget2TopLeft.dy, greaterThan(widget1InitialTopLeft.dy));
201 202 203 204 205 206 207 208 209

    await tester.pumpAndSettle();

    expect(find.text('Page 1'), isOnstage);
    expect(find.text('Page 2'), findsNothing);

    widget1TransientTopLeft = tester.getTopLeft(find.text('Page 1'));

    // Page 1 is back where it started.
210
    expect(widget1InitialTopLeft, equals(widget1TransientTopLeft));
211
  });
212

Ian Hickson's avatar
Ian Hickson committed
213
  testWidgets('test only edge swipes work (LTR)', (WidgetTester tester) async {
214
    await tester.pumpWidget(
215
      CupertinoApp(
216
        onGenerateRoute: (RouteSettings settings) {
217
          return CupertinoPageRoute<void>(
218 219
            settings: settings,
            builder: (BuildContext context) {
Ian Hickson's avatar
Ian Hickson committed
220
              final String pageNumber = settings.name == '/' ? '1' : '2';
221
              return Center(child: Text('Page $pageNumber'));
222
            },
223 224 225 226 227 228 229 230
          );
        },
      ),
    );

    tester.state<NavigatorState>(find.byType(Navigator)).pushNamed('/next');

    await tester.pump();
231
    await tester.pump(const Duration(seconds: 1));
232 233 234 235 236 237 238 239 240 241 242 243 244 245

    // Page 2 covers page 1.
    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    // Drag from the middle to the right.
    TestGesture gesture = await tester.startGesture(const Offset(200.0, 200.0));
    await gesture.moveBy(const Offset(300.0, 0.0));
    await tester.pump();

    // Nothing should happen.
    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

Ian Hickson's avatar
Ian Hickson committed
246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273
    // Drag from the right to the left.
    gesture = await tester.startGesture(const Offset(795.0, 200.0));
    await gesture.moveBy(const Offset(-300.0, 0.0));
    await tester.pump();

    // Nothing should happen.
    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    // Drag from the right to the further right.
    gesture = await tester.startGesture(const Offset(795.0, 200.0));
    await gesture.moveBy(const Offset(300.0, 0.0));
    await tester.pump();

    // Nothing should happen.
    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    // Now drag from the left edge.
    gesture = await tester.startGesture(const Offset(5.0, 200.0));
    await gesture.moveBy(const Offset(300.0, 0.0));
    await tester.pump();

    // Page 1 is now visible.
    expect(find.text('Page 1'), isOnstage);
    expect(find.text('Page 2'), isOnstage);
  });

274 275 276
  testWidgets('test edge swipes work with media query padding (LTR)', (WidgetTester tester) async {
    await tester.pumpWidget(
      CupertinoApp(
277
        builder: (BuildContext context, Widget? navigator) {
278 279
          return MediaQuery(
            data: const MediaQueryData(padding: EdgeInsets.only(left: 40)),
280
            child: navigator!,
281 282 283 284 285 286 287 288 289 290 291 292 293
          );
        },
        home: const Placeholder(),
      ),
    );

    tester.state<NavigatorState>(find.byType(Navigator)).push(
      CupertinoPageRoute<void>(
        builder: (BuildContext context) => const Center(child: Text('Page 1')),
      ),
    );

    await tester.pump();
294
    await tester.pump(const Duration(seconds: 2));
295 296 297 298 299 300 301

    tester.state<NavigatorState>(find.byType(Navigator)).push(
      CupertinoPageRoute<void>(
        builder: (BuildContext context) => const Center(child: Text('Page 2')),
      ),
    );
    await tester.pump();
302
    await tester.pumpAndSettle();
303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320

    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    // Now drag from the left edge.
    final TestGesture gesture = await tester.startGesture(const Offset(35.0, 200.0));
    await gesture.moveBy(const Offset(300.0, 0.0));
    await tester.pump();
    await tester.pumpAndSettle();

    // Page 1 is now visible.
    expect(find.text('Page 1'), isOnstage);
    expect(find.text('Page 2'), isOnstage);
  });

  testWidgets('test edge swipes work with media query padding (RLT)', (WidgetTester tester) async {
    await tester.pumpWidget(
      CupertinoApp(
321
        builder: (BuildContext context, Widget? navigator) {
322 323 324 325
          return Directionality(
            textDirection: TextDirection.rtl,
            child: MediaQuery(
              data: const MediaQueryData(padding: EdgeInsets.only(right: 40)),
326
              child: navigator!,
327 328 329 330 331 332 333 334 335 336 337 338 339 340
            ),
          );
        },
        home: const Placeholder(),
      ),
    );

    tester.state<NavigatorState>(find.byType(Navigator)).push(
      CupertinoPageRoute<void>(
        builder: (BuildContext context) => const Center(child: Text('Page 1')),
      ),
    );

    await tester.pump();
341
    await tester.pumpAndSettle();
342 343 344 345 346 347 348 349

    tester.state<NavigatorState>(find.byType(Navigator)).push(
      CupertinoPageRoute<void>(
        builder: (BuildContext context) => const Center(child: Text('Page 2')),
      ),
    );

    await tester.pump();
350
    await tester.pumpAndSettle();
351 352 353 354 355 356 357 358 359 360 361 362 363 364 365

    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    // Now drag from the left edge.
    final TestGesture gesture = await tester.startGesture(const Offset(765.0, 200.0));
    await gesture.moveBy(const Offset(-300.0, 0.0));
    await tester.pump();
    await tester.pumpAndSettle();

    // Page 1 is now visible.
    expect(find.text('Page 1'), isOnstage);
    expect(find.text('Page 2'), isOnstage);
  });

Ian Hickson's avatar
Ian Hickson committed
366 367
  testWidgets('test only edge swipes work (RTL)', (WidgetTester tester) async {
    await tester.pumpWidget(
368
      CupertinoApp(
369
        localizationsDelegates: const <LocalizationsDelegate<dynamic>>[
370
          RtlOverrideWidgetsDelegate(),
Ian Hickson's avatar
Ian Hickson committed
371 372
        ],
        onGenerateRoute: (RouteSettings settings) {
373
          return CupertinoPageRoute<void>(
Ian Hickson's avatar
Ian Hickson committed
374 375 376
            settings: settings,
            builder: (BuildContext context) {
              final String pageNumber = settings.name == '/' ? '1' : '2';
377
              return Center(child: Text('Page $pageNumber'));
378
            },
Ian Hickson's avatar
Ian Hickson committed
379 380 381 382 383 384 385 386 387
          );
        },
      ),
    );
    await tester.pump(); // to load the localization, since it doesn't use a synchronous future

    tester.state<NavigatorState>(find.byType(Navigator)).pushNamed('/next');

    await tester.pump();
388
    await tester.pumpAndSettle();
Ian Hickson's avatar
Ian Hickson committed
389 390 391 392 393 394 395 396 397 398 399 400 401 402 403

    // Page 2 covers page 1.
    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    // Drag from the middle to the left.
    TestGesture gesture = await tester.startGesture(const Offset(200.0, 200.0));
    await gesture.moveBy(const Offset(-300.0, 0.0));
    await tester.pump();

    // Nothing should happen.
    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    // Drag from the left to the right.
404 405 406 407
    gesture = await tester.startGesture(const Offset(5.0, 200.0));
    await gesture.moveBy(const Offset(300.0, 0.0));
    await tester.pump();

Ian Hickson's avatar
Ian Hickson committed
408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425
    // Nothing should happen.
    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    // Drag from the left to the further left.
    gesture = await tester.startGesture(const Offset(5.0, 200.0));
    await gesture.moveBy(const Offset(-300.0, 0.0));
    await tester.pump();

    // Nothing should happen.
    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    // Now drag from the right edge.
    gesture = await tester.startGesture(const Offset(795.0, 200.0));
    await gesture.moveBy(const Offset(-300.0, 0.0));
    await tester.pump();

426 427 428 429
    // Page 1 is now visible.
    expect(find.text('Page 1'), isOnstage);
    expect(find.text('Page 2'), isOnstage);
  });
430 431 432 433 434 435 436 437 438 439

  testWidgets('test edge swipe then drop back at starting point works', (WidgetTester tester) async {
    await tester.pumpWidget(
      CupertinoApp(
        onGenerateRoute: (RouteSettings settings) {
          return CupertinoPageRoute<void>(
            settings: settings,
            builder: (BuildContext context) {
              final String pageNumber = settings.name == '/' ? '1' : '2';
              return Center(child: Text('Page $pageNumber'));
440
            },
441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464
          );
        },
      ),
    );

    tester.state<NavigatorState>(find.byType(Navigator)).pushNamed('/next');

    await tester.pump();
    await tester.pump(const Duration(seconds: 1));

    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);

    final TestGesture gesture = await tester.startGesture(const Offset(5, 200));
    await gesture.moveBy(const Offset(300, 0));
    await tester.pump();
    // Bring it exactly back such that there's nothing to animate when releasing.
    await gesture.moveBy(const Offset(-300, 0));
    await gesture.up();
    await tester.pump();

    expect(find.text('Page 1'), findsNothing);
    expect(find.text('Page 2'), isOnstage);
  });
465 466 467 468 469 470 471

  testWidgets('CupertinoPage does not lose its state when transitioning out', (WidgetTester tester) async {
    final GlobalKey<NavigatorState> navigator = GlobalKey<NavigatorState>();
    await tester.pumpWidget(KeepsStateTestWidget(navigatorKey: navigator));
    expect(find.text('subpage'), findsOneWidget);
    expect(find.text('home'), findsNothing);

472
    navigator.currentState!.pop();
473 474 475 476 477
    await tester.pump();

    expect(find.text('subpage'), findsOneWidget);
    expect(find.text('home'), findsOneWidget);
  });
478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539

  testWidgets('CupertinoPage restores its state', (WidgetTester tester) async {
    await tester.pumpWidget(
      RootRestorationScope(
        restorationId: 'root',
        child: MediaQuery(
          data: const MediaQueryData(),
          child: Directionality(
            textDirection: TextDirection.ltr,
            child: Navigator(
              onPopPage: (Route<dynamic> route, dynamic result) { return false; },
              pages: const <Page<Object?>>[
                CupertinoPage<void>(
                  restorationId: 'p1',
                  child: TestRestorableWidget(restorationId: 'p1'),
                ),
              ],
              restorationScopeId: 'nav',
              onGenerateRoute: (RouteSettings settings) {
                return CupertinoPageRoute<void>(
                  settings: settings,
                  builder: (BuildContext context) {
                    return TestRestorableWidget(restorationId: settings.name!);
                  },
                );
              },
            ),
          ),
        ),
      ),
    );

    expect(find.text('p1'), findsOneWidget);
    expect(find.text('count: 0'), findsOneWidget);

    await tester.tap(find.text('increment'));
    await tester.pump();
    expect(find.text('count: 1'), findsOneWidget);

    tester.state<NavigatorState>(find.byType(Navigator)).restorablePushNamed('p2');
    await tester.pumpAndSettle();

    expect(find.text('p1'), findsNothing);
    expect(find.text('p2'), findsOneWidget);

    await tester.tap(find.text('increment'));
    await tester.pump();
    await tester.tap(find.text('increment'));
    await tester.pump();
    expect(find.text('count: 2'), findsOneWidget);

    await tester.restartAndRestore();

    expect(find.text('p2'), findsOneWidget);
    expect(find.text('count: 2'), findsOneWidget);

    tester.state<NavigatorState>(find.byType(Navigator)).pop();
    await tester.pumpAndSettle();

    expect(find.text('p1'), findsOneWidget);
    expect(find.text('count: 1'), findsOneWidget);
  });
540
}
Ian Hickson's avatar
Ian Hickson committed
541 542 543 544 545 546 547 548 549 550 551

class RtlOverrideWidgetsDelegate extends LocalizationsDelegate<WidgetsLocalizations> {
  const RtlOverrideWidgetsDelegate();
  @override
  bool isSupported(Locale locale) => true;
  @override
  Future<WidgetsLocalizations> load(Locale locale) async => const RtlOverrideWidgetsLocalization();
  @override
  bool shouldReload(LocalizationsDelegate<WidgetsLocalizations> oldDelegate) => false;
}

552
class RtlOverrideWidgetsLocalization extends DefaultWidgetsLocalizations {
Ian Hickson's avatar
Ian Hickson committed
553 554 555
  const RtlOverrideWidgetsLocalization();
  @override
  TextDirection get textDirection => TextDirection.rtl;
556
}
557 558

class KeepsStateTestWidget extends StatefulWidget {
559
  const KeepsStateTestWidget({super.key, this.navigatorKey});
560

561
  final Key? navigatorKey;
562 563 564 565 566 567

  @override
  State<KeepsStateTestWidget> createState() => _KeepsStateTestWidgetState();
}

class _KeepsStateTestWidgetState extends State<KeepsStateTestWidget> {
568
  String? _subpage = 'subpage';
569 570 571 572 573 574 575 576

  @override
  Widget build(BuildContext context) {
    return CupertinoApp(
      home: Navigator(
        key: widget.navigatorKey,
        pages: <Page<void>>[
          const CupertinoPage<void>(child: Text('home')),
577
          if (_subpage != null) CupertinoPage<void>(child: Text(_subpage!)),
578 579 580 581 582 583 584 585 586 587 588 589 590 591
        ],
        onPopPage: (Route<dynamic> route, dynamic result) {
          if (!route.didPop(result)) {
            return false;
          }
          setState(() {
            _subpage = null;
          });
          return true;
        },
      ),
    );
  }
}
592 593

class TestRestorableWidget extends StatefulWidget {
594
  const TestRestorableWidget({super.key, required this.restorationId});
595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630

  final String restorationId;

  @override
  State<StatefulWidget> createState() => _TestRestorableWidgetState();
}

class _TestRestorableWidgetState extends State<TestRestorableWidget> with RestorationMixin {
  @override
  String? get restorationId => widget.restorationId;

  final RestorableInt counter = RestorableInt(0);

  @override
  void restoreState(RestorationBucket? oldBucket, bool initialRestore) {
    registerForRestoration(counter, 'counter');
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Text(widget.restorationId),
        Text('count: ${counter.value}'),
        CupertinoButton(
          onPressed: () {
            setState(() {
              counter.value++;
            });
          },
          child: const Text('increment'),
        ),
      ],
    );
  }
}