How to create multiline SnackBar in Flutter?
How to create multiline SnackBar in Flutter? Is there any easy way to show action button below the content?
The Material specs allows to use SnackBars with button below the content:
Solution 1:
Flexible can do the trick some times.
Flexible(child: Text('This is very long message with very big sentence.'))
Solution 2:
this can easily be done using the Flusbar package, here is a full example
import 'package:flushbar/flushbar.dart';
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: HomePage(),
);
}
}
class HomePage extends StatelessWidget {
void _showFlushbar(BuildContext context) {
Flushbar(
titleText: Text(
'This item already has the label "travel". you can add a new label.',
style: TextStyle(color: Colors.white),
),
messageText: Align(
alignment: Alignment.bottomRight,
child: InkWell(
onTap: () => print('message pressed'),
child: Text(
'ADD A NEW LABEL ',
style: TextStyle(color: Colors.purple),
),
),
),
isDismissible: false,
duration: Duration(seconds: 5), // to make it disappear after 5 seconds
)..show(context);
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: RaisedButton(
child: Text('show snackbar'),
onPressed: () => _showFlushbar(context),
),
),
);
}
}