title: how to customise DraggableScrollableSheet bottom sheet with flexibleSpace in sliverAppbar
body: <p>I want to create bottom sheet like Instagram post sharing page</p>
  <p>everything work fine but I need to start flexibleSpace animation before  DraggableScrollableSheet at the <code>maxChildSize</code> property and finished at <code>maxChildSize</code></p>
  <pre><code>Stack(
            children: [
              GestureDetector(
                behavior: HitTestBehavior.opaque,
                onTap: () {
                  Navigator.of(cotext).pop()
                },
                child: Container(
                  width: context.width,
                  height: context.height,
                ),
              ),
              SizedBox.fromSize(
                size: Size.fromHeight(context.height),
                child: DraggableScrollableSheet(
                  minChildSize: 0.5,
                  maxChildSize: 1,
                  initialChildSize: 0.5,
                  builder: (context, scroll) {
                    return SafeArea(
                      child: Container(
                        color: Colors.white,
                        child: CustomScrollView(
                          controller: scroll,
                          slivers: [
                            SliverAppBar(
                              pinned: true,
                              title:title,
                            ),
                            SliverList(
                                delegate:
                                    SliverChildBuilderDelegate((context, index) {
                              return Object()
                            }, childCount: 100))
                          ],
                        ),
                      ),
                    );
                  },
                ),
              ),
            ],
          );
  
  </code></pre>