title: Flutter - Partial SlideTransition in widget
body: <p>I'm trying to create the animation below, in which there is widget behind the <code>Container</code>.</p>
  
  <p><a href="https://i.stack.imgur.com/EdggH.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/EdggH.gif" alt="enter image description here"></a></p>
  
  <p>I tried to use the class <code>Dismissible</code> but its animation does not stop at a certain point, it goes to the end and disappears with the item, according to the gif below:</p>
  
  <p><a href="https://i.stack.imgur.com/04upj.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/04upj.gif" alt="enter image description here"></a></p>
  
  <p>I inserted the code into the <code>SlideTransition</code> class but I'm not sure how to integrate the <code>onHorizontalDragStart</code>, <code>onHorizontalDragUpdate</code>, <code>onHorizontalDragEnd</code> to generate the expected effect with the hidden back widget.</p>
  
  <p>Could you help me solve the problem?</p>
  
  <p>Follow the code below along with your screen:</p>
  
  <p><a href="https://i.stack.imgur.com/GlxY7.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/GlxY7.gif" alt="enter image description here"></a></p>
  
  <pre><code>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() =&gt; new _MyHomePageState();
  }
  
  class _MyHomePageState extends State&lt;MyHomePage&gt; with TickerProviderStateMixin {
    AnimationController _controller;
    Animation&lt;double&gt; _animation;
    bool _dragUnderway = false;
  
    @override
    void initState() {
      _controller = new AnimationController(
        vsync: this,
        duration: const Duration(milliseconds: 200),
      );
      _animation = new CurvedAnimation(
        parent: _controller,
        curve: new Interval(0.0, 1.0, curve: Curves.linear),
      );
      _controller.reverse();
      super.initState();
    }
  
  
  
    @override
    Widget build(BuildContext context) {
      return new Scaffold(
        appBar: new AppBar(),
        body: new Center(
          child: new GestureDetector(
            //onHorizontalDragStart: ,
            //onHorizontalDragUpdate:,
            //onHorizontalDragEnd: ,
            child: new SlideTransition(
              position: new Tween&lt;Offset&gt;(
                begin:  Offset.zero,
                end: const Offset(1.0, 0.0),
              ).animate(_animation),
              child: new Container(
                decoration: new BoxDecoration(
                  border: new Border(
                    top: new BorderSide(style: BorderStyle.solid, color: Colors.black26),
                    bottom: new BorderSide(style: BorderStyle.solid, color: Colors.black26),
                  )
                ),
                padding: new EdgeInsets.only(top: 20.0, bottom: 20.0),
                child: new Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: &lt;Widget&gt;[
                    new Text('foo'),                  
                  ],
                ),
              ),
            )
          )
        ),
      );
    }
  }
  </code></pre>