@mockturtl Hi! So wonderful to see this implementation. Much thanks to everyone working on expanding Material coverage in the community.

We have no issue with that! Go for it!

from backdrop.

@mockturtl Have you tried stickyFrontLayer and headerHeight arguments of BackdropScaffold, to get desired UI?

from backdrop.

@mockturtl Ok, got your point. Go ahead with the PR! BTW, what should we name the param? Any idea?

Few of my suggestions:

• double frontLayerStartFrom: 0
• double frontLayerTopMargin: 0
• ??

Also while filing PR can you correct the docs for headerHeight - instead of using "closed" and "open" term (earlier we used them), use phrases like "when backLayer is concealed/revealed", that should avoid the confusion with the usage of `headerHeight.

from backdrop.

This has landed with v0.5.0 on pub.dev.

from backdrop.

• Playing with values in example/lib/navigation.dart, my understanding of the stickyFrontLayer behavior is "When closed, the front layer will occupy as much height as possible without occluding the back layer. If the back layer occupies the entire screen height[1], this parameter has no effect."

[1] This is my use case: my back layer is a large menu. Apologies for misrepresenting that in the screenshot above.

• headerHeight seems to control the height of the front layer in its inactive / closed state (this contradicts my reading of the docs[2]). Additionally, if stickyFrontLayer == true and headerHeight is less than the available space, headerHeight is ignored.

[2] It might be desirable to document the control flow inside the _headerHeight getter and _getPanelAnimation, if it's not too cumbersome to explain.

From what I can tell, the existing constructor args for BackdropScaffold don't allow me to specify "front page A opens to height X, front page B opens to height Y."

@willlarche Does Material have an opinion on a Backdrop with variable-height front layers? I'll double check Crane.

from backdrop.

@mockturtl Thanks for pointing out problem in headerHeight docs, will correct it.

Regarding your requirement, as far as I understand(from checking Crane example), you want to have "extra" space under appbar, that is visible even when the backLayer is concealed.

A solution for that would be to set bottom of BackdropAppBar. Check the following code (modified example/main.dart):

MaterialApp(
      title: 'Backdrop Demo',
      home: BackdropScaffold(
        appBar: BackdropAppBar(
          title: Text("Backdrop Example"),
          actions: <Widget>[
            BackdropToggleButton(
              icon: AnimatedIcons.list_view,
            )
          ],
          bottom: PreferredSize(
            child: Column(
              children: [
                Text("Menu 1"),
                Text("Menu 2"),
              ],
            ),
            preferredSize: Size.fromHeight(100),
          ),
        ),
        backLayer: Center(
          child: Text("Back Layer"),
        ),
        subHeader: BackdropSubHeader(
          title: Text("Sub Header"),
        ),
        frontLayer: Center(
          child: Text("Front Layer"),
        ),
      ),
    );

Screenshot for it:

As far as I understand, the "extra" (always visible stuff) should be part of AppBar and not backLayer (which is revealed and concealed)

from backdrop.

Regarding your requirement, as far as I understand(from checking Crane example), you want to have "extra" space under appbar, that is visible even when the backLayer is concealed

Not really. I want the front layer's height to be configurable for each page. I'm not sure how to explain differently.

I'm happy to submit a PR if you think the idea makes sense.

Back layer and appbar look good

Front layer: Current behavior

Front layer: Desired behavior

from backdrop.