Card color parameter not respected while using Material 3 #122177
Description
Using material 3 flag ThemeData(useMaterial3: true) causes Card widget to give a slightly darker color when one is provided to the Card with color parameter.
This cause any widget using the same color over said card, to have a different color from the one on background.
A quick workaround is to set surfaceTintColor: Colors.transparent on your card
Steps to Reproduce
- Run this dart pad https://dartpad.dev/?id=4ebfbf6725c13227dba95c7d65a704ad
Expected results:
Bottom half of the card should be the same color of the top half
Actual results:
Bottom half of the card is darker
Code sample
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
final colors = [Colors.red, Colors.green, Colors.blue];
return MaterialApp(
theme: ThemeData(useMaterial3: true),
home: Scaffold(
body: Row(
children: [
for (final color in colors)
Expanded(
child: Card(
color: color,
child: Column(
children: [
Expanded(child: Container(color: color)),
Expanded(child: Container(color: Colors.transparent))
],
),
),
),
],
),
),
);
}
}
Logs
Performing hot restart...
Waiting for connection from debug service on Chrome...
Restarted application in 1,026ms.
~/projects/tonal_palette_test$ flutter analyze
Analyzing tonal_palette_test...
No issues found! (ran in 1.1s)
[✓] Flutter (Channel stable, 3.7.0, on macOS 13.2.1 22D68 darwin-arm64, locale en-IT)
• Flutter version 3.7.0 on channel stable at /opt/homebrew/Caskroom/flutter/3.0.5/flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision b06b8b2710 (6 weeks ago), 2023-01-23 16:55:55 -0800
• Engine revision b24591ed32
• Dart version 2.19.0
• DevTools version 2.20.1
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
• Android SDK at /Users/clucera/Library/Android/sdk
• Platform android-33, build-tools 33.0.0
• Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 11.0.12+0-b1504.28-7817840)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Build 14C18
• CocoaPods version 1.11.3
[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 2021.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.12+0-b1504.28-7817840)
[✓] IntelliJ IDEA Ultimate Edition (version 2022.1.4)
• IntelliJ at /Applications/IntelliJ IDEA.app
• Flutter plugin version 71.2.4
• Dart plugin version 221.6008.17
[✓] VS Code (version 1.75.1)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.58.0
[✓] Connected device (2 available)
• macOS (desktop) • macos • darwin-arm64 • macOS 13.2.1 22D68 darwin-arm64
• Chrome (web) • chrome • web-javascript • Google Chrome 110.0.5481.177
[✓] HTTP Host Availability
• All required HTTP hosts are available
• No issues found!
Metadata
Metadata
Assignees
Labels
Issues with https://api.flutter.dev/flutter/packages/flutter/material repository.Found to occur in 3.7Found to occur in 3.9flutter/packages/flutter repository. See also f: labels.Relatively approachable for first-time contributorsThe issue has been confirmed reproducible and is ready to work onIssue is closed as already fixed in a newer versionOwned by Design Languages teamTriaged by Design Languages team
Type
Projects
Status