Флаттер: как перемещать, вращать и масштабировать контейнер? - PullRequest
0 голосов
/ 18 марта 2019

Я хочу создать контейнер, который можно перемещать, масштабировать и вращать.Я могу добиться увеличения.Ниже мой код:

//variable declaration
  double _scale = 1.0;
  double _previousScale;
  var yOffset = 400.0;
  var xOffset = 50.0;
  var rotation = 0.0;
  var lastRotation = 0.0;

// метод построения

@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Center(
          child: GestureDetector(
            onScaleStart: (scaleDetails) {
              _previousScale = _scale;
              print(' scaleStarts = ${scaleDetails.focalPoint}');
            },
            onScaleUpdate: (scaleUpdates){
              //ScaleUpdateDetails
              rotation += lastRotation - scaleUpdates.rotation;
              lastRotation = scaleUpdates.rotation;
              print("lastRotation = $lastRotation");
              print(' scaleUpdates = ${scaleUpdates.scale} rotation = ${scaleUpdates.rotation}');
              setState(() => _scale = _previousScale * scaleUpdates.scale);
            },
            onScaleEnd: (scaleEndDetails) {
              _previousScale = null;
              print(' scaleEnds = ${scaleEndDetails.velocity}');
            },
            child:
            Transform(
              transform: Matrix4.diagonal3( Vector3(_scale, _scale, _scale))..rotateZ(rotation * math.pi/180.0),
              alignment: FractionalOffset.center,
              child: Container(
                height: 200.0,
                width: 200.0,
                color: Colors.red,
              ),
            )
            ,
          ),
        ),
      ),
    );
  }

В настоящее время нет вращения, и я не могу перемещать контейнер.

1 Ответ

4 голосов
/ 24 марта 2019

используйте matrix_gesture_detector пакет, здесь у вас есть базовый образец:

MatrixGestureDetector(
  onMatrixUpdate: (m, tm, sm, rm) {
    setState(() {
      matrix = n;
    });
  },
  child: Transform(
    transform: matrix,
    child: ....
  ),
),

, чтобы узнать больше примеров кода, обратитесь к папке example, содержащей 6 демонстраций

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...