Skip to content

Material elevation shadow not display correctly, when the page is long or scroll down #59424

@peterlau0010

Description

@peterlau0010

Normal case, if the page no need to scroll.
flutter_01

After scroll down, or the page is long (added a box in tail)
Material shadow not display correctly.
flutter_04

Code below:

Material(
                elevation: 20,
                shadowColor: Theme.of(context).primaryColor,
                child: Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Form(
                    autovalidate: true,
                    key: _formKey,
                    child: Column(
                      children: [
                        PhoneNumberWidget(controller: _phoneController),
                        PasswordWidget(controller: _passwordController),
                      ],
                    ),
                  ),
                ),
              ),

Added this to make page longer, for testing the shadow

Padding(
              padding: const EdgeInsets.all(100),
              child: Container(),
            ),
[✓] Flutter (Channel beta, 1.19.0-4.1.pre, on Mac OS X 10.15.5 19F101, locale en-GB)
    • Flutter version 1.19.0-4.1.pre at /Users/peterlau/Documents/Git/flutter
    • Framework revision f994b76974 (5 days ago), 2020-06-09 15:53:13 -0700
    • Engine revision 9a28c3bcf4
    • Dart version 2.9.0 (build 2.9.0-14.1.beta)

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


[✓] Xcode - develop for iOS and macOS (Xcode 11.5)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.5, Build version 11E608c
    • CocoaPods version 1.9.3

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

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

[✓] Connected device (1 available)
    • iPhone SE (2nd generation) • B680C4ED-2753-4182-8253-CF944A9EB265 • ios • com.apple.CoreSimulator.SimRuntime.iOS-13-5 (simulator)

Metadata

Metadata

Assignees

No one assigned

    Labels

    f: material designflutter/packages/flutter/material repository.f: scrollingViewports, list views, slivers, etc.found in release: 3.3Found to occur in 3.3found in release: 3.6Found to occur in 3.6frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work on

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions