Skip to content

Update common buttons to support Material 3 #99022

Description

@darrenaustin

image

As part of the migration to Material Design 3, the common buttons (ElevatedButton, TextButton and OutlineButton) need to be updated to the latest design spec:

https://m3.material.io/components/buttons/overview

Activity

  1. added
    frameworkflutter/packages/flutter repository. See also f: labels.
    p: material_uimaterial_ui package in flutter/packages
    on Feb 23, 2022
  2. self-assigned this
    on Feb 23, 2022
  3. changed the title [-][Material 3] Update common buttons to Material 3 design[/-] [+]Update common buttons to Material 3 design[/+] on Mar 30, 2022
  4. changed the title [-]Update common buttons to Material 3 design[/-] [+]Update common buttons to support Material 3[/+] on Mar 30, 2022
  5. MarlonJD commented on Apr 19, 2022

    @MarlonJD
    Contributor

    What about filled and filled tonal buttons ?

  6. darrenaustin commented on Apr 19, 2022

    @darrenaustin
    ContributorAuthor

    What about filled and filled tonal buttons ?

    For now we are suggesting using the existing ElevatedButton with styles to achieve the Filled and Filled Tonal looks. You can see examples of these in the sample added for the PR: https://github.com/flutter/flutter/pull/100794/files#diff-aac3a34e6f8e5c540516600483774c89534da079af53feb8ea1ac7dd76c1558b

    We may look into adding subclasses for these, but we were trying to be conservative with adding new APIs.

  7. MarlonJD commented on Apr 19, 2022

    @MarlonJD
    Contributor

    Filled Buttons are highly important on Material 3 design concept. I'm surprised that doesn't exists.
    I can add these if you're okay with that. I think we should think add these.
    What do you prefer:

    • ElevatedButton's properties, filled: true/false, tonal: true/false
    • Populated from ElevatedButton but widget just like others. FilledButton (at least this. We can add this tonal: true/false properties).

    My personal idea is, FilledButton can be another widget. Because Material.io saying there is 5 type of buttons. I think, these buttons should be usable easily on flutter.

  8. github-actions commented on May 3, 2022

    @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.

  9. locked as resolved and limited conversation to collaborators on May 3, 2022
  10. moved this to Todo in Material 3on May 23, 2022
  11. moved this from Todo to Done in Material 3on May 23, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

cp: reviewCherry-picks in the review queueframeworkflutter/packages/flutter repository. See also f: labels.p: material_uimaterial_ui package in flutter/packages

Type

No type

Projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions