Как позволить другим виджетам занимать пространство, освобожденное масштабным преобразованием / анимацией? - PullRequest
0 голосов
/ 03 мая 2019

Я пытаюсь создать анимацию, в которой один из пристыкованных FAB сокращается, а другие остаются.

Тем не менее, ScaleTransition во флаттере позволяет уменьшать только краску, а не макет, а Container позволяет изменять только абсолютный размер, а не процентную шкалу. Есть ли более чистый способ сделать это без жесткого кодирования размеров / смещения? (Или создать герооподобный переход между моей текущей кнопкой и более широкой новой кнопкой?)

import 'package:flutter/material.dart';
import 'task.dart';

class FloatingActionButtonBar extends StatefulWidget {
  final ValueNotifier<bool> removeButtonVisiblilityController;
  final ValueSetter onAdd;
  final VoidCallback onRemove;
  FloatingActionButtonBar(
      {this.removeButtonVisiblilityController, this.onAdd, this.onRemove});

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

class FloatingActionButtonBarState extends State<FloatingActionButtonBar>
    with SingleTickerProviderStateMixin {
  AnimationController _removeButtonAnimationController;

  void _newTask(BuildContext context) {/*...*/}

  void _remove(BuildContext context) {/*...*/}

  @override
  void initState() {/*...*/}

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: <Widget>[
        ButtonBar(
          alignment: MainAxisAlignment.center,
          children: <Widget>[
            FloatingActionButton.extended(
              onPressed: () => _newTask(context),
              icon: Icon(Icons.add),
              label: Text("Task"),
            ),
            AnimatedBuilder(
              animation: _removeButtonAnimationController,
              child: FloatingActionButton(
                onPressed: () => _remove(context),
                child: Icon(Icons.delete),
                backgroundColor: Theme.of(context).errorColor,
              ),
              builder: (context, child) => Opacity(
                    opacity: _removeButtonAnimationController.value,
                    child: ScaleTransition(
                      alignment: FractionalOffset(0.5, 0.5),
                      scale: _removeButtonAnimationController,
                      child: child,
                    ),
                  ),
            ),
          ],
        ),
      ],
    );
  }

  @override
  void dispose() {/*...*/}
}

Снимок экрана

...