DecoratedOutlineButton

main.dart

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        backgroundColor: Colors.white,
        body: Center(
          child: DecoratedOutlineButton(
            onPressed: (){},
            primaryColor: Colors.green,
            text: 'Outline Button',
          ),
        ),
      ),
    );
  }
}

class DecoratedOutlineButton extends StatefulWidget {
  @required final VoidCallback onPressed;
  final Color primaryColor;
  final String text;

  const DecoratedOutlineButton({
    Key key,
    this.onPressed,
    this.primaryColor = Colors.grey, 
    this.text,
  }) : super(key: key);
  
  @override
  _DecoratedOutlineButtonState createState() => _DecoratedOutlineButtonState();
}

class _DecoratedOutlineButtonState extends State<DecoratedOutlineButton> {
  var _hoveringButton = false;

  void _mouseEnterButton(bool hover) {
    setState(() {
      _hoveringButton = hover;
    });
  }

  @override
  Widget build(BuildContext context) {
    return MouseRegion(
      onEnter: (e) => _mouseEnterButton(true),
      onExit: (e) => _mouseEnterButton(false),
      child: OutlineButton(
        onPressed: widget.onPressed,
        color: Colors.white,
        hoverColor: widget.primaryColor,
        textColor: _hoveringButton ? Colors.white : widget.primaryColor,
        highlightedBorderColor: widget.primaryColor,
        borderSide: BorderSide(width: 3.5, color: widget.primaryColor),
        shape: ContinuousRectangleBorder(
          borderRadius: BorderRadius.circular(15.0),
        ),
        child: Text(
          widget.text ?? '',
        ),
      ),
    );
  }
}