title: Flutter - Float Action Button - Hiding the visibility of items
body: <p>I'm trying to control the visibility of the smaller items of the FAB, according to the gif below:</p>
  
  <p><a href="https://i.stack.imgur.com/pWEqa.gif" rel="noreferrer"><img src="https://i.stack.imgur.com/pWEqa.gif" alt="enter image description here"></a></p>
  
  <p>However I am not able to insert the <code>opacity</code> in the items. Anywhere I put some kind of error occurs. I do not know if <code>opacity</code> is the best way to do it.</p>
  
  <p>To hide the items I believe that with animation it is possible to control the time in which they will appear.</p>
  
  <p>Below is what I have achieved so far:</p>
  
  <p><a href="https://i.stack.imgur.com/mr74j.gif" rel="noreferrer"><img src="https://i.stack.imgur.com/mr74j.gif" alt="enter image description here"></a></p>
  
  <p>Could you help me solve this problem?</p>
  
  <p>Below is the above gif code:</p>
  
  <pre><code>import 'package:flutter/animation.dart';
  import 'package:flutter/material.dart';
  
  void main() {
    runApp(new MaterialApp(home: new HomePage()));
  }
  
  class HomePage extends StatefulWidget {
    @override
    HomePageState createState() =&gt; new HomePageState();
  }
  
  class HomePageState extends State&lt;HomePage&gt; with TickerProviderStateMixin {
    int _angle = 90;
    bool _isRotated = true;
  
    void _rotate(){
      setState((){
        if(_isRotated) {
          _angle = 45;
          _isRotated = false;
        } else {
          _angle = 90;
          _isRotated = true;
        }
      });
    }
  
    @override
    Widget build(BuildContext context) {
      return new Scaffold(
        body: new Stack(
          children: &lt;Widget&gt;[
              new Positioned(
                bottom: 200.0,
                right: 24.0,
                child: new Container(
                  child: new Row(
                    children: &lt;Widget&gt;[
                      new Container(
                        margin: new EdgeInsets.only(right: 16.0),
                        child: new Text(
                          'foo1',
                          style: new TextStyle(
                            fontSize: 13.0,
                            fontFamily: 'Roboto',
                            color: new Color(0xFF9E9E9E),
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ),
                      new Material(
                        color: new Color(0xFF9E9E9E),
                        type: MaterialType.circle,
                        elevation: 6.0,
                        child: new GestureDetector(
                          child: new Container(
                            width: 40.0,
                            height: 40.0,
                            child: new InkWell(
                              onTap: (){},
                              child: new Center(
                                child: new Icon(
                                  Icons.add,
                                  color: new Color(0xFFFFFFFF),
                                ),                      
                              ),
                            )
                          ),
                        )
                      ),
                    ],
                  ),
                )
              ),
  
            new Positioned(
              bottom: 144.0,
              right: 24.0,
              child: new Container(
                child: new Row(
                  children: &lt;Widget&gt;[
                    new Container(
                      margin: new EdgeInsets.only(right: 16.0),
                      child: new Text(
                        'foo2',
                        style: new TextStyle(
                          fontSize: 13.0,
                          fontFamily: 'Roboto',
                          color: new Color(0xFF9E9E9E),
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                    new Material(
                      color: new Color(0xFF00BFA5),
                      type: MaterialType.circle,
                      elevation: 6.0,
                      child: new GestureDetector(
                        child: new Container(
                          width: 40.0,
                          height: 40.0,
                          child: new InkWell(
                            onTap: (){},
                            child: new Center(
                              child: new Icon(
                                Icons.add,
                                color: new Color(0xFFFFFFFF),
                              ),                      
                            ),
                          )
                        ),
                      )
                    ),
                  ],
                ),
              )
            ),
            new Positioned(
              bottom: 88.0,
              right: 24.0,
              child: new Container(
                child: new Row(
                  children: &lt;Widget&gt;[
                    new Container(
                      margin: new EdgeInsets.only(right: 16.0),
                      child: new Text(
                        'foo3',
                        style: new TextStyle(
                          fontSize: 13.0,
                          fontFamily: 'Roboto',
                          color: new Color(0xFF9E9E9E),
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                    new Material(
                      color: new Color(0xFFE57373),
                      type: MaterialType.circle,
                      elevation: 6.0,
                      child: new GestureDetector(
                        child: new Container(
                          width: 40.0,
                          height: 40.0,
                          child: new InkWell(
                            onTap: (){},
                            child: new Center(
                              child: new Icon(
                                Icons.add,
                                color: new Color(0xFFFFFFFF),
                              ),                      
                            ),
                          )
                        ),
                      )
                    ),
                  ],
                ),
              )
            ),
            new Positioned(
              bottom: 16.0,
              right: 16.0,
              child: new Material(
                color: new Color(0xFFE57373),
                type: MaterialType.circle,
                elevation: 6.0,
                child: new GestureDetector(
                  child: new Container(
                    width: 56.0,
                    height: 56.00,
                    child: new InkWell(
                      onTap: _rotate,
                      child: new Center(
                        child: new RotationTransition(
                          turns: new AlwaysStoppedAnimation(_angle / 360),
                          child: new Icon(
                            Icons.add,
                            color: new Color(0xFFFFFFFF),
                          ),
                        )
                      ),
                    )
                  ),
                )
              ),
            ),
          ]
        )
      );
    }
  }
  </code></pre>