Unverified Commit 4c21fb90 authored by Darren Austin's avatar Darren Austin Committed by GitHub

Update the requirements for applying the elevation overlay. (#57526)

parent a6357651
......@@ -14,19 +14,19 @@ import 'theme.dart';
/// This is an internal implementation class and should not be exported by
/// the material package.
class ElevationOverlay {
// This class is not meant to be instatiated or extended; this constructor
// This class is not meant to be instantiated or extended; this constructor
// prevents instantiation and extension.
// ignore: unused_element
ElevationOverlay._();
/// Applies an elevation overlay color to a surface color to indicate
/// Applies an elevation overlay color to a given color to indicate
/// the level of elevation in a dark theme.
///
/// If the surrounding [Theme.applyElevationOverlayColor] is true, and
/// [color] is [Theme.colorScheme.surface] then this will return
/// a version of the given color with a semi-transparent [Theme.colorScheme.onSurface]
/// overlaid on top of it. The opacity of the overlay is controlled by the
/// [elevation].
/// If the ambient [ThemeData.applyElevationOverlayColor] is true,
/// and [ThemeData.brightness] is [Brightness.dark] then this will return
/// a version of the given color with a semi-transparent
/// [ThemeData.colorScheme.onSurface] overlaid on top of it. The opacity
/// of the overlay is computed based on the [elevation].
///
/// Otherwise it will just return the [color] unmodified.
///
......@@ -39,7 +39,7 @@ class ElevationOverlay {
final ThemeData theme = Theme.of(context);
if (elevation > 0.0 &&
theme.applyElevationOverlayColor &&
color == theme.colorScheme.surface) {
theme.brightness == Brightness.dark) {
return Color.alphaBlend(overlayColor(context, elevation), color);
}
......
......@@ -227,9 +227,9 @@ class Material extends StatefulWidget {
/// [MaterialType.transparency].
///
/// To support dark themes, if the surrounding
/// [ThemeData.applyElevationOverlayColor] is true then a semi-transparent
/// overlay color will be composited on top this color to indicate
/// the elevation.
/// [ThemeData.applyElevationOverlayColor] is true and [ThemeData.brightness]
/// is [Brightness.dark] then a semi-transparent overlay color will be
/// composited on top of this color to indicate the elevation.
///
/// By default, the color is derived from the [type] of material.
final Color color;
......
......@@ -933,12 +933,13 @@ class ThemeData with Diagnosticable {
/// elevation of a surface should be portrayed with an "overlay" in addition
/// to the shadow. As the elevation of the component increases, the
/// overlay increases in opacity. [applyElevationOverlayColor] turns the
/// application of this overlay on or off.
/// application of this overlay on or off for dark themes.
///
/// If [true] a semi-transparent version of [colorScheme.onSurface] will be
/// applied on top of the color of [Material] widgets when their [Material.color]
/// is [colorScheme.surface]. The level of transparency is based on
/// [Material.elevation] as per the Material Dark theme specification.
/// If [true] and [brightness] is [Brightness.dark], a
/// semi-transparent version of [colorScheme.onSurface] will be
/// applied on top of the color of [Material] widgets. The level of
/// transparency is based on [Material.elevation] as per the
/// Material Dark theme specification.
///
/// If [false] the surface color will be used unmodified.
///
......@@ -951,9 +952,9 @@ class ThemeData with Diagnosticable {
///
/// See also:
///
/// * [Material.elevation], which effects how transparent the white overlay is.
/// * [Material.color], the white color overlay will only be applied of the
/// material's color is [colorScheme.surface].
/// * [Material.elevation], which effects the level of transparency of the
/// overlay color.
/// * [Material.color], the elevation overlay will be applied to this color.
/// * <https://material.io/design/color/dark-theme.html>, which specifies how
/// the overlay should be applied.
final bool applyElevationOverlayColor;
......
......@@ -273,20 +273,21 @@ void main() {
}
});
testWidgets('overlay will only apply to materials using colorScheme.surface', (WidgetTester tester) async {
testWidgets('overlay will not apply to materials using a light theme', (WidgetTester tester) async {
await tester.pumpWidget(
Theme(
data: ThemeData(
applyElevationOverlayColor: true,
colorScheme: const ColorScheme.dark().copyWith(surface: const Color(0xFF121212)),
colorScheme: const ColorScheme.light(),
),
child: buildMaterial(
color: Colors.cyan,
elevation: 8.0,
color: Colors.cyan,
elevation: 8.0,
),
),
);
final RenderPhysicalShape model = getModel(tester);
// Shouldn't change, as it was under a light color scheme.
expect(model.color, equals(Colors.cyan));
});
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment