1、CustomScrollView

继承实现了 ScrollView,可以通过 scrollDirection 控制水平(Axis.horizontal)还是 竖直方向(Axis.vertical)滚动。

主要实现slivers,SliverList要 实例化delegate。例子如下
CustomScrollView(
      scrollDirection: Axis.horizontal,
      slivers: <Widget>[
        SliverList(
          delegate: new SliverChildListDelegate(
            [
              Container(
                width: 1000,
                child: Text(
                  "CustomScrollView   scrollDirection: Axis.horizontal",
                  style: styleBlack54Size16WBold,
                ),
                alignment: Alignment.center,
              )
            ],
          ),
        ),
      ],
    )

 

 

2、ListView

ListView 主要实现Item列表,可以通过 itemCount 数量1只加载一个View从而实现滑动。实现如下

ListView.builder(
      scrollDirection: Axis.vertical,
      itemCount: 1,
      itemBuilder: (BuildContext context, int index) {
        return Container(
          height: 1500,
          color: Colors.blueAccent,
          alignment: Alignment.center,
          child:Text("ListView.builder",
            style: styleBlack54Size16WBold,),
        );
      },
    );

也可以

ListView(
          
          children: <Widget>[
            Container(
              height: 1500,
              alignment: Alignment.center,
              child: Text("Test"),
            )
          ],
        ),
      ),

 

:如果ListView 或者CustomScrollView 为 Column 子View,则需要把ListView包裹在Expand 下。

  Expanded(
          child: ListView.builder(
            scrollDirection: Axis.vertical,
            itemCount: 1,
            itemBuilder: (BuildContext context, int index) {
              return Container(
                height: 1500,
                color: Colors.blueAccent,
                alignment: Alignment.center,
                child: Text(
                  "ListView.builder",
                  style: styleBlack54Size16WBold,
                ),
              );
            },
          ),
        ),

 

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐