Заменить виджет с анимацией - PullRequest
Новая
       8

Заменить виджет с анимацией

0 голосов
/ 26 августа 2018

Я новичок во флаттере, я просто хочу реализовать обмен двух виджетов с анимацией, для достижения этого до сих пор я использовал SlideTransition и был в состоянии сделать анимацию.

Используя это, я сталкиваюсь с несколькими проблемами

  1. Как найти позицию другого виджета, чтобы поменять текущий виджет с другим.
  2. Как установить начало и конец анимации передВизуализация виджетов.

Я поместил свой код в этот пост, нужен совет от всех вас, есть ли другой эффективный способ добиться этого .?

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
  AnimationController _controller;
  Animation<double> _animation;
  bool status = false;
  String from = "From";
  String to = "To";

  void initState() {
    super.initState();
    _controller = new AnimationController(
        duration: const Duration(milliseconds: 246), vsync: this);

    _animation = new CurvedAnimation(
      parent: _controller,
      curve: new Interval(0.0, 1.0, curve: Curves.linear),
    );
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        appBar: new AppBar(
          title: new Text("Swap Test"),
        ),
        body: new Center(
            child: new Column(
          children: <Widget>[
            new Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  SlideTransition(
                    position: new Tween<Offset>(
                      begin: Offset.zero,
                      end: const Offset(5.0, 0.0),
                    ).animate(_animation),
                    child: Text(
                      from,
                    ),
                  ),
                  SlideTransition(
                    position: new Tween<Offset>(
                      begin: Offset.zero,
                      end: const Offset(-5.0, 0.0),
                    ).animate(_animation),
                    child: Text(
                      to,
                    ),
                  ),
                ]),
            new RaisedButton(
              onPressed: () {
                if (!status) {
                  _controller.forward().whenComplete(() {
                    status = true;
                  });
                } else {
                  _controller.reverse().whenComplete(() {
                    status = false;
                  });
                }
              },
              textColor: Colors.white,
              color: Colors.red,
              padding: const EdgeInsets.all(8.0),
              child: new Text(
                "Swap",
              ),
            ),
          ],
        )));
  }
}
...