[Reland] Fix `SegmentedButton` clipping when drawing segments (#149739) by TahaTesser · Pull Request #150090 · flutter/flutter

TahaTesser · 2024-06-12T08:49:11Z

Relands #149739 which was reverted due to #149851

fixes SegmentedButton doesn't clip properly when one of the segments has ColorFiltered

Code sample

expand to view the code sample

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: SegmentedButton<int>(
            segments: const <ButtonSegment<int>>[
              ButtonSegment<int>(
                value: 0,
                label: ColorFiltered(
                  colorFilter:
                      ColorFilter.mode(Colors.amber, BlendMode.colorBurn),
                  child: Text('Option 1'),
                ),
              ),
              ButtonSegment<int>(
                value: 1,
                label: Text('Option 2'),
              ),
            ],
            onSelectionChanged: (Set<int> selected) {},
            selected: const <int>{0},
          ),
        ),
      ),
    );
  }
}

Before

After

Replace this paragraph with a description of what this PR is changing or adding, and why. Consider including before/after screenshots.

List which issues are fixed by this PR. You must list at least one issue. An issue is not required if the PR fixes something trivial like a typo.

If you had to change anything in the flutter/tests repo, include a link to the migration guide as per the breaking change policy.

Pre-launch Checklist

I read the Contributor Guide and followed the process outlined there for submitting PRs.
I read the Tree Hygiene wiki page, which explains my responsibilities.
I read and followed the Flutter Style Guide, including Features we expect every widget to implement.
I signed the CLA.
I listed at least one issue that this PR fixes in the description above.
I updated/added relevant documentation (doc comments with ///).
I added new tests to check the change I am making, or this PR is test-exempt.
I followed the breaking change policy and added Data Driven Fixes where supported.
All existing and new tests are passing.

If you need help, consider asking for advice on the #hackers-new channel on Discord.

@OverRide

fixes [`SegmentedButton` doesn't clip properly when one of the segments has `ColorFiltered`](#144990) ### Code sample <details> <summary>expand to view the code sample</summary> ```dart import 'package:flutter/material.dart'; void main() => runApp(const MyApp()); class MyApp extends StatelessWidget { const MyApp({super.key}); @OverRide Widget build(BuildContext context) { return MaterialApp( home: Scaffold( body: Center( child: SegmentedButton<int>( segments: const <ButtonSegment<int>>[ ButtonSegment<int>( value: 0, label: ColorFiltered( colorFilter: ColorFilter.mode(Colors.amber, BlendMode.colorBurn), child: Text('Option 1'), ), ), ButtonSegment<int>( value: 1, label: Text('Option 2'), ), ], onSelectionChanged: (Set<int> selected) {}, selected: const <int>{0}, ), ), ), ); } } ``` </details> ### Before ![before](https://github.com/flutter/flutter/assets/48603081/b402fc51-d575-4208-8a71-f798ef2b2bf5) ### After ![after](https://github.com/flutter/flutter/assets/48603081/77a5cac2-ecef-4381-a043-dbb5c91407ec)

QuncCccccc

LGTM! Thanks for the reland:)

TahaTesser · 2024-06-12T17:09:04Z

LGTM! Thanks for the reland:)

Thanks for the review! (As always)

auto-submit · 2024-06-12T18:06:06Z

auto label is removed for flutter/flutter/150090, due to - The status or check suite Google testing has failed. Please fix the issues identified (or deflake) before re-applying this label.

QuncCccccc · 2024-06-12T18:12:42Z

The failures should come from the change to clip the divider between buttons. Can't really see any differences so the change should be acceptable. Just marked the Google testing status as expected behaviors!

TahaTesser · 2024-06-12T18:14:30Z

The failures should come from the change to clip the divider between buttons. Can't really see any differences so the change should be acceptable. Just marked the Google testing status as expected behaviors!

Appreciate it!

… (#149739) (flutter/flutter#150090)

flutter/flutter@b1f9d71...01db23b 2024-06-13 engine-flutter-autoroll@skia.org Roll Flutter Engine from c7fcbfce608f to 4cb3025d3abf (28 revisions) (flutter/flutter#150199) 2024-06-13 dkwingsmt@users.noreply.github.com Revert "[CupertinoActionSheet] Add sliding tap gesture" (flutter/flutter#150147) 2024-06-13 hans.muller@gmail.com RawScrollbar: don't listen for drag gestures when scrolling is not possible (flutter/flutter#149925) 2024-06-13 katelovett@google.com Update testowners (flutter/flutter#150141) 2024-06-12 109111084+yaakovschectman@users.noreply.github.com Revert "Reland 2: [CupertinoActionSheet] Match colors to native" (flutter/flutter#150142) 2024-06-12 dkwingsmt@users.noreply.github.com Reland 2: [CupertinoActionSheet] Match colors to native (flutter/flutter#150129) 2024-06-12 49699333+dependabot[bot]@users.noreply.github.com Bump actions/checkout from 4.1.6 to 4.1.7 (flutter/flutter#150132) 2024-06-12 49699333+dependabot[bot]@users.noreply.github.com Bump github/codeql-action from 3.25.8 to 3.25.9 (flutter/flutter#150133) 2024-06-12 15619084+vashworth@users.noreply.github.com Improve build time when using SwiftPM (flutter/flutter#150052) 2024-06-12 gspencergoog@users.noreply.github.com Reland: Request focus if accessibility focus is given to a Focus widget (#142942) (flutter/flutter#149840) 2024-06-12 52160996+FMorschel@users.noreply.github.com Update WidgetStatesController docs (flutter/flutter#150081) 2024-06-12 tessertaha@gmail.com [Reland] Fix `SegmentedButton` clipping when drawing segments (#149739) (flutter/flutter#150090) 2024-06-12 nate.w5687@gmail.com Fix markdown hyperlinks in the style guide (flutter/flutter#150071) 2024-06-12 magder@google.com Update packages desktop PR triage link lables (flutter/flutter#150124) 2024-06-12 victorsanniay@gmail.com Add mouse cursor property to `CupertinoRadio` (flutter/flutter#149681) If this roll has caused a breakage, revert this CL and stop the roller using the controls here: https://autoroll.skia.org/r/flutter-packages Please CC bmparr@google.com,rmistry@google.com,stuartmorgan@google.com on the revert to ensure that a human is aware of the problem. To file a bug in Packages: https://github.com/flutter/flutter/issues/new/choose To report a problem with the AutoRoller itself, please file a bug: https://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

@OverRide

…r#149739) (flutter#150090) Relands flutter#149739 which was reverted due to flutter#149851 --- fixes [`SegmentedButton` doesn't clip properly when one of the segments has `ColorFiltered`](flutter#144990) ### Code sample <details> <summary>expand to view the code sample</summary> ```dart import 'package:flutter/material.dart'; void main() => runApp(const MyApp()); class MyApp extends StatelessWidget { const MyApp({super.key}); @OverRide Widget build(BuildContext context) { return MaterialApp( home: Scaffold( body: Center( child: SegmentedButton<int>( segments: const <ButtonSegment<int>>[ ButtonSegment<int>( value: 0, label: ColorFiltered( colorFilter: ColorFilter.mode(Colors.amber, BlendMode.colorBurn), child: Text('Option 1'), ), ), ButtonSegment<int>( value: 1, label: Text('Option 2'), ), ], onSelectionChanged: (Set<int> selected) {}, selected: const <int>{0}, ), ), ), ); } } ``` </details> ### Before ![before](https://github.com/flutter/flutter/assets/48603081/b402fc51-d575-4208-8a71-f798ef2b2bf5) ### After ![after](https://github.com/flutter/flutter/assets/48603081/77a5cac2-ecef-4381-a043-dbb5c91407ec) *Replace this paragraph with a description of what this PR is changing or adding, and why. Consider including before/after screenshots.* *List which issues are fixed by this PR. You must list at least one issue. An issue is not required if the PR fixes something trivial like a typo.* *If you had to change anything in the [flutter/tests] repo, include a link to the migration guide as per the [breaking change policy].*

@OverRide

…r#149739) (flutter#150090) Relands flutter#149739 which was reverted due to flutter#149851 --- fixes [`SegmentedButton` doesn't clip properly when one of the segments has `ColorFiltered`](flutter#144990) ### Code sample <details> <summary>expand to view the code sample</summary> ```dart import 'package:flutter/material.dart'; void main() => runApp(const MyApp()); class MyApp extends StatelessWidget { const MyApp({super.key}); @OverRide Widget build(BuildContext context) { return MaterialApp( home: Scaffold( body: Center( child: SegmentedButton<int>( segments: const <ButtonSegment<int>>[ ButtonSegment<int>( value: 0, label: ColorFiltered( colorFilter: ColorFilter.mode(Colors.amber, BlendMode.colorBurn), child: Text('Option 1'), ), ), ButtonSegment<int>( value: 1, label: Text('Option 2'), ), ], onSelectionChanged: (Set<int> selected) {}, selected: const <int>{0}, ), ), ), ); } } ``` </details> ### Before ![before](https://github.com/flutter/flutter/assets/48603081/b402fc51-d575-4208-8a71-f798ef2b2bf5) ### After ![after](https://github.com/flutter/flutter/assets/48603081/77a5cac2-ecef-4381-a043-dbb5c91407ec) *Replace this paragraph with a description of what this PR is changing or adding, and why. Consider including before/after screenshots.* *List which issues are fixed by this PR. You must list at least one issue. An issue is not required if the PR fixes something trivial like a typo.* *If you had to change anything in the [flutter/tests] repo, include a link to the migration guide as per the [breaking change policy].*

… (#149739) (flutter/flutter#150090)

flutter/flutter@b1f9d71...01db23b 2024-06-13 engine-flutter-autoroll@skia.org Roll Flutter Engine from c7fcbfce608f to 4cb3025d3abf (28 revisions) (flutter/flutter#150199) 2024-06-13 dkwingsmt@users.noreply.github.com Revert "[CupertinoActionSheet] Add sliding tap gesture" (flutter/flutter#150147) 2024-06-13 hans.muller@gmail.com RawScrollbar: don't listen for drag gestures when scrolling is not possible (flutter/flutter#149925) 2024-06-13 katelovett@google.com Update testowners (flutter/flutter#150141) 2024-06-12 109111084+yaakovschectman@users.noreply.github.com Revert "Reland 2: [CupertinoActionSheet] Match colors to native" (flutter/flutter#150142) 2024-06-12 dkwingsmt@users.noreply.github.com Reland 2: [CupertinoActionSheet] Match colors to native (flutter/flutter#150129) 2024-06-12 49699333+dependabot[bot]@users.noreply.github.com Bump actions/checkout from 4.1.6 to 4.1.7 (flutter/flutter#150132) 2024-06-12 49699333+dependabot[bot]@users.noreply.github.com Bump github/codeql-action from 3.25.8 to 3.25.9 (flutter/flutter#150133) 2024-06-12 15619084+vashworth@users.noreply.github.com Improve build time when using SwiftPM (flutter/flutter#150052) 2024-06-12 gspencergoog@users.noreply.github.com Reland: Request focus if accessibility focus is given to a Focus widget (#142942) (flutter/flutter#149840) 2024-06-12 52160996+FMorschel@users.noreply.github.com Update WidgetStatesController docs (flutter/flutter#150081) 2024-06-12 tessertaha@gmail.com [Reland] Fix `SegmentedButton` clipping when drawing segments (#149739) (flutter/flutter#150090) 2024-06-12 nate.w5687@gmail.com Fix markdown hyperlinks in the style guide (flutter/flutter#150071) 2024-06-12 magder@google.com Update packages desktop PR triage link lables (flutter/flutter#150124) 2024-06-12 victorsanniay@gmail.com Add mouse cursor property to `CupertinoRadio` (flutter/flutter#149681) If this roll has caused a breakage, revert this CL and stop the roller using the controls here: https://autoroll.skia.org/r/flutter-packages Please CC bmparr@google.com,rmistry@google.com,stuartmorgan@google.com on the revert to ensure that a human is aware of the problem. To file a bug in Packages: https://github.com/flutter/flutter/issues/new/choose To report a problem with the AutoRoller itself, please file a bug: https://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

github-actions Bot added framework flutter/packages/flutter repository. See also f: labels. p: material_ui material_ui package in flutter/packages labels Jun 12, 2024

Update test

f78549a

TahaTesser marked this pull request as ready for review June 12, 2024 13:43

TahaTesser requested a review from QuncCccccc June 12, 2024 13:43

QuncCccccc approved these changes Jun 12, 2024

View reviewed changes

Piinks added the autosubmit Merge PR when tree becomes green via auto submit App label Jun 12, 2024

auto-submit Bot removed the autosubmit Merge PR when tree becomes green via auto submit App label Jun 12, 2024

QuncCccccc added the autosubmit Merge PR when tree becomes green via auto submit App label Jun 12, 2024

auto-submit Bot merged commit 04dc553 into flutter:master Jun 12, 2024

engine-flutter-autoroll mentioned this pull request Jun 12, 2024

Roll Flutter from 14df7be3f947 to 0c692b86ba5e (17 revisions) flutter/packages#6916

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 12, 2024

04dc553 [Reland] Fix SegmentedButton clipping when drawing segments…

0cd5466

… (#149739) (flutter/flutter#150090)

TahaTesser deleted the reland-149739 branch June 12, 2024 18:57

engine-flutter-autoroll mentioned this pull request Jun 13, 2024

Roll Flutter from b1f9d7131c8c to 034966b3ccc4 (12 revisions) flutter/packages#6919

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 13, 2024

04dc553 [Reland] Fix SegmentedButton clipping when drawing segments…

6f454d7

… (#149739) (flutter/flutter#150090)

engine-flutter-autoroll mentioned this pull request Jun 13, 2024

Roll Flutter from b1f9d7131c8c to 01db23b82233 (15 revisions) flutter/packages#6921

Merged

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jun 13, 2024

04dc553 [Reland] Fix SegmentedButton clipping when drawing segments…

a261b38

… (#149739) (flutter/flutter#150090)

Piinks mentioned this pull request Jun 28, 2024

Flutter Framework Team: Notable Commits #121415

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Aug 6, 2024

04dc553 [Reland] Fix SegmentedButton clipping when drawing segments…

b5e99fe

… (#149739) (flutter/flutter#150090)

Navigation Menu

Repository navigation

[Reland] Fix `SegmentedButton` clipping when drawing segments (#149739) - #150090

[Reland] Fix `SegmentedButton` clipping when drawing segments (#149739)#150090
auto-submit[bot] merged 2 commits into
flutter:masterfrom
TahaTesser:reland-149739

TahaTesser commented Jun 12, 2024 •

edited

Loading

Uh oh!

QuncCccccc left a comment

Uh oh!

TahaTesser commented Jun 12, 2024

Uh oh!

auto-submit Bot commented Jun 12, 2024

Uh oh!

QuncCccccc commented Jun 12, 2024 •

edited

Loading

Uh oh!

TahaTesser commented Jun 12, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

TahaTesser commented Jun 12, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Code sample

Before

After

Pre-launch Checklist

Uh oh!

QuncCccccc left a comment

Choose a reason for hiding this comment

Uh oh!

TahaTesser commented Jun 12, 2024

Uh oh!

auto-submit Bot commented Jun 12, 2024

Uh oh!

QuncCccccc commented Jun 12, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

TahaTesser commented Jun 12, 2024

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

TahaTesser commented Jun 12, 2024 •

edited

Loading

QuncCccccc commented Jun 12, 2024 •

edited

Loading