Can't we make sliding_up_panel as separate stateless (or stateful) widget?

[wangmir]

Describe the bug When separate sliding up panel like this,

class _SlidingUpPanelViewState extends State<SlidingUpPanelView> {

  @override
  Widget build(BuildContext context) {
    double _panelHeightOpen = 0;
    double _panelHeightClosed = 95.0;
    return SlidingUpPanel(
      maxHeight: _panelHeightOpen,
      minHeight: _panelHeightClosed,
      parallaxEnabled: false,
      parallaxOffset: .5,
      panelBuilder: (sc) => PlayerView(sc),
      borderRadius: BorderRadius.only(
          topLeft: Radius.circular(18.0), topRight: Radius.circular(18.0)),
      onPanelSlide: (double pos) => setState(() {}),
    );
  }
}

The panel doesn't show anything.

But same code shows contents when directly call SlidingUpPanel inside stack.

When panelBuilder is switched to panel: and when the contents are just text, the result was same.

Smartphone (please complete the following information):

• Device: Galaxy S21
• OS: Android 11
• Flutter Version : 2.0.6
• sliding_up_panel Version : 2.0.0+1

[hasanm08]

use this

class SlidingUpPanelComponent extends StatefulWidget {
  static PanelController panelController = PanelController();
  final Widget child;

  const SlidingUpPanelComponent(
      {Key? key, required this.child})
      : super(key: key);
  static void open() {
    panelController.open();
  }

  static bool isOpen() => panelController.isPanelOpen;
  static bool isClose() => panelController.isPanelClosed;
  static void close() {
    panelController.close();
  }

  @override
  _SlidingUpPanelComponentState createState() =>
      _SlidingUpPanelComponentState();
}

class _SlidingUpPanelComponentState extends State<SlidingUpPanelComponent> {
  final double _initFabHeight = 120.0;
  // ignore: unused_field
  double _fabHeight = 0;
  double _panelHeightOpen = 0;
  double _panelHeightClosed = 95.0;

  final double _bodyBottomMargin = 128.0;

  @override
  void initState() {
    super.initState();
    _fabHeight = _initFabHeight;
  }

  @override
  Widget build(BuildContext context) {
    var _mediaQuery;
    _panelHeightOpen = MediaQuery.of(context).size.height * .89;
    _panelHeightClosed = 75;
    return SlidingUpPanel(
        controller: SlidingUpPanelComponent.panelController,
        maxHeight: _panelHeightOpen,
        minHeight: _panelHeightClosed,
        backdropEnabled: true,
        parallaxEnabled: true,
        renderPanelSheet: false,
        color: Theme.of(context).colorScheme.background,
        parallaxOffset: .5,
        onPanelClosed: () {},
        onPanelOpened: (){},
        backdropColor: Colors.red,
        body: widget.child,
        panelBuilder: (scrollController) {
          return _mediaQuery ??= MediaQuery.removePadding(
              context: context,
              removeTop: true,
              child: SlidingUpPanelExtendedContext(
                  scrollController: scrollController));
        },
        borderRadius: const BorderRadius.only(
            topLeft: Radius.circular(8), topRight: Radius.circular(8)),
        onPanelSlide: (double pos) => setState(() {
              _fabHeight = pos * (_panelHeightOpen - _panelHeightClosed) +
                  _initFabHeight;
            }),
        collapsed: const SlidingUpPanelContext());
  }
}