Adding more customization options

[Alan Bedian]

I needed this component, much better than the default material toast, thanks. I just needed to customize it further to fit the style of my app. Found it really easy to do, wanted to offer my changes. I added new properties for textSize, boxShadow and border and it looks much better to me now. Here's the blocks of code in toast.dart that I changed:

  static void show(String msg, BuildContext context,
      {int duration = 1,
      int gravity = 0,
      Color backgroundColor = const Color(0xAA000000),
      Color textColor = Colors.white,
      double textSize = 15.0,
      double backgroundRadius = 20,
      BoxShadow boxShadow,
      Border border,
      }) {
    ToastView.dismiss();
    ToastView.createView(
        msg, context, duration, gravity, backgroundColor, textColor, textSize, backgroundRadius, boxShadow, border);
  }
}

Then mixed those in below:

  static void createView(String msg, BuildContext context, int duration, int gravity,
      Color background, Color textColor, double textSize, double backgroundRadius, BoxShadow boxShadow, Border border) async {
    overlayState = Overlay.of(context);
    overlayEntry = new OverlayEntry(
      builder: (BuildContext context) => ToastWidget(
          widget: Container(
            width: MediaQuery.of(context).size.width,
            child: FittedBox(
                alignment: Alignment.center,
                fit: BoxFit.none,
                child: ConstrainedBox(
                  constraints: BoxConstraints(minHeight: 32),
                  child: Container(
                    decoration: BoxDecoration(
                      color: background,
                      border: border,
                      borderRadius: BorderRadius.circular(backgroundRadius),
                      boxShadow: boxShadow == null ? null : <BoxShadow>[boxShadow],
                    ),
                    margin: EdgeInsets.symmetric(horizontal: 20),
                    padding: EdgeInsets.symmetric(horizontal: 16.0),
                    child: Center(
                      child: new Text(msg,
                          softWrap: true, style: TextStyle(fontSize: textSize, color: textColor)),
                    ),
                  ),
                )),
          ),
          gravity: gravity),
    );

Very easy, but makes a difference in giving it a unique style, and I can think of a few more fixed properties that could be made accessible like the margin and padding, but this did it for me. Now the only missing feature I'd love to see added is to animate the toast coming in and out. Would be nice to have option to fade in/out or to slide in/out based on gravity direction. Probably not that difficult to do, and would make it look much more native. Thanks, now my toast has extra jam..

[appdev]

Thank you, we are also planning to do this.

[Adrian Vintu]

Thank you for the great looking component @Skquark

Did you ever get to add animation?