Created
November 26, 2019 16:48
-
-
Save brianegan/69e86b05d637e9201a71cfebbb5d7a4f to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import 'package:flutter/material.dart'; | |
| void main() => runApp(MyApp()); | |
| class MyApp extends StatelessWidget { | |
| @override | |
| Widget build(BuildContext context) { | |
| final appTitle = 'Opacity Demo'; | |
| return MaterialApp( | |
| title: appTitle, | |
| home: MyHomePage(title: appTitle), | |
| ); | |
| } | |
| } | |
| // The StatefulWidget's job is to take data and create a State class. | |
| // In this case, the widget takes a title, and creates a _MyHomePageState. | |
| class MyHomePage extends StatefulWidget { | |
| final String title; | |
| MyHomePage({Key key, this.title}) : super(key: key); | |
| @override | |
| _MyHomePageState createState() => _MyHomePageState(); | |
| } | |
| // The State class is responsible for two things: holding some data you can | |
| // update and building the UI using that data. | |
| class _MyHomePageState extends State<MyHomePage> { | |
| // Whether the green box should be visible | |
| bool _visible = true; | |
| @override | |
| Widget build(BuildContext context) { | |
| return Scaffold( | |
| appBar: AppBar( | |
| title: Text(widget.title), | |
| ), | |
| body: Center( | |
| child: AnimatedOpacity( | |
| // If the widget is visible, animate to 0.0 (invisible). | |
| // If the widget is hidden, animate to 1.0 (fully visible). | |
| opacity: _visible ? 1.0 : 0.0, | |
| duration: Duration(milliseconds: 500), | |
| // The green box must be a child of the AnimatedOpacity widget. | |
| child: Container( | |
| width: 200.0, | |
| height: 200.0, | |
| color: Colors.green, | |
| ), | |
| ), | |
| ), | |
| floatingActionButton: FloatingActionButton( | |
| onPressed: () { | |
| // Call setState. This tells Flutter to rebuild the | |
| // UI with the changes. | |
| setState(() { | |
| _visible = !_visible; | |
| }); | |
| }, | |
| tooltip: 'Toggle Opacity', | |
| child: Icon(Icons.flip), | |
| ), // This trailing comma makes auto-formatting nicer for build methods. | |
| ); | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment