search

material-components / material-components-android

Modular and customizable Material Design UI components for Android
Apache License 2.0
16.32k stars 3.06k forks source link

[DragHandle] Background colour incorrect #3269

Open nicbell opened 1 year ago

nicbell commented 1 year ago

Description

Bottom sheet drag handle appears far darker than the Material 3 design docs.

image

Docs

image

Specs

image

I looks like the 40% alpha is missing for the MDC Android implementation. Changing the default style fixes it.

<item name="bottomSheetDragHandleStyle">@style/Widget.Xxx.BottomSheet.DragHandle</item>
...
<style name="Widget.Xxx.BottomSheet.DragHandle" parent="Widget.Material3.BottomSheet.DragHandle">
    <!-- Matches specs -->
    <item name="android:alpha">0.4</item>
</style>

Code

https://github.com/material-components/material-components-android/blob/4046525b20ff81c4f4fef654b9e8f09ffd7f5a81/lib/java/com/google/android/material/bottomsheet/res/values/styles.xml#L92

drchen commented 1 year ago

I actually suspect the spec is wrong because %40 will not provide enough contrast to the background, apparently.

I'll check with our designer if the design spec needs to be updated. Thanks for catching this!

drchen commented 1 year ago

Hi,

I checked with the designer and the original design was intended to be light (with 40% opacity). However with our new non-text-contrast requirements coming, our designers are working on a new design of the drag handle that conforms the new contrast requirement.

So the conclusion here is we will keep it as-is for now, until we have the updated design, maybe by the end of Q2 or so.

Thanks for noticing and reporting this. I'll leave this open until we update with the new design.

nicbell commented 1 year ago

@drchen Thanks for the update!