Skip to content

Flat buttons are supposed to have a 48px high tap target #615

Closed

Description

@Hixie

https://www.google.com/design/spec/components/buttons.html#buttons-usage

Right now, we don't enforce the 6px top and bottom margins.
Also, we don't tap target in that region like the spec says we should.

Activity

  1. added
    c: new featureNothing broken; request for a new capability
    frameworkflutter/packages/flutter repository. See also f: labels.
    p: material_uimaterial_ui package in flutter/packages
    on Nov 29, 2015
  2. added this to the milestone on Nov 29, 2015
  3. abarth commented on Nov 30, 2015

    @abarth
    Contributor

    Do you know how the splashes are supposed to work when you tap outside the visual bounds of the button? Should the splash start at the closest point inside the button? Should the splash originate from a point that's clipped by the button's visual bounds? Should the splash be omitted?

  4. Hixie commented on Nov 30, 2015

    @Hixie
    ContributorAuthor

    The spec doesn't say.

  5. abarth commented on Nov 30, 2015

    @abarth
    Contributor

    We should experiment with other implementations and/or ask the spec authors. This issue is what blocked me from solving this problem before.

  6. Hixie commented on Nov 30, 2015

    @Hixie
    ContributorAuthor

    I've sent a question to the material design team about this.

    On Sun, Nov 29, 2015 at 4:55 PM Adam Barth [email protected] wrote:

    We should experiment with other implementations and/or ask the spec
    authors. This issue is what blocked me from solving this problem before.

    —
    Reply to this email directly or view it on GitHub
    #615 (comment).

  7. sethladd commented on Jan 7, 2016

    @sethladd
    Contributor

    Did we ever get an answer?

  8. Hixie commented on Jan 7, 2016

    @Hixie
    ContributorAuthor

    We got several. Fundamentally there's no good answer because this is a non-physical interaction (tapping just outside the button triggering a button press). I think the best compromise between implementation complexity and quality of experience here is for the splash to start at the edge of the button nearest the actual tap point. It'll feel like you hit the button with the side of your finger and that's what triggered it.

  9. added
    a: accessibilityAccessibility, e.g. VoiceOver or TalkBack. (aka a11y)
    on Jun 13, 2017
  10. modified the milestones: 3: Current Milestone, on Jun 13, 2017
  11. Hixie commented on Dec 13, 2017

    @Hixie
    ContributorAuthor

    This is on our radar for the coming months.

  12. modified the milestones: 3: Current Milestone, on Jan 26, 2018
  13. modified the milestones: 3: Current Milestone, on Apr 11, 2018
  14. github-actions commented on Aug 17, 2021

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

  15. locked as resolved and limited conversation to collaborators on Aug 17, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

a: accessibilityAccessibility, e.g. VoiceOver or TalkBack. (aka a11y)c: new featureNothing broken; request for a new capabilityframeworkflutter/packages/flutter repository. See also f: labels.from: a11y reviewReported by an accessibility review teamp: material_uimaterial_ui package in flutter/packages

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions