Monday, October 15, 2018

Flutter Displaying Snackbars

Below are the three steps involved in providing a snacker UX


    Create a Scaffold
    Display a SnackBar
    Provide an additional action

Below is a complete example of a SnackBar

class SnackBarPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: RaisedButton(
        onPressed: () {
          final snackBar = SnackBar(
            content: Text('Yay! A SnackBar!'),
            action: SnackBarAction(
              label: 'Undo',
              onPressed: () {
                // Some code to undo the change!
              },
            ),
          );

          // Find the Scaffold in the Widget tree and use it to show a SnackBar!
          Scaffold.of(context).showSnackBar(snackBar);
        },
        child: Text('Show SnackBar'),
      ),
    );
  }
}


References:
https://flutter.io/cookbook/design/snackbars/


No comments:

Post a Comment