backdrop icon indicating copy to clipboard operation
backdrop copied to clipboard

BoxShadow on front layer

Open WieFel opened this issue 2 years ago • 3 comments

In my app, due to the chosen colors, the front- and back layer are not very clearly distinguishable. Therefore, I would like to introduce a BoxShadow on the front layer.

If I change the existing frontLayerElevation on BackdropScaffold, it doesn't seem to have any effect on shadow. immagine I would expect the shadow to show on top of the front layer, but it is by default showing below it, where it is not visible.

@daadu do you think we could add that? I will prepare a PR...

WieFel avatar Mar 05 '23 19:03 WieFel

Are you sure that higher values of frontLayerElevation is not working? Can you share screenshot?

daadu avatar May 20 '23 16:05 daadu

The minimal example with frontLayerElevation: 8 gives just an unchanged UI:

MaterialApp(
  home: BackdropScaffold(
    frontLayerElevation: 8,
    appBar: BackdropAppBar(
      title: const Text("Backdrop Example"),
    ),
    backLayer: const Center(
      child: Text("Back Layer"),
    ),
    frontLayer: const Center(
      child: Text("Front Layer"),
    ),
  ),
)

image

If I additionally set the frontLayerBackgroundColor to Colors.transparent, then I can see something happening: image If I now set the elevation e.g. to 1: image The shadow gets less blurred, which means the elevation is applied correctly actually.

So, when my front layer is white, the shadow is hidden below it, because the shadow is displayed (like always in Material Design) on the bottom-right of the widget.

My goal would be to have the possibility for setting the shadow offset to be e.g. Offset(0, -4) in order to show the shadow on top of the front layer.

WieFel avatar Jun 17 '23 16:06 WieFel

Ok, if you think so it is required then do it.

daadu avatar Jun 18 '23 03:06 daadu