OutlineButton documentation is very vague and unclear

[MichaelM97]

When creating an 'OutlineButton', I presume setting the 'color' tag should result in the button being filled with the specified color; but it doesn't.

Here's the button code

Container(
            alignment: Alignment.center,
            child: Padding(
              padding: EdgeInsets.only(bottom: 25.0),
              child: OutlineButton(
                color: Colors.red,
                child: Text(
                  'Log in',
                  style: TextStyle(color: Colors.blue),
                ),
                onPressed: () {
                  print("TODO");
                },
                borderSide: BorderSide(color: Colors.blue),
              ),
            ),
          ),

Here's the visual output

[HansMuller]

OutlineButtons always have a transparent fill unless the button's highlightElevation is set to a value > 0. If that's the case then the outline button is filled with the specified color when pressed - before it's elevation is increased and its shadow appears.

The OutlineButton documentation is not clear on this, we need to fix that.

[Hixie]

The documentation for OutlineButton is actually really unclear on many aspects. It should have examples of basic usage, sample images showing cases with elevation, etc.

[hello-addweb]

Try this

DecoratedBox(

        decoration:
        ShapeDecoration(shape: CircleBorder(), color: Colors.pinkAccent),
        child: Theme(
        data: Theme.of(context).copyWith(
        buttonTheme: ButtonTheme.of(context).copyWith(
        materialTapTargetSize: MaterialTapTargetSize.shrinkWrap)),
        child: OutlineButton(
        shape: CircleBorder(),
        child: Text('A'),
        onPressed: () => {},

),),);

[Abhishek01039]

Hello @Hixie
OutlineButton is obsolete.
should we close this issue now or have to update the docs?

[HansMuller]

I'm closing this issue because the OutlineButton widget is deprecated and has been replaced by OutlinedButton. The new OutlinedButton widget does need examples, as do TextButton and ElevatedButton. Many examples can be found in flutter.dev/go/material-button-migration-guide and in #59702 as well as the ButtonStyle API doc.

I've opened an issue for the API doc lacunae - #75642

[github-actions]

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.