text:
BackdropFilter behaves differently on iOS and Android

Issue
When I use the BackdropFilter, it works perfectly fine on Android and blurs out the background but not the button. However, when I use it on iOS it blurs everything.

Android
iOS

Steps to Reproduce

Create a stack with some widgets
Create a backdrop filter with a blur inside the stack
Set a button as the child of the backdrop filter

Code
I've removed some of the unnecessary code to make it easier to read.
class GuestView extends StatefulWidget {
  @override
  _GuestViewState createState() => _GuestViewState();
}

class _GuestViewState extends State<GuestView> {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 20.0, vertical: 5.0),
      child: Stack(
        children: [
          SingleChildScrollView(
            physics: NeverScrollableScrollPhysics(),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.start,
              children: <Widget>[
                Icon(
                  Icons.account_circle,
                  size: 150,
                  color: Color(0xFF40444b),
                ),
                Padding(
                  padding: const EdgeInsets.only(bottom: 10.0),
                  child: RichText(
                    ...
                  ),
                ),
                AccountBadges(
                    ...
                ),
                Divider(
                  color: Theme.of(context).dividerColor,
                  thickness: 0.2,
                ),
                AccountButtonsWidget(account: null),
              ],
            ),
          ),
          BackdropFilter(
            filter: ImageFilter.blur(sigmaX: 6, sigmaY: 6),
            child: Center(
              child: Container(
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(10),
                      topRight: Radius.circular(10),
                      bottomLeft: Radius.circular(10),
                      bottomRight: Radius.circular(10)),
                  boxShadow: [
                    BoxShadow(
                      color: Colors.black.withOpacity(0.5),
                      spreadRadius: 6,
                      blurRadius: 5,
                    ),
                  ],
                ),
                child: MaterialFlatButton(
                  ...
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Logs

Logs

Windows:
[√] Flutter (Channel stable, 2.0.5, on Microsoft Windows [Version 10.0.19042.928], locale en-US)
    • Flutter version 2.0.5 at C:\Tools\flutter
    • Framework revision adc687823a (4 days ago), 2021-04-16 09:40:20 -0700
    • Engine revision b09f014e96
    • Dart version 2.12.3

[√] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    • Android SDK at C:\Users\seif\AppData\Local\Android\sdk
    • Platform android-30, build-tools 30.0.3
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b01)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[√] Android Studio (version 4.1.0)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b01)

[√] IntelliJ IDEA Ultimate Edition (version 2021.1)
    • IntelliJ at C:\Program Files\JetBrains\IntelliJ IDEA 2020.3.2
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart

[√] VS Code (version 1.55.2)
    • VS Code at C:\Users\seif\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.21.0

[√] Connected device (3 available)
    • sdk gphone x86 arm (mobile) • emulator-5554 • android-x86    • Android 11 (API 30) (emulator)
    • Chrome (web)                • chrome        • web-javascript • Google Chrome 89.0.4389.128
    • Edge (web)                  • edge          • web-javascript • Microsoft Edge 89.0.774.77

Mac:
[✓] Flutter (Channel stable, 2.0.5, on macOS 11.2.3 20D91 darwin-x64, locale en-US)
    • Flutter version 2.0.5 at /Users/seifabdelaziz/Development/flutter
    • Framework revision adc687823a (4 days ago), 2021-04-16 09:40:20 -0700
    • Engine revision b09f014e96
    • Dart version 2.12.3

[!] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
    • Android SDK at /Users/seifabdelaziz/Library/Android/sdk
    • Platform android-30, build-tools 30.0.2
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6915495)
    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor --android-licenses

[✓] Xcode - develop for iOS and macOS
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 12.4, Build version 12D4e
    • CocoaPods version 1.10.1

[✗] Chrome - develop for the web (Cannot find Chrome executable at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.

[✓] Android Studio (version 4.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      :hammer: https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      :hammer: https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6915495)

[!] Connected device
    ! No devices available

Hi @Tetracyl
Thanks for filing the issue, It might have something to do with AdMob you've, which uses platform view
Can you please reproduce the issue without using a plugin?
Your code sample is incomplete so I tried to create a complete runnable code samplem isse doesn't reproduce on iOS or Androod

code sample
import 'dart:ui';

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      home: Home(),
    );
  }
}

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Material App Bar'),
      ),
      body: GuestView(),
    );
  }
}

class GuestView extends StatefulWidget {
  @override
  _GuestViewState createState() => _GuestViewState();
}

class _GuestViewState extends State<GuestView> {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 20.0, vertical: 5.0),
      child: Stack(
        children: [
          FlutterLogo(
            size: 300,
          ),
          BackdropFilter(
            filter: ImageFilter.blur(sigmaX: 6, sigmaY: 6),
            child: Center(
              child: Container(
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(10),
                      topRight: Radius.circular(10),
                      bottomLeft: Radius.circular(10),
                      bottomRight: Radius.circular(10)),
                  boxShadow: [
                    BoxShadow(
                      color: Colors.black.withOpacity(0.5),
                      spreadRadius: 6,
                      blurRadius: 5,
                    ),
                  ],
                ),
                child: Container(
                  height: 100,
                  width: double.infinity,
                  child: Center(child: Text("Discord")),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Also using the official sample has no issue

flutter doctor -v
import 'dart:ui' as ui;

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      theme: ThemeData.dark(),
      home: Home(),
    );
  }
}

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Material App Bar'),
      ),
      body: GuestView(),
    );
  }
}

class GuestView extends StatefulWidget {
  @override
  _GuestViewState createState() => _GuestViewState();
}

class _GuestViewState extends State<GuestView> {
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 20.0, vertical: 5.0),
      child: Stack(
        fit: StackFit.expand,
        children: <Widget>[
          Text('0' * 10000),
          Center(
            child: ClipRect(
              // <-- clips to the 200x200 [Container] below
              child: BackdropFilter(
                filter: ui.ImageFilter.blur(
                  sigmaX: 5.0,
                  sigmaY: 5.0,
                ),
                child: Container(
                  alignment: Alignment.center,
                  width: 200.0,
                  height: 200.0,
                  child: Text('Hello World'),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Can you please provide your a minimal complete reproducible code sample
Thank you

You're right, it's a problem with the platform view. I could not reproduce the issue with your code sample as well, however, once I added the banner ad the issue reappeared.

Without PlatformVIew
With Platform View

Here is the reproducable code sample:
import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:native_admob_flutter/native_admob_flutter.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await MobileAds.initialize();
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      home: Home(),
    );
  }
}

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Material App Bar'),
      ),
      body: GuestView(),
    );
  }
}

class GuestView extends StatefulWidget {
  @override
  _GuestViewState createState() => _GuestViewState();
}

class _GuestViewState extends State<GuestView> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Home'),
        centerTitle: true,
      ),
      body: Column(
        children: [
          Expanded(
            child: Padding(
              padding:
                  const EdgeInsets.symmetric(horizontal: 20.0, vertical: 5.0),
              child: Stack(
                children: [
                  FlutterLogo(
                    size: 300,
                  ),
                  BackdropFilter(
                    filter: ImageFilter.blur(sigmaX: 8, sigmaY: 8),
                    child: Center(
                      child: Container(
                        decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.only(
                              topLeft: Radius.circular(10),
                              topRight: Radius.circular(10),
                              bottomLeft: Radius.circular(10),
                              bottomRight: Radius.circular(10)),
                          boxShadow: [
                            BoxShadow(
                              color: Colors.black.withOpacity(0.5),
                              spreadRadius: 6,
                              blurRadius: 5,
                            ),
                          ],
                        ),
                        child: Container(
                          height: 100,
                          width: double.infinity,
                          child: Center(child: Text("Discord")),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
          BannerAd(),
        ],
      ),
    );
  }
}

Note: You'll have to import the native_admob_flutter package.

Hi @Tetracyl
Thanks for the details
In order to reproduce the issue using minimal steps, we can use webview_flutter instead
This issue is closely related to https://github.com/flutter/flutter/issues/43902
Where blur is not applied on platform view but here in the presence of platform view, it blurs everything else on the screen. you can see the same result in my old comment https://github.com/flutter/flutter/issues/43902#issuecomment-637357435.
When we try to blur platform view on iOS, it doesn't work but it makes everything else blurry instead https://github.com/flutter/flutter/issues/43902#issuecomment-731228962

complete runnable minimal code sample
import 'dart:io';
import 'dart:ui';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:flutter/material.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      home: Home(),
    );
  }
}

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Material App Bar'),
      ),
      body: GuestView(),
    );
  }
}

class GuestView extends StatefulWidget {
  @override
  _GuestViewState createState() => _GuestViewState();
}

class _GuestViewState extends State<GuestView> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Expanded(
            child: Padding(
              padding:
                  const EdgeInsets.symmetric(horizontal: 20.0, vertical: 5.0),
              child: Stack(
                children: [
                  FlutterLogo(
                    size: 300,
                  ),
                  BackdropFilter(
                    filter: ImageFilter.blur(sigmaX: 8, sigmaY: 8),
                    child: Center(
                      child: Container(
                        decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.only(
                              topLeft: Radius.circular(10),
                              topRight: Radius.circular(10),
                              bottomLeft: Radius.circular(10),
                              bottomRight: Radius.circular(10)),
                          boxShadow: [
                            BoxShadow(
                              color: Colors.black.withOpacity(0.5),
                              spreadRadius: 6,
                              blurRadius: 5,
                            ),
                          ],
                        ),
                        child: Container(
                          height: 100,
                          width: double.infinity,
                          child: Center(child: Text("Discord")),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
          Container(height: 300, child: WebViewExample()),
        ],
      ),
    );
  }
}

class WebViewExample extends StatefulWidget {
  @override
  WebViewExampleState createState() => WebViewExampleState();
}

class WebViewExampleState extends State<WebViewExample> {
  @override
  void initState() {
    super.initState();
    // Enable hybrid composition.
    if (Platform.isAndroid) WebView.platform = SurfaceAndroidWebView();
  }

  @override
  Widget build(BuildContext context) {
    return WebView(
      initialUrl: 'https://flutter.dev',
    );
  }
}

Preview

iOS (with webview)
iOS (without webview)

flutter doctor -v
[✓] Flutter (Channel stable, 2.0.5, on macOS 11.2.3 20D91 darwin-x64, locale
    en-GB)
    • Flutter version 2.0.5 at /Users/tahatesser/Code/flutter_stable
    • Framework revision adc687823a (5 days ago), 2021-04-16 09:40:20 -0700
    • Engine revision b09f014e96
    • Dart version 2.12.3

[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    • Android SDK at /Volumes/Extreme/SDK
    • Platform android-30, build-tools 30.0.3
    • ANDROID_HOME = /Volumes/Extreme/SDK
    • Java binary at: /Applications/Android
      Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6915495)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS
    • Xcode at /Volumes/Extreme/Xcode.app/Contents/Developer
    • Xcode 12.4, Build version 12D4e
    • CocoaPods version 1.10.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 4.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6915495)

[✓] IntelliJ IDEA Community Edition (version 2021.1)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    • Flutter plugin version 55.1.5
    • Dart plugin version 211.6693.108

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

[✓] Connected device (3 available)
    • iPhone 12 (mobile) • 83060656-28E7-44CD-801E-B11EC3EC89BA • ios
      • com.apple.CoreSimulator.SimRuntime.iOS-14-4 (simulator)
    • macOS (desktop)    • macos                                • darwin-x64
      • macOS 11.2.3 20D91 darwin-x64
    • Chrome (web)       • chrome                               • web-javascript
      • Google Chrome 89.0.4389.128

• No issues found!

[✓] Flutter (Channel master, 2.2.0-11.0.pre.187, on macOS 11.2.3 20D91
    darwin-x64, locale en-GB)
    • Flutter version 2.2.0-11.0.pre.187 at
      /Users/tahatesser/Code/flutter_master
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 5526dcc24b (2 hours ago), 2021-04-20 22:34:02 -0700
    • Engine revision 610fd039ae
    • Dart version 2.14.0 (build 2.14.0-18.0.dev)

[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    • Android SDK at /Volumes/Extreme/SDK
    • Platform android-30, build-tools 30.0.3
    • ANDROID_HOME = /Volumes/Extreme/SDK
    • Java binary at: /Applications/Android
      Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6915495)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS
    • Xcode at /Volumes/Extreme/Xcode.app/Contents/Developer
    • Xcode 12.4, Build version 12D4e
    • CocoaPods version 1.10.1

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 4.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6915495)

[✓] IntelliJ IDEA Community Edition (version 2021.1)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    • Flutter plugin version 55.1.5
    • Dart plugin version 211.6693.108

[!] IntelliJ IDEA Community Edition (version unknown)
    ✗ Invalid IntelliJ version number.

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

[✓] Connected device (3 available)
    • iPhone 12 (mobile) • 83060656-28E7-44CD-801E-B11EC3EC89BA • ios
      • com.apple.CoreSimulator.SimRuntime.iOS-14-4 (simulator)
    • macOS (desktop)    • macos                                • darwin-x64
      • macOS 11.2.3 20D91 darwin-x64
    • Chrome (web)       • chrome                               • web-javascript
      • Google Chrome 89.0.4389.128

! Doctor found issues in 1 category.

I think when https://github.com/flutter/flutter/issues/43902 is fixed, this should be fixed too

Try wrapping your BackdropFilter in a ClipRect. Worked for me.

Didn't work for me.

cc @blasten. The behavior on Android should become identical to that on iOS if the application were to opt into using hybrid composition right? Once that happens, supporting the background filter in the mutator stack (we don't do this today) ought to be the next step.

Similar to https://github.com/flutter/flutter/issues/56789 ?

This actually seems to be a bug in the composition. It looks like having a platform view causes BackdropFilter to affect the entire context of the layer that the engine painted below the platform view.
@chinmaygarde - This doesn't affect the mutator stack since the part that is affected isn't the platform view, but the Flutter UI.

@chinmaygarde I am able to reproduce this bug on MacOS as well as iOS.

My app still not public because of this..

This is a regression of v1.17.0 based on https://github.com/flutter/flutter/issues/56789#issue-615247489

Bisect says https://github.com/flutter/flutter/pull/53200 is the offending commit. if the leaf_nodes_canvas is not updated, the issue doesn't occur. (For example, trying to comment out https://github.com/flutter/engine/blob/master/flow/layers/platform_view_layer.cc#L40 and the issue won't happen)
I think it might related to unobstructed platform views(https://github.com/flutter/flutter/commit/f5d25da83ceadffea850cae369f95d3fc1fde85f). I can't confirm the engine commit as I'm not able to build local engine that old.
I will further investigate, @blasten Let me know if you have any hunch.

Moving beginRecording for the canvas to paint traversal will fix the issue.
@blasten I know it is a long time ago but did you remember a particular reason the beginRecording has to happen in preroll?

After asking the skia team, I had more understanding on how backdrop filter works and now I understand the root cause of this issue.
Backdrop filter takes the pixels on the original canvas and filter them, then replace the pixels on the original canvas.
backdrop_filter_layer of Flutter engine, we apply the backdrop filter layer to all the canvas
Because with platform view, there is an additional picture recorder drawing on top of the original canvas. This picture recorder started recording in preroll traversal, which caused it to contain the backdrop filter layer.
Then when this picture recorder's picture is drawn on the original canvas, it filtered all the existing content on the original canvas, which leads to this bug.
To sum up, in this bug, 2 backdrop filter has happened, that's why both background and the text box are filtered.
Still looking for a solution.

I have drafted a document explaining the issue and proposed a potential solution. https://docs.google.com/document/d/1t_offKOgkuVzvB3fqGTfcltovb-yxqV6tbuP1qIBqVI/edit?usp=sharing
Please feel free to comment on it. Once the solution is finalized, I will start working on the implementation.

authors: QuentinSc TahaTesser Tetracyl bdlukaa blasten chinmaygarde cyanglaz flar kenthinson


text:
[Web][CanvasKit]: Locale text with punctuation such as full stop, comma position is misaligned.

Code as below

The same phenomenon occurs in Japanese.
This is a pretty big problem.
For example
"こんにちは、Flutter。"
Then
"、" And "。" move to the middle of the line.

@shenruisi
Can you provide flutter doctor -v and provide the code in formatted text instead of screenshot, so that we can directly use it to verify this issue ?
Thanks.

Hi @shenruisi and @darshankawar.
Perhaps I have a similar problem.
So I will also submit my report as one of the sample cases.
Notably, recent Mac OS updates aren't the cause.
Also, there is a beta version of Flutter 1.x that does not contain this bug.
flutter doctor -v
[✓] Flutter (Channel stable, 2.0.2, on macOS 11.3 20E232 darwin-x64, locale ja-JP)
• Flutter version 2.0.2 at /Users/morimasahide/documents/flutter
• Framework revision 8962f6dc68 (7 weeks ago), 2021-03-11 13:22:20 -0800
• Engine revision 5d8bf811b3
• Dart version 2.12.1
[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
• Android SDK at /Users/morimasahide/Library/Android/sdk
• Platform android-29, build-tools 29.0.3
• Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6915495)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 12.5, Build version 12E262
• CocoaPods version 1.10.1
[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 4.1)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/9212-flutter
• Dart plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/6351-dart
• Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6915495)
[✓] IntelliJ IDEA Ultimate Edition (version 2021.1)
• IntelliJ at /Applications/IntelliJ IDEA.app
• Flutter plugin version 55.1.5
• Dart plugin version 211.6693.108
[✓] Connected device (1 available)
• Chrome (web) • chrome • web-javascript • Google Chrome 90.0.4430.85
• No issues found!

Run the following code to find the bug.
Thank you.
class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
          child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Text(
              'こんにちは、Flutter。（Bug）',
              style: TextStyle(
                fontSize: 24,
              ),
            ),
            Text(
              'Hello, Flutter. (Correct display)',
              style: TextStyle(
                fontSize: 24,
              ),
            ),
          ],
        )
      ),
    );
  }
}

Postscript: The result is the same even if flutter upgrade.
I feel like there is a bug in Flutter 2.x.
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 2.0.5, on macOS 11.3 20E232 darwin-x64, locale ja-JP)
[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
[✓] Xcode - develop for iOS and macOS
[✓] Chrome - develop for the web
[✓] Android Studio (version 4.1)
[✓] IntelliJ IDEA Ultimate Edition (version 2021.1)
[✓] Connected device (1 available)

@MasahideMori-SimpleAppli
Thanks for the code sample and detailed report. I tried it using latest master and believe is an issue with canvaskit rendering, because using html rendering, we see the full stop at correct position as below:

with html rendering : flutter run -d chrome --web-renderer html:

With canvaskit rendering: flutter run -d chrome:

flutter doctor -v
[✓] Flutter (Channel master, 2.3.0-1.0.pre.143, on Mac OS X 10.15.4 19E2269
    darwin-x64, locale en-GB)
    • Flutter version 2.3.0-1.0.pre.143 at
      /Users/dhs/documents/fluttersdk/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision aecd5e0302 (6 hours ago), 2021-04-28 00:53:57 -0300
    • Engine revision 92ef7b59c8
    • Dart version 2.14.0 (build 2.14.0-48.0.dev)

[!] Xcode - develop for iOS and macOS
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 12.3, Build version 12C33
    ! CocoaPods 1.9.3 out of date (1.10.0 is recommended).
        CocoaPods is used to retrieve the iOS and macOS platform side's plugin
        code that responds to your plugin usage on the Dart side.
        Without CocoaPods, plugins will not work on iOS or macOS.
        For more info, see https://flutter.dev/platform-plugins
      To upgrade see
      https://guides.cocoapods.org/using/getting-started.html#installation for
      instructions.

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

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

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-x64     • Mac OS X 10.15.4 19E2269
      darwin-x64
    • Chrome (web)    • chrome • web-javascript • Google Chrome 90.0.4430.85

! Doctor found issues in 1 category.

Dear @darshankawar
Thank you for letting me know.
It helped me a lot!

@darshankawar
Sorry for reply late. If i use html render, the punctuation seems in the right position. And waiting for fixed with CanvasKit.

@MasahideMori-SimpleAppli Thanks for the code sample and detailed report. I tried it using latest master and believe is an issue with canvaskit rendering, because using html rendering, we see the full stop at correct position as below:

with html rendering : flutter run -d chrome --web-renderer html:

With canvaskit rendering: flutter run -d chrome:

flutter doctor -v

no, this is not the solution, because if i change to html render , the text style and color style will be change, please fix this problem quicklly

For Japanese texts, I was able to solve this problem.
It could be a problem with the default font.
When using the Noto Sans Japanese font, it could be displayed without any problem.
However, this solution requires font downloads, which is costly.

We're looking into this. Need to chat w/ our friends working on Skia (CanvasKit)

The font fallback rules in the engine are prioritizing a font that renders these characters at a different position (see https://github.com/flutter/engine/blob/main/lib/web_ui/lib/src/engine/canvaskit/font_fallbacks.dart)
I added logging to _getEffectiveFontFamilies and tried rendering this text.  The resulting family list was:
[Roboto, Ubuntu, Cantarell, DejaVu Sans, Liberation Sans, Arial, Roboto,
Noto Sans TC 0, Noto Sans TC 1, Noto Sans TC 2, Noto Sans SC 0, Noto Sans SC 1, Noto Sans
JP 0, Noto Sans JP 1, Noto Sans HK 0, Noto Sans HK 1, Noto Sans HK 2]

with the additional downloaded fallback fonts added in reverse alphabetical order.
If I patch _getEffectiveFontFamilies to move the Noto Sans JP fonts to the head of the list, then the characters render at the desired position.

I'm unsure of whether this is directly relevant to the above comment or how downloaded fallback fonts work... However,
because of the number of languages and characters we need to support, it is not practical for us to package the fonts into our app. Relying on user system fonts is best. Noto Sans JP is 4.5MB for a single font style alone.
Unsure of what downloaded fallback fonts do to the application loading times.

@mdrideout Be aware that in CanvasKit mode we have to download fonts even if you do not supply your own fonts. The fonts we download are sliced into many small files, so we don't fetch 4.5MB all at once, but instead we load them dynamically on-demand. The app loading time is therefore not affected, but some previously unseen characters may not render correctly or render as boxes while waiting for the font to arrive. We're looking to improve this in the future by better predicting the fonts the user may need (e.g. based on the navigator.language setting), upcoming browser APIs, and potentially adding API for developers to provide explicit signals to the Flutter engine.

Hi everyone
@kevmoo, is Skia team working on it?

An engineer on our team is looking at it. Just not sure which one, @EGabriel12

I believe this issue is fixed now:

source: gharchive/issue

authors: EGabriel12 MasahideMori-SimpleAppli darshankawar dion-li hterkelsen jason-simmons kevmoo mdrideout shenruisi yjbanov

repo: flutter/flutter

license_type: permissive

license_source: github-api


text:
UIImagePickerController is deprecated in iOS 15

Apple Introduced new Photos_picker PhotosKit in IOS_15. Apple has also deprecated asset library and UIImagePickerController.

With this new picker app do not need to ask user for permission to photo library.
Single, Multiple, infinite selection supported
Images, live photos and video filters for disable selection to that type of PhAsset
More Secure
Support all features of photos apps i.e search, zoom in and out
User can view selection in full_screen.

This all is automatically handled by PhotosKit
Originally posted by @nomi9995 in https://github.com/flutter/flutter/issues/78391#issuecomment-864258919

Hm it doesn't look hard deprecated in the iOS 15 SDK:
UIKIT_EXTERN API_AVAILABLE(ios(2.0)) API_UNAVAILABLE(tvos) NS_SWIFT_UI_ACTOR
@interface UIImagePickerController : UINavigationController <NSCoding>

I'm going to close this then, the PhotosUI framework is already used on >iOS 14 https://github.com/flutter/plugins/pull/3835.  If they actually hard deprecate in a future iOS version then we will need to add more API_AVAILABLE_ type checks to the UIImagePickerController call sites.

@jmagman this screenshot is from wwdc 2021 session https://developer.apple.com/videos/play/wwdc2020/10652/

@nomi9995 They haven't hard deprecated it in the iOS 15 SDK (yet).  Apple sometimes says things are "deprecated" as a warning that the API will deprecated and removed in a future OS, not that it's literally deprecated with a warning.  The image_picker plugins already use the PhotosUI on iOS 14 and over.  When UIImagePickerController is hard deprecated we will make sure there are no depreciation warnings in the plugin, at which point we will file a more specific bug.


text:
Linux: Unable to create a GL context when Nvidia card disabled

Flutter apps don't run on Linux based systems that disable the Nvidia graphics card from Nvidia driver settings app.
Steps to reproduce

Run Ubuntu 21.10
Make sure your computer has Nvidia GPU
Install Nvidia driver and restart
Disable Nvidia card from Nvidia settings app and force Intel graphics
restart

Now when you start your flutter app, it will run with an empty window with errors similar to below
om26er@RemotePC:~/scm/ubuntu/settings$ flutter run -d linux
Running "flutter pub get" in settings...                           41.6s
Launching lib/main.dart on Linux in debug mode...
/snap/flutter/current/usr/bin/ld: warning: /usr/lib/gcc/x86_64-linux-gnu/11/../../../x86_64-linux-gnu/crt1.o: unsupported GNU_PROPERTY_TYPE (5) type: 0xc0008002
Building Linux application...
libGL error: MESA-LOADER: failed to open swrast: /lib/x86_64-linux-gnu/libpthread.so.0: version `GLIBC_PRIVATE' not found (required by /snap/flutter/current/usr/lib/x86_64-linux-gnu/dri/../../../../lib/x86_64-linux-gnu/librt.so.1) (search paths /snap/flutter/current/usr/lib/x86_64-linux-gnu/dri, suffix _dri)
libGL error: failed to load driver: swrast

** (settings:238863): WARNING **: 23:27:41.928: Failed to start Flutter renderer: Unable to create a GL context

** (settings:238863): WARNING **: 23:27:42.034: Unable to retrieve framework response: No engine to send to

** (settings:238863): WARNING **: 23:27:42.676: Unable to retrieve framework response: No engine to send to

** (settings:238863): WARNING **: 23:27:48.306: Unable to retrieve framework response: No engine to send to
Error waiting for a debug connection: The log reader stopped unexpectedly.
Error launching application on Linux.

cc @robert-ancell

Closing the issue as it's the same as https://github.com/flutter/flutter/issues/76178


text:
Opacity widget renders Old Widget when a container without child is passed

Steps to Reproduce

Execute flutter run on the code sample

       Column(
          children: [
            Container(
              width: 100,
              height: 100,
              color: Colors.blue,
              child: Opacity(
                opacity: 1,
                child: Container(
                  padding: const EdgeInsets.all(5),
                  child: StreamBuilder<int>(
                    stream: indexStream,
                    builder: (ctx, snapshot) {
                      if (!snapshot.hasData) {
                        return const SizedBox.shrink();
                      } else {
                        final int val = snapshot.data!;
                        if (val == 1) {
                          return Container(
                            width: 40,
                            height: 40,
                            color: Colors.red,
                          );
                        } else if (val == 2) {
                          return Container(
                            width: 40,
                            height: 40,
                            color: Colors.green,
                          );
                        } else {
                          // usually would return const SizedBox.shrink() here, using container for clarity
                          return Container(
                            width: 40,
                            height: 40,
                            // uncomment either of the following two lines 'fix' the issue
                            // color: Colors.transparent,
                            // child: Text(''),
                          );
                        }
                      }
                    },
                  ),
                ),
              ),
            ),
            const SizedBox(height: 10),
            TextButton(
              onPressed: () {
                indexStream.add((indexStream.value + 1) % 3);
              },
              child: const Text('Update'),
            ),
          ],
        )

Expected results:
Page should start with pure blue color, and SHOULD toggle between 3 colors <blue, red, green> .
Actual results:
Page did start with pure blue color, but then only toggles between 2 colors <red, green> later on.
This problem also applies to the case when used with ValueNotifier and ValueListenableBuilder, and also applies to different implementations of swapping parent/child to insert opacity at different depth of the widget tree to achieve the same goal. I have experimented with different trees and the outcome is consistently wrong.
Why do I think the result is wrong?
When index change from 2 -> 0, the green container is removed from the widget tree, but is not pruned from the render tree, hence it still appears on screen.
Giving color or child to the 3rd container sort of 'fix' the problem, but this could leads to subtle bugs, Developers often return const SizedBox.shrink() for default case when no subtree should be rendered, and the resulting behavior with this issue is not consistent with documentations on how Opacity/ValueListenableBuilder/StreamBuilder works.

Hi @kairan77, Thanks for filing the issue. I am able to reproduce the issue, when Index is zero (as per the below code sample) Opacity Widget renders the old widget. Removing the Opacity widget, the code works as intended.
Here is a slightly modified code sample.

code sample
import 'dart:async';
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final StreamController<int> indexStream = StreamController<int>();

  int x = 0;
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
          body: Column(
        children: [
          Container(
            width: 100,
            height: 100,
            child: Opacity(
              opacity: 1,
              child: Container(
                padding: const EdgeInsets.all(5),
                child: StreamBuilder<int>(
                  stream: indexStream.stream,
                  builder: (BuildContext ctx, AsyncSnapshot<int> snapshot) {
                    if (!snapshot.hasData) {
                      return const SizedBox.shrink();
                    } else {
                      final int val = snapshot.data!;
                      if (val == 1) {
                        return Container(
                          width: 40,
                          height: 40,
                          color: Colors.red,
                          child: Text('counter: $val'),
                        );
                      } else if (val == 2) {
                        return Container(
                          width: 40,
                          height: 40,
                          color: Colors.green,
                          child: Text('counter: $val'),
                        );
                      } else {
                     /// This isn't rendered when index is 0
                        return Container(
                          width: 40,
                          height: 40,
                        );
                      }
                    }
                  },
                ),
              ),
            ),
          ),
          const SizedBox(height: 10),
          TextButton(
            onPressed: () {
              x++;
              indexStream.add(x % 3);
            },
            child: const Text('Update'),
          ),
        ],
      )),
    );
  }
}

flutter doctor -v
[✓] Flutter (Channel stable, 2.8.1, on macOS 12.1 21C52 darwin-arm, locale en-GB)
    • Flutter version 2.8.1 at /Users/mahesh/Documents/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 77d935af4d (13 days ago), 2021-12-16 08:37:33 -0800
    • Engine revision 890a5fca2e
    • Dart version 2.15.1

[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
    • Android SDK at /Users/mahesh/Library/Android/sdk
    • Platform android-31, build-tools 31.0.0
    • ANDROID_HOME = /Users/mahesh/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6916264)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 13.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • CocoaPods version 1.10.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 4.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6916264)

[✓] IntelliJ IDEA Community Edition (version 2021.2.1)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    • Flutter plugin version 60.1.4
    • Dart plugin version 212.5080.8

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

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-arm64   • macOS 12.1 21C52 darwin-arm
    • Chrome (web)    • chrome • web-javascript • Google Chrome 96.0.4664.110

• No issues found!

✓] Flutter (Channel master, 2.9.0-1.0.pre.205, on macOS 12.1 21C52 darwin-arm, locale en-GB)
    • Flutter version 2.9.0-1.0.pre.205 at /Users/mahesh/Documents/flutter_master
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 6ec059c994 (25 hours ago), 2021-12-28 00:29:08 -0500
    • Engine revision 31fcaf3ce4
    • Dart version 2.16.0 (build 2.16.0-134.0.dev)
    • DevTools version 2.9.2

[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
    • Android SDK at /Users/mahesh/Library/Android/sdk
    • Platform android-31, build-tools 31.0.0
    • ANDROID_HOME = /Users/mahesh/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6916264)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 13.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • CocoaPods version 1.10.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 4.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.8+10-b944.6916264)

[✓] IntelliJ IDEA Community Edition (version 2021.2.1)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    • Flutter plugin version 60.1.4
    • Dart plugin version 212.5080.8

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

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-arm64   • macOS 12.1 21C52 darwin-arm
    • Chrome (web)    • chrome • web-javascript • Google Chrome 96.0.4664.110

[✓] HTTP Host Availability
    • All required HTTP hosts are available

• No issues found!

Thanks for the quick response and for the effort to clarify the issue, enjoyed working with flutter, you guys keep up the good work!

Hi @kairan77
Here I updated the @maheshmnj example with opacity changes, looks like this is saving widget layer hence the green box is displayed. If you change the opacity to 0.0 (transparent) and back to 1.0, the green box is gone.

minimal code sample
import 'dart:async';

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      theme: ThemeData.dark(),
      home: const Home(),
    );
  }
}

class Home extends StatefulWidget {
  const Home({Key? key}) : super(key: key);

  @override
  State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
  final StreamController<int> indexStream = StreamController<int>();
  int x = 0;
  double opacityValue = 1.0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Column(
          children: [
            Container(
              width: 100,
              height: 100,
              color: Colors.blue,
              child: Opacity(
                opacity: opacityValue,
                child: Container(
                  padding: const EdgeInsets.all(5),
                  child: StreamBuilder<int>(
                    stream: indexStream.stream,
                    builder: (BuildContext ctx, AsyncSnapshot<int> snapshot) {
                      if (!snapshot.hasData) {
                        return const SizedBox.shrink();
                      } else {
                        final int val = snapshot.data!;
                        print('val: $val');

                        if (val == 1) {
                          return Container(
                            width: 40,
                            height: 40,
                            color: Colors.red,
                            child: Text('counter: $val'),
                          );
                        } else if (val == 2) {
                          return Container(
                            width: 40,
                            height: 40,
                            color: Colors.green,
                            child: Text('counter: $val'),
                          );
                        } else {
                          print('else?');

                          /// This isn't rendered when index is 0
                          return Container(
                            width: 20,
                            height: 20,
                          );
                        }
                      }
                    },
                  ),
                ),
              ),
            ),
            const SizedBox(height: 10),
            TextButton(
              onPressed: () {
                x++;
                indexStream.add(x);
              },
              child: const Text('Update'),
            ),
          ],
        ),
        floatingActionButton: FloatingActionButton(onPressed: () {
          setState(() {
            opacityValue == 1.0 ? opacityValue = 0.0 : opacityValue = 1.0;
          });
        }));
  }
}

Probably related to https://github.com/flutter/flutter/issues/93899
cc: @flar

This is part of a set of issues related to https://github.com/flutter/flutter/pull/90017

@TahaTesser https://github.com/flutter/flutter/issues/93899 is not a bug, it is a note that we can expand an existing optimization to more cases in the future.
This problem bisects to https://github.com/flutter/flutter/pull/90017 as @jason-simmons mentioned.

@dnfield

This is a general problem with oldLayer as it is used in proxy_box.dart. Here's a smaller example that shows the same problem with ClipRect:
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      theme: ThemeData.dark(),
      home: const Home(),
    );
  }
}

class Home extends StatefulWidget {
  const Home({Key? key}) : super(key: key);

  @override
  State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
  int? x;
  double opacityValue = .9;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Column(
          children: [
            ClipRect(
              // opacity: opacityValue,
              child: Builder(
                  builder: (BuildContext ctx) {
              if (x == null) {
                return const SizedBox.shrink();
              } else {
                final int val = x!;
                print('val: $val');

                if (val == 1) {
                  return Container(
                    width: 40,
                    height: 40,
                    color: Colors.red,
                    child: Text('counter: $val'),
                  );
                } else if (val == 2) {
                  return Container(
                    width: 40,
                    height: 40,
                    color: Colors.green,
                    child: Text('counter: $val'),
                  );
                } else {
                  print('else?');

                  /// This isn't rendered when index is 0
                  return Container(
                    width: 20,
                    height: 20,
                  );
                }
              }
                  },
                ),
            ),
            const SizedBox(height: 10),
            TextButton(
              onPressed: () {
                setState(() {
                  x = (x ?? 0) + 1;
                });
              },
              child: const Text('Update'),
            ),
          ],
        ),
        floatingActionButton: FloatingActionButton(onPressed: () {
          setState(() {
            opacityValue == 1.0 ? opacityValue = 0.0 : opacityValue = 1.0;
          });
        }));
  }
}

Hm. I spoke too soon. Still looking at what's special about opacity layers here.

authors: TahaTesser dnfield flar jason-simmons kairan77 maheshmnj


text:
ListView content vanishes when scrolled up

customer:tunes has a funny bug in their app (which we have not yet reduced) whereby their ListView when scrolled down works fine (on both iOS and Android), but then when scrolled up on Android the contents vanish.
This is what they had to say:

I have isolated that odd Android ListView issue.  When I pull out the top banner carousel on our home screen, the issue goes away.  I had a hunch that might be where the problems were, because it’s a little bit complex up there as a TabBarView sitting in a Column above a TabPageSelector requiring a new TabController instance to drive the page selector which in return requires the widget to be a StatefulWidget with a TickerProviderStateMixin.  The mixin is needed to satisfy the requirement for a TickerProvider as the ‘vsync’ parameter in the TabController constructor.  Yikes.
Anyway, I am reasonably confident based on documentation and examples that this was implemented correctly, and it does work on iOS just fine.

Working on getting a reproduction, but in case you have thoughts from the above @Hixie I've filed this.  (CC @FaisalAbid)

@FaisalAbid did we have any further insight as to what might be causing this?

https://github.com/flutter/flutter/issues/10453 might be a reproducible case of this?

@FaisalAbid Does this still happen for you? I believe we fixed this in #10574.

@FaisalAbid We're going to close this because we believe we've fixed it; please don't hesitate to reopen it if it's not fixed!

authors: Hixie eseidelGoogle


text:
Element? ancestor = dependent._parent;

Steps to Reproduce

Execute flutter run on the code sample
...
...

Expected results:
Actual results:

Code sample

Logs

Hi @wdyWang ,
When opening an issue, please try to provide all or some of the information indicated in the template.

Issue Template
If you are looking for support, please check out our documentation
or consider asking a question on Stack Overflow:
- https://flutter.dev/
- https://api.flutter.dev/
- https://stackoverflow.com/questions/tagged/flutter?sort=frequent

If you have found a bug or if our documentation doesn't have an answer
to what you're looking for, then fill our the template below. Please read
our guide to filing a bug first: https://flutter.dev/docs/resources/bug-reports

Steps to Reproduce

Please tell us exactly how to reproduce the problem you are running into.

Please attach a small application (ideally just one main.dart file) that
reproduces the problem. You could use https://gist.github.com/ for this.

If the problem is with your application's rendering, then please attach
a screenshot and explain what the problem is.

1. ...
2. ...
3. ...

Please tell us which target platform(s) the problem occurs (Android / iOS / Web / macOS / Linux / Windows)
Which target OS version, for Web, browser, is the test system running?
Does the problem occur on emulator/simulator as well as on physical devices?

Target Platform:
Target OS version/browser:
Devices:

Run your application with `flutter run --verbose` and attach all the
log output below between the lines with the backticks. If there is an
exception, please see if the error message includes enough information
to explain how to solve the issue.

Run `flutter analyze` and attach any output of that command below.
If there are any analysis errors, try resolving them before filing this issue.

Finally, paste the output of running `flutter doctor -v` here.

Closing this issue, since no information has been provided.
Thank you.

authors: danagbemava-nc wdyWang


text:
[flutter_releases] Flutter beta 3.4.0-34.0.pre Framework Cherrypicks

Flutter beta 3.4.0-34.0.pre Framework
Scheduled Cherrypicks

None

The following test is failing: Mac verify_binaries_codesigned

source: gharchive/pull-request


text:
Roll Flutter Engine from 527a8bd372f3 to d2d00bec856a (3 revisions)

https://github.com/flutter/engine/compare/527a8bd372f3...d2d00bec856a
2023-02-24 109111084+yaakovschectman@users.noreply.github.com Unregister the FlutterWindowsView on its destruction (flutter/engine#39824)
2023-02-24 flar@google.com remove obsolete DisplayListCanvasRecorder and its tests (flutter/engine#39844)
2023-02-24 flar@google.com uncomment a DL raster cache unittest enhancement now that it is feasible (flutter/engine#39845)
If this roll has caused a breakage, revert this CL and stop the roller
using the controls here:
https://autoroll.skia.org/r/flutter-engine-flutter-autoroll
Please CC chinmaygarde@google.com,rmistry@google.com,zra@google.com on the revert to ensure that a human
is aware of the problem.
To file a bug in Flutter: https://github.com/flutter/flutter/issues/new/choose
To report a problem with the AutoRoller itself, please file a bug:
https://bugs.chromium.org/p/skia/issues/entry?template=Autoroller+Bug
Documentation for the AutoRoller is here:
https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

Commit queue failed; closing this roll.


text:
Roll Flutter Engine from b5b41ff66dae to 9c428b2f0a21 (5 revisions)

https://github.com/flutter/engine/compare/b5b41ff66dae...9c428b2f0a21
2023-08-09 skia-flutter-autoroll@skia.org Roll Skia from 25aedb939915 to d210bab77137 (2 revisions) (flutter/engine#44550)
2023-08-09 skia-flutter-autoroll@skia.org Roll Fuchsia Mac SDK from e7bMhkfY-RPMrSMhB... to zoCGnScKZWbm5s9Hy... (flutter/engine#44548)
2023-08-09 skia-flutter-autoroll@skia.org Roll Skia from 17ba2122707b to 25aedb939915 (3 revisions) (flutter/engine#44547)
2023-08-09 47866232+chunhtai@users.noreply.github.com Android a11y bridge sets importantness (flutter/engine#44452)
2023-08-09 skia-flutter-autoroll@skia.org Roll Fuchsia Linux SDK from tO6r8iQqnmsYkLcvZ... to ZCP8LDbKF4LTBFz_W... (flutter/engine#44545)
Also rolling transitive DEPS:
fuchsia/sdk/core/linux-amd64 from tO6r8iQqnmsY to ZCP8LDbKF4LT
fuchsia/sdk/core/mac-amd64 from e7bMhkfY-RPM to zoCGnScKZWbm
If this roll has caused a breakage, revert this CL and stop the roller
using the controls here:
https://autoroll.skia.org/r/flutter-engine-flutter-autoroll
Please CC chinmaygarde@google.com,rmistry@google.com,zra@google.com on the revert to ensure that a human
is aware of the problem.
To file a bug in Flutter: https://github.com/flutter/flutter/issues/new/choose
To report a problem with the AutoRoller itself, please file a bug:
https://bugs.chromium.org/p/skia/issues/entry?template=Autoroller+Bug
Documentation for the AutoRoller is here:
https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

Commit queue failed; closing this roll.


text:
Widget state properties

Fixes #138270.
Moves the majority of the logic of MaterialStateProperties down to the widgets layer, then has the existing Material classes pull from the widgets versions.
Pre-launch Checklist

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

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

If we make the MaterialStates a distinct type from WidgetStates developers will not be able use them interchangeably. That might be counterproductive and if we don't have a important use case to motivate the distinction it might be easier to just have one definition of the set of valid component states.

Converting to a draft. Will make a branch off of this one to test flutter fixes.

@goderbauer @HansMuller @Piinks This is ready for review

Migration guide draft here: https://github.com/flutter/website/pull/10194

I just learned about this so my apologies for being late to the table.
I'm a little concerned about putting this API in the widgets library. The MaterialStateProperty API is rather awkward to use from a developer's perspective. I think it's fine for Material (and probably Cupertino) but I wouldn't want us to start using this at the widgets level (e.g. in TextField), because that would force other UI libraries built on Flutter to use it whenever they wanted to interact with the widgets layer, and different UI libraries have different ideas of what that should look like (e.g. have different groups of state properties, different mechanisms for animating them, etc). This would complicate any package that's trying to provide an alternative API to the material API (for example, blankcanvas).
Assuming the goal here is to be able to use this in Cupertino, is there some way we can create a library common to material and cupertino that layers above widgets?
If that's not the goal, is there any discussion somewhere about the goal? For example, which widgets would we want to be using this with? In general the widgets library widgets don't have theming at all so there isn't typically a need to handle widget states, but maybe there's cases I'm missing.

@Piinks do you know examples of where being able to use MaterialState-like logic would be useful in the Widgets layer?
My personal goal is to make this available to Cupertino, but I received feedback that this would be useful in the Widgets layer as well. Which makes sense, nothing MaterialState does is particularly Material specific, and if it's useful to Cupertino, it could be seen as being useful for third party APIs as well that use neither Material or Cupertino.
As far as I'm aware, there is no plan to use WidgetState in a major way across the base Widgets. If there is a concern about increasing complexity by using WidgetState in them, we can either just be careful about where we use them, or we can try and find a way to make them not required to use.
Having it live somewhere other than the Widgets layer is interesting, but I think there is value in having it broadly available outside of Material and Cupertino.

Having a layer between widgets and cupertino would keep it available for everyone except the widgets layer itself. But I'm curious to learn more about the use cases in the widgets layer before we add a new layer, there's definitely costs to doing that too!
(If we decide to not use this at the widgets layer I would hesitate to rely on just us "being careful", because this is the kind of thing where it's very easy for someone to introduce usages without being aware of the tradeoffs.)

I agree about the WidgetState classes being aimed at components and libraries that are layered on top of the widgets library, rather than than the widget library widgets themselves. For Flutter that means the Material and Cupertino libraries. For app developers the WidgetState classes might be used in custom components or to build new component libraries like Material or Cupertino.  Maybe these classes belong in the foundation library and should be called InteractiveState instead of WidgetState?

Unfortunately a lot of this code depends on things in the painting, rendering, and widgets layers, IIRC.
(One thing we could do is just put it in the cupertino layer, it's a layer above widgets but below material that is visible from material and cupertino. That would avoid the cost of creating a new layer.)

Although Cupertino might technically be a layer below Material, it seems odd to put this there. Moving it from the material library to the widgets library was intended to disassociate it from a "design language".

I always thought cupertino and material were parallel, rather than above or below each other
I don't believe Cupertino imports Material anywhere, but Material regularly imports Cupertino. To the point where if you try and import Material in Cupertino, it creates a circular dependency error. Which is why adaptive widgets are all Material components. They are ideologically parallel, but in practice, Cupertino in a layer lower.

Besides possibly this, is there much value in a layer between Material/Cupertino and Widgets? It would be used for shared code that we want available between both design languages, but we would also not want available in Widgets or below, which I feel may not be a very common case.

We’ve heard from multiple package authors that they would like to be able to make use of state properties, but the moniker of _Material_StateProperty makes using them outside of the context of the material library confusing.

It would be good to learn more about this. I've never seen anyone ask to use MaterialStateProperty; in fact pretty much the only feedback I've seen about MaterialStateProperty is that it's intimidating in its complexity for developers. I'm happy to believe that there's demand for it, though; do you have any pointers to discussions where people are looking for this?

There are many design language libraries now on pub, so this would not only apply to the cupertino and material libraries.

There's really not that many really, and as far as I can tell, all of them depend on Material in some way or other, FWIW. (I did a bunch of research on this for blankcanvas; the data is a bit out of date but can be seen in that design doc.)

@Hixie: the widgets library widgets don't have theming at all so there isn't typically a need to handle widget states

I don’t see this as related to theming, MaterialStateProperties are not exclusive to ThemeData and component themes in the material library, many are defined on individual widgets. Can you say more about that?

Sorry by theming I just mean "having colors" and stuff. The closest I can see to a widget that has a concept of color/look/feel is EditableText, and it's a rather special case. Are there others?

@Hixie: One thing we could do is just put it in the cupertino layer, it's a layer above widgets but below material that is visible from material and cupertino.

I always thought cupertino and material were parallel, rather than above or below each other, but can you say more about that @Hixie? They both import each other in different places.

Cupertino doesn't import material (that's enforced by tests). It's a layer under Material (so that Material can do adaptive widgets).

do you have any pointers to discussions where people are looking for this?

Last year a study was conducted to discover pain points for developers trying to implement their own design languages. I don't know what has been published about that, and the primary POC on that study is no longer on the team, but I've reached out to see if there is anything. Some of the issues identified in that study are under this label: https://github.com/flutter/flutter/issues?q=is%3Aopen+is%3Aissue+label%3A"Design+Systems+Study"

There's really not that many really, and as far as I can tell, all of them depend on Material in some way or other, FWIW.

This is something we are actively working on changing here - better supporting custom design languages that will not have to depend on the material library. Tools like Figma are wildly popular in app development, more often we have been hearing that developers are struggling to implement their custom design in Flutter.

Sure, that's the same reasoning behind blankcanvas.
I think it makes sense to provide mechanisms to help with that. I don't think it makes sense for those to be baked into the core framework (widgets and below) though, because every time we do that, we end up requiring that design languages use that solution to the exclusion of other options, otherwise they can't interoperate with each other (either literally or because the conventions become so expected of developers). Layering is core to our design philosophy so I think it's important that we maintain that.
If we want to provide tools that are used both by material/cupertino and custom design languages, like AppColor, generic Switch or Slider widgets, etc, then that really does seem to be a good reason to introduce a layer below cupertino and above widgets, and whatever we use to solve the widget state properties problem would be an ideal fit for that layer.
IMHO if we want to go down that path we should do some design work first and prototype the building blocks we are creating. This would be a significant new direction for the project. Getting a framework right is difficult and changing it later is incredibly difficult (consider the difference between changing the RenderObject protocol vs changing a material widget).

I don't think it makes sense for those to be baked into the core framework (widgets and below) though, because every time we do that, we end up requiring that design languages use that solution to the exclusion of other options,

I don't think that is the intention of this change.

If we want to provide tools that are used both by material/cupertino and custom design languages, like https://github.com/flutter/flutter/issues/138365, generic https://github.com/flutter/flutter/issues/138276 or https://github.com/flutter/flutter/issues/138275 widgets, etc, then that really does seem to be a good reason to introduce a layer

I don't know that we need another layer for these concepts. The study showed that users expect these things from the widgets layer, as basic core concepts Flutter should be able to support without the material library. There are a fair number of widgets in the widgets library that could benefit from stateful properties. And we already blur the line between the design language and widget libraries - the overscroll indicator is a good example. That implements the material design language in the widgets library. There are Cupertino concepts and classes designed and implemented in the material library. The division between these layers is not perfect, and I don't know if it can be, but I think adding another layer would create more complexity for users, instead of making this easier for them.

I don't think it makes sense for those to be baked into the core framework (widgets and below) though, because every time we do that, we end up requiring that design languages use that solution to the exclusion of other options,

I don't think that is the intention of this change.

I agree it's not the intention, but it is what would happen.

I don't know that we need another layer for these concepts. The study showed that users expect these things from the widgets layer, as basic core concepts Flutter should be able to support without the material library.

Can you share this study's results? I find it difficult to see how a study could determine that specifically.

There are a fair number of widgets in the widgets library that could benefit from stateful properties.

Do you have any examples? This is a key factor in this discussion.

And we already blur the line between the design language and widget libraries -

Yes, but having gone done a little bit of the slippery slope it is our responsibility to crawl back up, not slide all the way down.

the overscroll indicator is a good example. That implements the material design language in the widgets library.

Our intent was to implement Android in the widgets library, not material design. (For example, material design doesn't glow or stretch on web, iOS, or macOS, nor on Windows or Linux if I'm not mistaken). This is something that any Android-supporting design language might have wanted to support, which is why we put the glow indicator there originally.
That said, if we had the layer we're discussing here, I think the glow/stretch effect would actually be a very good candidate for moving up from widgets; we would need to study exactly what such a layer's goals were and what the right trade-offs are to make that determination.

There are Cupertino concepts and classes written and implemented in the material library.

Do you have specific examples in mind here? As far as I can tell, the cupertino library is intended to be usable in isolation, and does not depend on material.

The division between these layers is not perfect, and I don't know if it can be, but I think adding another layer would create more complexity for users, instead of making this easier for them.

Most developers wouldn't be exposed to this layer, just like most aren't exposed to the animation and painting layers. I would expect material to re-export the entire layer and for design language package authors to be the primary audience.
That said, I'm not specifically arguing that we should have a design language layer, what I'm asking for is a design discussion where we consider how we will approach the needs of the developers you have raised, so that we can build a system that will definitely be useful and minimizes our maintenance burden long term while maximizing the value-per-effort for us. We cannot reasonable evaluate the proposal in this PR without discussing the bigger picture.

I agree it's not the intention, but it is what would happen.

To clarify this further since it wasn't a very eloquently made point: features we put into the core widgets layer are things that developers and package authors will come to assume are available in all design languages based on the widgets layer. This is a natural result of such an API design; much like developers assume that Decorations are available, or that DefaultTextStyle is how text style defaults are set, or that widgets should update the information in a MediaQuery. If we put things in an intermediary "design" layer (say), we signal to developers and especially package authors that there is a decision point: are you building on top of "widgets" or are you building on top of "design". This is similar to how today, package authors can decide if they want to depend on "material" or "widgets". (Today developers of design languages largely pick "material" because depending on "widgets" means doing a lot more work, e.g. introducing your own localizations; but if we did decide that providing them an intermediary layer made sense, they would have a more meaningful choice.)

I'm playing around to see if there's a way to make state properties easier to work with, as regardless, that would be nice to have. Maybe there's a way to, for example, if a property is looking for a WidgetStateProperty<double>, if it is provided a simple double, then it would be able to infer that it is the same as WidgetStatePropertyAll(<double>).
For the new layer question, I think I like the idea of having a "design" layer that is focused on the building blocks of making a custom design. Working on Cupertino, the fact that so much of Material and Cupertino are completely separated is a common pain point, particularly with the themes. If they shared a common ancestor theme, it would make adaptability much easier. And especially when you get into component themes, the theming in Material is very complex, which if we want to get Cupertino to the same level as Material, we would want to write again in Cupertino from scratch, which feels wrong.
But maybe I'm hung up on the names of the layers because this specific logic doesn't feel like it has anything to do with design, state feels more basic than that. If the main concern is complexity, as is, if a package author wants to extend off of a widget class that we did end up using a state property for, couldn't they side step it by converting their property to the simple type? As in:
ClassName({
   borderSide, // Type double
}) : super(
  borderSide: WidgetStatePropertyAll(borderSide),
)

So their class would then be able to use a simpler value. I feel like if somebody is going down into the Widgets layer to make their own package would rather have the usability of this logic, rather than get spooked by it, or felt beholden to it.
That said, if there was a way to do this automatically, that would be preferable.

I think those are really good questions and are exactly the kinds of questions that we (certainly I) would need more information to answer.
Maybe it would make sense to get together and write a design doc collaboratively?

I'd like to add some feedback to the topic as someone who has used Flutter in two startups and is now responsible for implementing a custom design system for Flutter (with extensive Figma to code automated tokenisation) in a 1000+ person corporation with ca 20 products and heavy multi-branding.
In startups it was always more time efficient to write wrapper widgets around Material widgets, finding magical property combinations on the Material widgets or push back on the design to align more with Material to realise the product designs.
Implementing a mature design system for Flutter though is a whole other matter. Using a translation layer around Material (or Material theming) is pretty much a no-go due to inconsistent api from widget to widget (Button has ButtonStyle - super! but RawChip has a soup of styling properties - not so super), baked in animation k constants (I don't even dare to guess the rationale behind that), missing industry standard components like Toast or the general behavioural fighting against the opinionated Material way.
So after a years worth of effort from two engineers basically removing Material specifics from Material widgets and making them more extensible our custom widgets library that can actually consume w3c design tokens proposal compliant composite component tokens (that get automated from Figma -> style-dictionary -> tokens library), is nearing 1.0.0 release. And honestly we are already planning for 2.0.0 to tackle the whole thing in a non-idiomatic to Material widgets / Flutter way in an effort to aggressively reduce the maintenance surface area and improve on delivery times. So to answer @Hixie observation on why there are so few custom design libraries out there, the answer is cost. It is simply too expensive to create and maintain one with the current Flutter toolbox.
Looking back at the whole effort retrospectively and holistically one is left with a lot of questions and musings. The internals of Material widgets library has strong Conways law vibe to it. Where is the missing reusable base widgets layer between the low level primitives and the Material widgets? Why are animation durations and curves baked in vs either doing a theme lookup or being overridable via widget api? Why are the Material widgets api's so inconsistent widget to widget? Why not use SomeStaticStyle and SomeAnimationStyle objects to describe the visual configuration of the widgets vs having a property soup? Why are theming lookups baked in to widgets vs using dependency injection? Why is there no real separation of concerns within widgets in regards to what is the visual configuration and what is the behavioural machinery? etc etc
I am personally hoping for well thought out set of base widgets in Flutter. Or failing that even having a base Box widget that takes in a Style object reacting to WidgetState + AnimationStyle object and a base layout widget reacting to WidgetState would probably allow to visually represent majority of (custom) widgets out there. I'm also hoping that Flutter would align more towards the w3c design tokens proposal in its approach to theming (nowadays the whole components/widgets visual configuration is serialisable via composite design tokens straight from Figma for instance).
TLDR: This is a very long winded way from me to say yes please to this PR as this would be a right step towards supporting custom design libraries (along with the pre-existing superb ThemeExtension and AnimationStyle classes). And hopefully in the future we see that the individual style property soup in widgets being replaced with SomeWidgetStyle and AnimationStyle properties in the Material widgets library also.

@Kypsis - thanks for all the feedback! We're always working to evolve Flutter's API: to make it more capable, flexible, and (believe it or not) consistent. Appreciate your feedback about what works and what hinders building highly custom toolkits.  We're very interested in that use case and appreciate the voice of experience.

To add more weight to my feedback and not have it be a case of just "sample size of 1" I would like to point out the existence of two packages.
First the popularity of https://pub.dev/packages/flex_color_scheme is very much indicative of the problematic nature of working with Material theming and not only from the pov of a custom design system.
Second library is https://github.com/conceptadev/mix by your own GDE @leoafarias. That project I find especially intriguing as it shows deep insight to current status quo of trying to make custom design systems work with Flutter, taking a step back and looking at the problem space holistically. I.e. how to represent the visual configuration + its reactivity and the base widgets consuming it. The UI companion library https://github.com/conceptadev/remix_ui is an excellent demo how little effort it can take when you have well thought out base layer to work with. The value proposition of Mix kind of approach makes it a top contender for the 2.0.0 version of our widget library to write a more idiomatic to Flutter translation layer around it.
The discussions I read in various Flutter PRs that touch upon the missing base widgets layer and the general direction the Material widgets are moving towards is in my opinion in many ways missing the forest for the trees. Every discussion on the topic seems to be tinted by what is a breaking change and what competes or conflicts with this and that. The solution inevitably seems to devolve to yet another property added to SomeMaterialWidget and the overall "entropy" of the whole system increases. The worst example of this is notoriously hard to grok and style TextField widget which if you include theInputDecoration class has well over 100 distinct properties (and couple more seem to be added every new Flutter release). Surely at some point this "propitis" approach will become untenable.
So my closing thoughts on the matter are that maybe it is not so much that we need a better themable Button (which is still a point solution) but also a better way to build the said Button. The aforementioned Mix package is a good example of a solution to that problem. In my opinion building a base widget layer might present a golden opportunity for Flutter team to apply insights gained by near decade of Flutter development (the good, bad and ugly) without stepping on the toes of Material widget library.
Apologies again for the wall of text.

I've read the conversation above I am a bit confused. @Hixie has raised some good points but then, after a meeting (?) the PR got approved without any of those points being addressed.
For reference, this is state of a button in our design system:
enum SelectionState {
  on,
  off,
  mixed,
}

class ButtonState {
  ButtonState({
    this.selected = SelectionState.off,
    this.enabled = false,
    this.focused = false,
    this.hovered = false,
    this.pressed = false,
    this.tracked = false,
  });

  /// Determines selection state of the control.
  final SelectionState selected;

  /// Control is enabled and can be interacted with.
  final bool enabled;

  /// Control has keyboard focus.
  final bool focused;

  /// Control is being hovered over by a pointer.
  final bool hovered;

  /// Control is being pressed. When pointer is released without leaving the
  /// control, the control will receive a tap event.
  final bool pressed;

  /// Control is receiving pointer events but the pointer may or may not be
  /// hovering over the control.
  final bool tracked;

  ...
}

It's pretty simple as far as states go, but even then it cannot be represented by WidgetState because of indeterminate selection state. If a pretty standard desktop checkbox can't be represented by WidgetState does it really belong to the base widgets package?
On top of that WidgetState has scrolledUnder, which was clearly added there with material in mind.
Btw, having simple class with bunch of properties is much nicer to use than a set of enums. But that's not the main point.
I'm not against having widget state represented in widgets package, but it shouldn't be a carbon copy of MaterialStateProperties.

In the Flutter community, the deprecation of MaterialStateProperty in favor of WidgetStateProperty on the master branch marks a significant evolution. This change signifies a departure from the previous confinement of state properties like hovered, pressed, selected, and disabled solely within the Material library. Now, these properties are more universally applicable across diverse widget types, offering developers greater flexibility in designing interactive user interfaces. This shift represents a broader adoption of state properties beyond Material design principles, fostering innovation and versatility in UI development.

I personally like MaterialState (though only in combination with flutter_hooks and ISet from fast_immutable_collections).
Maybe instead of tying the Set to a predefined Enum of possible values, instead something like
class WidgetState {
  final ISet<WidgetStateAspect> state;
}

class WidgetStateAspect {}

class Hovered extends WidgetStateAspect {}
...

could be possible?
That way it'd be easy to extend with design system specific details -- and some metadata or substate could actually be put inside of these instances.

Thanks for all the feedback about WidgetStateProperties. I would like to point out that they are just a building block that the widget library offers. If they don't work for your design language, you don't have to expose them in your API and you can (continue to) use whatever suits your needs. They have been battle-tested in the material library for years and have solved problems that we are now also facing in the Cupertino library, hence this generalization to use the same mechanism for the same problem.
Specifically about the tristate checkbox: The material Checkbox has offered tristate support for years and the material/widget states AFAIK haven't been an obstacle for that.

There are two main goals to moving state properties down to the widgets layer:

Supporting adaptive work. Cupertino has had no concept of MaterialState properties, and no way to get them. Moving state properties down to the widgets layer lets Material pass it's logic to Cupertino directly without having to make best guesses in what a MaterialState.all property should be.

Making state property logic available to package authors that want it, but do not want to use Material. This is from feedback given to the team. If developers want to use tools we already have to build on top of flutter, we don't see a reason to stop them.

There is currently no plan to use WidgetState anywhere in the base widgets, especially ones that already exist. Ideally, we'd come up with a better way to design the API for WidgetState before that happens. The negative feedback about MaterialState/WidgetState is something that we do take seriously and we do want to find a more graceful solution to it. This is not the end of improvements to WidgetState.
On MaterialState/WidgetState being Material focused: before starting this I tried to find other design systems ideas of a widgets interactive state to see if there's a reason not to make it agnostic to Material. None of the properties are, at their core, Material specific. I think if they were presented fresh under a different name outside of Flutter, nobody would go "Hey aren't these just Material design?" The weirdest one being scrolledUnder, which definitely was added with Material in mind, but I can think of one obvious place where it could be used in Cupertino, which is with the sliver navbar widget.

Specifically about the tristate checkbox: The material Checkbox has offered tristate support for years and the material/widget states AFAIK haven't been an obstacle for that.

Right. But that's only because  the checkbox MaterialState doesn't distinguish between selected and mixed. Both are "selected". As far as I can tell you can't have a different color for mixed vs selected state for example. (I'll be happy to get corrected if I'm wrong about this).

If they don't work for your design language, you don't have to expose them in your API and you can (continue to) use whatever suits your needs.

I don't think "just don't use" is a fair argument here. With this change the Widgets package now takes over material specific concepts. This has not been the case before and goes in a direction that to me is quite concerning.

Supporting adaptive work. Cupertino has had no concept of MaterialState properties, and no way to get them. Moving state properties down to the widgets layer lets Material pass it's logic to Cupertino directly without having to make best guesses in what a MaterialState.all property should be.

I guess this is my issue here: In my opinion just because something is useful for both material and Cupertino it does not necessarily mean it should go into widgets layer. Flutter ecosystem goes beyond material and Cupertino. (sidenote - I'd love to see these becoming separate packages, and I know I'm not the only one, but that's for another conversation).

authors: HansMuller Hixie Kypsis MitchellGoodwin Piinks ariba1039 benthillerkus goderbauer knopp


text:
Roll Flutter Engine from bd58d2b2d655 to eafdd2fce0dd (2 revisions)

https://github.com/flutter/engine/compare/bd58d2b2d655...eafdd2fce0dd
2024-05-08 chinmaygarde@google.com Reland "Add host_profile_arm64 and host_release_arm64 local engine configurations." (flutter/engine#52633)
2024-05-08 skia-flutter-autoroll@skia.org Roll Fuchsia Linux SDK from 27ZAbzJkEopmu0Emp... to RDVdjRvCxkJh2NLxS... (flutter/engine#52685)
Also rolling transitive DEPS:
fuchsia/sdk/core/linux-amd64 from 27ZAbzJkEopm to RDVdjRvCxkJh
If this roll has caused a breakage, revert this CL and stop the roller
using the controls here:
https://autoroll.skia.org/r/flutter-engine-flutter-autoroll
Please CC rmistry@google.com,zra@google.com on the revert to ensure that a human
is aware of the problem.
To file a bug in Flutter: 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

Commit queue failed; closing this roll.


text:
docimports for flutter_goldens, flutter_localizations, flutter_web_plugins, fuchsia_remote_debug_protocol, integration_test

Part of https://github.com/flutter/flutter/issues/150800

google testing is failing on:
Target of URI doesn't exist. #uri_does_not_exist

/// @docImport 'package:flutter_driver/flutter_driver.dart';

So, submitting this has to wait on getting that warning ignored in google3.

This required cl/651472856.


text:
Fix Shortcut label for CharacterActivator does not include modifiers

Description
This PR fixes the shortcut label for CharacterActivator with modifiers keys.
Before:

After:

Related Issue
Fixes https://github.com/flutter/flutter/issues/145040.
Tests
Adds 1 test.

@gspencergoog When you get a chance, can you have a look to the Google testing failure? (I rebased several times since last week and it fails consistently). Thanks!

@gspencergoog When you get a chance, can you have a look to the Google testing failure? (I rebased several times since last week and it fails consistently). Thanks!

I checked, and it's a real change in an app.  Let me ask them if the previous image was incorrect, and now it's correct: (it used to show just "?", and now shows "Alt+?", but I'm assuming that the "Alt+?" is actually correct).

Okay, you're good to go: this actually uncovered a bug in the app, so your change is fine.

authors: bleroux gspencergoog


text:
Replace ListTile usage with CupertinoListTile

This PR replaces the ListTile usage in the cupertino switch example with CupertinoListTile.
Fixes #154450
Pre-launch Checklist

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

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

LGTM, thanks for cleaning up

Of course! thanks for the review @piedcipher

LGTM and thanks for the change!

Thanks for the review @victorsanni!


text:
Stocks input field for company name doesn't work

We weren't listening to the onChange handler.
Fixes #1850

@collinjackson @Hixie

I wonder if we can test this with yegors new fancy?
On Sunday, February 14, 2016, Adam Barth notifications@github.com wrote:

@collinjackson https://github.com/collinjackson @Hixie
https://github.com/Hixie
—
Reply to this email directly or view it on GitHub
https://github.com/flutter/flutter/pull/1880#issuecomment-183992107.

@eseidelGoogle We could just test this with a normal unit test.  However, I don't think it's worthwhile.

Ok
On Sunday, February 14, 2016, Adam Barth notifications@github.com wrote:

@eseidelGoogle https://github.com/eseidelGoogle We could just test this
with a normal unit test. However, I don't think it's worthwhile.
—
Reply to this email directly or view it on GitHub
https://github.com/flutter/flutter/pull/1880#issuecomment-183994222.

lgtm. the value of testing this would be to set the tone for our examples, fwiw.

authors: Hixie abarth eseidelGoogle


text:
Roll engine de4c7a53f21c..5063a8a5b32c (15 commits)

https://github.com/flutter/engine/compare/de4c7a53f21c...5063a8a5b32c
git log de4c7a53f21c..5063a8a5b32c --no-merges --oneline
5063a8a5b Roll src/third_party/skia 72a02112a99f..9478f7a38e6c (1 commits) (flutter/engine#6166)
19a3bc8e1 Roll src/third_party/skia 85f4e40c5481..72a02112a99f (1 commits) (flutter/engine#6165)
9643a50ac Roll src/third_party/skia fddc6fa394cb..85f4e40c5481 (1 commits) (flutter/engine#6164)
6ad3183b1 Fix windows build. (flutter/engine#6162)
30af2f299 Roll src/third_party/skia e486bbaae296..fddc6fa394cb (2 commits) (flutter/engine#6159)
b32ceafb1 Add some more logs for diagnosing screenshot failures (flutter/engine#6156)
c173655b2 Roll src/third_party/skia b84576af0a43..e486bbaae296 (9 commits) (flutter/engine#6155)
aaf98fbfe Use double multiplication by a scale instead of 3 divides for speed. (flutter/engine#6154)
593ed5914 Revert "Use Skia normalize again after Skia precision fix. (#6121)" (flutter/engine#6122)
137389a85 Roll src/third_party/skia a45e1a71f548..b84576af0a43 (16 commits) (flutter/engine#6153)
f89a386a1 Roll src/third_party/skia cff3fd834ca8..a45e1a71f548 (1 commits) (flutter/engine#6152)
b0b8daa7b Unregister onFrameAvailable callbacks when a TextureEntry is released. (flutter/engine#6079)
2dc8271a4 Roll src/third_party/skia 24e58341fbcd..cff3fd834ca8 (1 commits) (flutter/engine#6151)
eea3a21e1 Roll src/third_party/skia bf67741140fd..24e58341fbcd (2 commits) (flutter/engine#6148)
bdcbe801a Roll src/third_party/skia 88119de2b849..bf67741140fd (1 commits) (flutter/engine#6147)
The AutoRoll server is located here: https://autoroll.skia.org/r/flutter-engine-flutter-autoroll
Documentation for the AutoRoller is here:
https://skia.googlesource.com/buildbot/+/master/autoroll/README.md
If the roll is causing failures, please contact the current sheriff, who should
be CC'd on the roll, and stop the roller if necessary.

@rmistry @liyuqian : New roll has been created by https://autoroll.skia.org/r/flutter-engine-flutter-autoroll

Trybots failed. These were the failed builds: https://flutter-dashboard.appspot.com/build.html

Commit queue failed; closing this roll.


text:
Roll engine 9daf5c8d213a..28e152f7e407 (6 commits)

https://github.com/flutter/engine/compare/9daf5c8d213a...28e152f7e407
git log 9daf5c8d213a..28e152f7e407 --no-merges --oneline
28e152f7e Roll src/third_party/skia cae020ae5f5f..d2fa2eb59f2d (3 commits) (flutter/engine#7312)
7c65290da Roll src/third_party/skia 31c1bf89657f..cae020ae5f5f (1 commits) (flutter/engine#7311)
180d8a7d9 Roll src/third_party/skia f6e963ef91c2..31c1bf89657f (1 commits) (flutter/engine#7310)
cc9c6702d Only reject gestures to embedded UIViews when the framework says so. (flutter/engine#7307)
2fb2b2729 Roll src/third_party/skia 3605fde88b2a..f6e963ef91c2 (1 commits) (flutter/engine#7306)
220ea0e1e Roll version of Dart to d1817ddc91fd3aea061647b2e21860c47a5a5180 (flutter/engine#7286)
The AutoRoll server is located here: https://autoroll.skia.org/r/flutter-engine-flutter-autoroll
Documentation for the AutoRoller is here:
https://skia.googlesource.com/buildbot/+/master/autoroll/README.md
If the roll is causing failures, please contact the current sheriff (liyuqian@google.com), and stop
the roller if necessary.

@liyuqian : New roll has been created by https://autoroll.skia.org/r/flutter-engine-flutter-autoroll

Trybots failed. These were the failed builds: https://cirrus-ci.com/task/6345111136894976 , https://cirrus-ci.com/task/5078473741697024 , https://cirrus-ci.com/task/4937736253341696 , https://cirrus-ci.com/task/5219211230052352

Commit queue failed; closing this roll.


text:
Revert "Fix the first frame logic in tracing and driver"

Reverts flutter/flutter#35297
This is breaking platform_view__start_up

Landing on red to fix build


text:
Rename the file to fix the device lab

TBR: @goderbauer

Merge on red to fix the tree.

LGTM

authors: goderbauer liyuqian


text:
Roll Engine from 5a73d4dc2503 to 5e82b8f29f45 (1 revision)

https://github.com/flutter/engine/compare/5a73d4dc2503...5e82b8f29f45
2020-07-21 skia-flutter-autoroll@skia.org Roll Skia from e687db2bbe11 to effd13f94527 (3 revisions) (flutter/engine#19910)
If this roll has caused a breakage, revert this CL and stop the roller
using the controls here:
https://autoroll.skia.org/r/flutter-engine-flutter-autoroll
Please CC jimgraham@google.com on the revert to ensure that a human
is aware of the problem.
To report a problem with the AutoRoller itself, please file a bug:
https://bugs.chromium.org/p/skia/issues/entry?template=Autoroller+Bug
Documentation for the AutoRoller is here:
https://skia.googlesource.com/buildbot/+doc/master/autoroll/README.md

Commit queue failed; closing this roll.