Flutter：拖动小部件时更改小部件比例

Question

当我向上拖动小部件时，我正在尝试更改小部件的大小（比例）。 我正在使用GestureDetector和onPanUpdate方法，现在我想通过Matrix4.identity来更改小部件的大小：

 return GestureDetector(
        
        onPanUpdate: (details) {
          _position += details.delta;
          setState(() {});
        },

        child: Stack(
          children: [
            SizedBox(
              child: LayoutBuilder(builder: (context, constraints) {
                final milliSeconds = _isDragging ? 0 : 400;
                final center = constraints.smallest.center(Offset.zero);
                final scaledMatrix = Matrix4.identity();
                  // ..translate(center.dx, center.dy)
                  // ..scale(1.0, 0.5)
                  // ..translate(-center.dx, -center.dy);
                return AnimatedContainer(
                    curve: Curves.easeInOut,
                    duration: Duration(milliseconds: milliSeconds),
                    transform: scaledMatrix
                      ..translate(_position.dx, _position.dy),
                    child: widget.widgets[0]);
              }),
            ),
          ],
        )); 

现在，当小部件被拖动时，我改变了位置，但我怎样才能改变小部件的比例？

Answer 1

您可以使用Matrix4.identity()..scale api 来实现这一点。

import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(
      home: Scaffold(appBar: AppBar(), body: _Drag()),
    ));

class _Drag extends StatefulWidget {
  @override
  _DragState createState() => _DragState();
}

class _DragState extends State<_Drag> with SingleTickerProviderStateMixin {
  bool shouldScaleDown = true; // change value when needed

  double _top = 300; // distance to top
  double _left = 150; // distance to left
  double scale = 1;

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: <Widget>[
        Positioned(
          top: _top,
          left: _left,
          child: GestureDetector(
            onPanDown: (DragDownDetails e) {
              print("fingure down: ${e.globalPosition}");
            },
            onPanUpdate: (DragUpdateDetails e) {
              setState(() {
                _left += e.delta.dx;
                _top += e.delta.dy;
                if (e.delta.dy > 0) {
                  scale = scale - 0.01;
                }
                if (e.delta.dy < 0) {
                  scale = scale + 0.01;
                }
              });
            },
            onPanEnd: (DragEndDetails e) {
              print("fingure away from screen");
              print(e.velocity);
            },
            child: AnimatedContainer(
              color: Colors.blueAccent,
              width: 100,
              height: 100,
              duration: Duration(milliseconds: 300),
              transform: Matrix4.identity()..scale(scale, scale),
              child: Container(),
            ),
          ),
        )
      ],
    );
  }
}