Состояние виджетов библиотеки деления Flutter сохраняется при переходе на следующий экран и обратно - PullRequest
0 голосов
/ 29 февраля 2020

У меня есть виджет кнопки, масштаб которого изменяется, когда его нажатие становится меньше. Кнопка находится внутри виджета героя с тем же тегом, что и фон на следующем экране, поэтому при нажатии кнопки она превращается в фон на следующем экране. Проблема заключается в том, что при нажатии кнопки ее масштаб изменяется на 0,7, пользователь переходит на следующий экран, и когда этот экран появляется, ожидается, что кнопка будет иметь исходный масштаб 1,0, но масштаб остается прежним 0,7. Как это можно исправить?

Оригинал

enter image description here

Нажатие (меньше)

enter image description here

После возврата со следующего экрана (меньше обычного)

enter image description here

Кнопка

import 'package:division/division.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:my_flashcards/blocs/navigator/navigator.dart';
import 'package:my_flashcards/components/keys.dart';
import 'package:my_flashcards/ui/animations/page_transitions/fade_route.dart';
import 'package:my_flashcards/ui/screens/start_training.dart';
import 'package:my_flashcards/ui/styles/dimensions.dart';
import 'package:rect_getter/rect_getter.dart';

class TrainButton extends StatefulWidget {
  @override
  _TrainButtonState createState() => _TrainButtonState();
}

class _TrainButtonState extends State<TrainButton> {
  bool pressed = false;

  @override
  Widget build(BuildContext context) {
    return Hero(
      tag: 'startTrainingExpand',
      child: Parent(
          style: ParentStyle()
            ..background.color(Theme.of(context).primaryColor)
            ..height(trainingButtonHeight)
            ..width(trainingButtonWidth)
            ..borderRadius(all: trainingButtonBorderRadius)
            ..margin(bottom: trainingButtonBottomMargin)
            ..ripple(true)
            ..scale(pressed ? trainingButtonScalePressed : 1)
            ..animate(300, Curves.linear),
          gesture: Gestures()
            ..isTap((isTapped) => setState(() => pressed = isTapped))
            ..onTap(() {
              Navigator.push(context, FadeRoute(page: StartTraining()));
            }),
          child: Container(
            child: Center(child: Text('Button')),
          )),
    );
  }
}

Следующий экран

import 'package:flutter/material.dart';
import 'package:my_flashcards/ui/styles/themes.dart';
import 'package:simple_animations/simple_animations/controlled_animation.dart';
import 'package:simple_animations/simple_animations/multi_track_tween.dart';

class StartTraining extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Stack(
      children: <Widget>[
        Hero(
          tag: 'startTrainingExpand',
          child: Container(
            color: mainBlue,
            height: MediaQuery.of(context).size.height,
            width: MediaQuery.of(context).size.width,
          ),
        ),
        Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            FadeIn(0, ChooseTrainingButton()),
          ],
        ),
      ],
    );
  }
}

class FadeIn extends StatelessWidget {
  final double delay;
  final Widget child;

  FadeIn(this.delay, this.child);

  @override
  Widget build(BuildContext context) {
    final tween = MultiTrackTween([
      Track("opacity").add(
          Duration(milliseconds: 800), Tween(begin: 0.0, end: 1.0),
          curve: Curves.easeOut),
      Track("transform").add(
          Duration(milliseconds: 700), Tween(begin: 0.6, end: 1.0),
          curve: Curves.easeOut)
    ]);

    return ControlledAnimation(
      duration: tween.duration,
      tween: tween,
      child: child,
      builderWithChild: (context, child, animation) => Opacity(
        opacity: animation["opacity"],
        child: Transform.scale(scale: animation["transform"], child: child),
      ),
    );
  }
}

class ChooseTrainingButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.all(20),
      color: Colors.white,
      height: 100,
    );
  }
}
...