flutter笔记（十五）ListView滚动列表

ListView({
    Key key,
    Axis scrollDirection: Axis.vertical,
    bool reverse: false,
    ScrollController controller,
    bool primary,
    ScrollPhysics physics,
    bool shrinkWrap: false,
    EdgeInsetsGeometry padding,
    double itemExtent,
    bool addAutomaticKeepAlives: true,
    bool addRepaintBoundaries: true,
    bool addSemanticIndexes: true,
    double cacheExtent,
    List<Widget> children const[],
    int semanticChildCount,
    DragStartBehavior dragStartBehavior: DragStartBehavior.start
})

scrollDirection

子组件排列方式
Axis.vertical：竖直排列(默认值)
Axis.horizontal：横向排列

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: Scaffold(
        body: ListView(
          scrollDirection: Axis.horizontal,
          children: <Widget>[
            Container(
              width: 100,
              color: Colors.red
            ),
            Container(
              width: 100,
              color: Colors.blue
            ),
            Container(
              width: 100,
              color: Colors.green
            ),
            Container(
              width: 100,
              color: Colors.amberAccent
            )
          ],
        )
      )
    );
  }
}

reverse

是否反转，默认为false。

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: Scaffold(
        body: ListView(
          reverse: true,
          children: <Widget>[
            Container(
              height: 100,
              color: Colors.red
            ),
            Container(
              height: 100,
              color: Colors.blue
            ),
            Container(
              height: 100,
              color: Colors.green
            ),
            Container(
              height: 100,
              color: Colors.amberAccent
            )
          ],
        )
      )
    );
  }
}

controller

滚动的控制器

ScrollController({
    double initialScrollOffset: 0.0,
    bool keepScrollOffset: true,
    String debugLabel
})

initialScrollOffset

滚动的初始值

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: Scaffold(
        body: ListView(
          controller: ScrollController(
            initialScrollOffset: 50
          ),
          children: <Widget>[
            Container(
              height: 100,
              color: Colors.red
            ),
            Container(
              height: 100,
              color: Colors.blue
            ),
            Container(
              height: 100,
              color: Colors.green
            ),
            Container(
              height: 100,
              color: Colors.amberAccent
            )
          ],
        )
      )
    );
  }
}

keepScrollOffset

每次滚动完成时记录当前滚动的偏移量，当重新创建控制器的时候会还原至记录的滚动位置。

debugLabel

toString输出中使用的标签。旨在帮助识别调试输出中的滚动控制器实例。
官方文档给出的解释，不知道怎么用。

primary

当子组件不足以滚动时，是否允许子组件在滚动方向上被滑动。

当值为false时，这个滑动效果会被禁止。

physics

BouncingScrollPhysics()：滚动到边界后可以继续滚动，但是会回弹
ClampingScrollPhysics()：滚动到边界后不允许继续滚动
AlwaysScrollableScrollPhysics()：始终响应用户滚动
NeverScrollableScrollPhysics()：禁止用户滚动

shrinkWrap

默认值为false，当值为true时滚动到顶部时禁止继续下拉，但是滚动到底部时可以继续滚动，但是会回弹。

padding

flutter笔记（三）容器组件Container这里有介绍，不重复了。

itemExtent

子Widget的大小，会覆盖子Widget本身设置的尺寸。

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: Scaffold(
        body: ListView(
          itemExtent: 100,
          children: <Widget>[
            Container(
              height: 10,
              color: Colors.red
            ),
            Container(
              height: 100,
              color: Colors.green
            ),
          ],
        )
      )
    );
  }
}

addAutomaticKeepAlives

是否将子组件包在AutomaticKeepAlives，在懒加载的时候如果为true，当一个子组将滚动出屏外的时候会保存之前的状态。

addRepaintBoundaries

是否将子Widget包在RepaintBoundary里，如果为true则滚动时不会重绘。

addSemanticIndexes

不知道怎么用

cacheExtent

预加载区域，设置为0时关闭预加载。

semanticChildCount

不知道怎么用+1