Floating Snackbar with set width has clipped shadow #94701
Description
When a SnackBar is shown with the behavior set to floating and a width is specified, its shadow is noticeably clipped on the left and right sides. My expectation is that the SnackBar should display with a natural shadow, as seen in the Material Design documentation.
Here's what you'll see if you run the provided code sample:
Maybe this is related to #47202, but I'm not sure.
Code sample
import 'package:flutter/material.dart';
void main() => runApp(const SnackBarDemo());
class SnackBarDemo extends StatelessWidget {
const SnackBarDemo({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Clipped SnackBar Shadow Demo',
home: Scaffold(
appBar: AppBar(
title: const Text('Clipped SnackBar Shadow Demo'),
),
body: const SnackBarPage(),
),
);
}
}
class SnackBarPage extends StatelessWidget {
const SnackBarPage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Center(
child: ElevatedButton(
onPressed: () {
const snackBar = SnackBar(
content: Text('My shadow is clipped :(', style: TextStyle(color: Colors.black,),),
elevation: 12.0,
width: 344, // Material Design spec
behavior: SnackBarBehavior.floating,
backgroundColor: Colors.white,
duration: Duration(seconds: 10),
);
ScaffoldMessenger.of(context).showSnackBar(snackBar);
},
child: const Text('Show Sad SnackBar'),
),
);
}
}flutter doctor -v
[✓] Flutter (Channel beta, 2.8.0-3.2.pre, on macOS 11.6 20G165 darwin-x64, locale en-US)
• Flutter version 2.8.0-3.2.pre at /Users/bryson/flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision 2901cd7208 (2 weeks ago), 2021-11-18 11:15:09 -0800
• Engine revision bcc2b7f12c
• Dart version 2.15.0 (build 2.15.0-268.18.beta)
[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
• Android SDK at /Users/bryson/Library/Android/sdk
• Platform android-31, 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 13.0)
• Xcode at /Applications/Xcode.app/Contents/Developer
• CocoaPods version 1.11.2
[✓] 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)
[✓] VS Code (version 1.62.3)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.29.0
[✓] Connected device (2 available)
• Pixel 6 Pro (mobile) • 192.168.1.198:42951 • android-arm64 • Android 12 (API 31)
• Chrome (web) • chrome • web-javascript • Google Chrome 96.0.4664.55
• No issues found!
Metadata
Metadata
Assignees
Labels
Type
Projects
Status