App/Flutter

[ FLUTTER 커스텀 ] SliverAppBar

거북 2021. 12. 13. 11:14

 

* custom_sliver.dart

class CustomSliver extends StatefulWidget {
  final Widget header;
  final Widget body;
  double? headerHeight;
  final bool automaticallyImplyLeading;
  CustomSliver({
    Key? key,
    required this.header,
    required this.body,
    this.automaticallyImplyLeading = true,
    this.headerHeight,
  }) : super(key: key);

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

class _CustomSliverState extends State<CustomSliver> {
  @override
  void initState() {
    if (widget.headerHeight == null)
      widget.headerHeight = 400;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return CustomScrollView(
      physics: BouncingScrollPhysics(),
      slivers: [
        SliverAppBar(
          elevation: 0.0,
          automaticallyImplyLeading: widget.automaticallyImplyLeading,
          expandedHeight: widget.headerHeight,
          stretch: true,
          pinned: true,
          backgroundColor: Colors.transparent,
          flexibleSpace: FlexibleSpaceBar(
            stretchModes: [StretchMode.zoomBackground],
            collapseMode: CollapseMode.parallax,
            background: widget.header,
          ),
        ),
        SliverToBoxAdapter(child: widget.body)
      ],
    );
  }
}