Skip to content

ChoiceChip has wrong InkResponse highlight effect #28646

Closed

Description

@ocavue

This issue is a bug report.

ChoiceChip's ink/ripple highlight effect should cover all its area, just like a RaisedButton or extended FAB.

However, if the chip is long enough, we can notice that the highlight effect is a circle.

feb-28-2019 20-02-51 320

Related comments:

/// An [InkResponse] widget does two things when responding to a tap:
///
/// * It starts to animate a _highlight_. The shape of the highlight is
/// determined by [highlightShape]. If it is a [BoxShape.circle], the
/// default, then the highlight is a circle of fixed size centered in the
/// [InkResponse]. If it is [BoxShape.rectangle], then the highlight is a box
/// the size of the [InkResponse] itself, unless [getRectCallback] is
/// provided, in which case that callback defines the rectangle. The color of
/// the highlight is set by [highlightColor].
///

I could subbmit a MR to fix this recently.

Steps to Reproduce

import 'package:flutter/material.dart';
...
      ChoiceChip(
        label: Text('short ..'),
        onSelected: (x) => {},
        selected: false,
      ),
      ChoiceChip(
        label: Text('looooooooooooooooooooooooong'),
        onSelected: (x) => {},
        selected: false,
      ),
...

Logs

$ flutter doctor -v
[✓] Flutter (Channel stable, v1.2.1, on Mac OS X 10.13.6 17G5019, locale en-US)
    • Flutter version 1.2.1 at /Users/me/Git/flutter
    • Framework revision 8661d8aecd (13 days ago), 2019-02-14 19:19:53 -0800
    • Engine revision 3757390fa4
    • Dart version 2.1.2 (build 2.1.2-dev.0.0 0a7dcf17eb)

[✗] Android toolchain - develop for Android devices
    ✗ Unable to locate Android SDK.
      Install Android Studio from: https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the Android SDK components.
      (or visit https://flutter.io/setup/#android-setup for detailed instructions).
      If Android SDK has been installed to a custom location, set ANDROID_HOME to that location.
      You may also want to add it to your PATH environment variable.


[✓] iOS toolchain - develop for iOS devices (Xcode 10.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 10.1, Build version 10B61
    • ios-deploy 1.9.4
    • CocoaPods version 1.6.0

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.io/setup/#android-setup for detailed instructions).

[✓] VS Code (version 1.31.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 2.24.0

[✓] Connected device (1 available)
    • iPhone XR • 8E19F9DA-1935-4841-B57E-981CB3627403 • ios • iOS 12.1 (simulator)

! Doctor found issues in 2 categories.

Activity

  1. ocavue commented on Feb 28, 2019

    @ocavue
    ContributorAuthor

    Just in case I didn't make this clear, here is the correct behavior (in my opinion):

    feb-28-2019 22-22-44

  2. HansMuller commented on Feb 28, 2019

    @HansMuller
    Contributor

    Couldn't be clearer, thanks for the report!

  3. ocavue commented on Mar 1, 2019

    @ocavue
    ContributorAuthor

    My PR #28653 is ready for review.

  4. github-actions commented on Aug 30, 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.

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

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions