美文网首页Flutter教学
Flutter(77):Sliver组件之SliverToBox

Flutter(77):Sliver组件之SliverToBox

作者: starryxp | 来源:发表于2020-10-30 10:51 被阅读0次

    Flutter教学目录持续更新中

    Github源代码持续更新中

    1.SliverToBoxAdapter介绍

    一个加载普通widget的Sliver组件,如果是滑动的组件不推荐使用这个,而是使用Sliver滑动组件

    2.SliverToBoxAdapter属性

    • child:

    3.使用

      _mySliverAppBar() {
        return SliverAppBar(
          title: Text('SliverToBoxAdapter'),
          expandedHeight: 250,
          flexibleSpace: FlexibleSpaceBar(
            background: Image.network(
              ImageUrlConstant.imageUrl1,
              fit: BoxFit.cover,
            ),
            collapseMode: CollapseMode.parallax,
          ),
        );
      }
    
      _mySliverChildBuilderDelegate() {
        return SliverChildBuilderDelegate(
          (BuildContext context, int index) {
            return Container(
              height: 80,
              color: Colors.primaries[index % 11],
            );
          },
          childCount: 30,
        );
      }
    
      @override
      Widget build(BuildContext context) {
        return Container(
          color: Colors.white,
          child: CustomScrollView(
            slivers: [
              _mySliverAppBar(),
              SliverToBoxAdapter(
                child: Container(
                  height: 200,
                  color: Colors.blue,
                ),
              ),
              SliverList(
                delegate: _mySliverChildBuilderDelegate(),
              ),
            ],
          ),
        );
      }
    
    image.png

    下一节:Sliver组件之SliverPersistentHeader

    Flutter(78):Sliver组件之SliverPersistentHeader

    Flutter教学目录持续更新中

    Github源代码持续更新中

    相关文章

      网友评论

        本文标题:Flutter(77):Sliver组件之SliverToBox

        本文链接:https://www.haomeiwen.com/subject/dpwrvktx.html