在Flutter中滚动ListView时如何检查位置?

时间:2020-07-30 03:37:35

标签: flutter flutter-listview

我想在列表视图中以波动方式记录元素的位置,并在此基础上更改一些要显示的信息,以下是使用列表视图的代码

ListView.separated(
  scrollDirection: Axis.horizontal,
  separatorBuilder: (context, index) =>
      SizedBox(width: MediaQuery.of(context).size.width / 150),
      itemCount: myList.length + 1,
      itemBuilder: (context, index) => index == 0
          ? SizedBox(width: MediaQuery.of(context).size.width / 2.2)
          : ClipRRect(
              child: Padding(
                  padding: EdgeInsets.fromLTRB(2, 14, 18, 14),
                  child: Container(
                      width: MediaQuery.of(context).size.width / 2.55,
                      height: 150,
                      child: Center(
                          child: GestureDetector(
                              onTap: (){
                                  index2 = myList[index-1];
                              },
                              child: Text(
                              myList[index - 1].toString(),
                                 style: TextStyle(
                                     color: Colors.black,
                                     fontSize: 24,
                                     fontWeight: FontWeight.bold),
                                  ),
                           )
                        ),
                        decoration: BoxDecoration(
                           borderRadius:
                                BorderRadius.all(Radius.circular(10)),
                           boxShadow: [
                                BoxShadow(
                                  color: Colors.grey,
                                  offset: Offset(2.0, 2.0), //(x,y)
                                  blurRadius: 4.0,
                                ),
                              ],
                            gradient: LinearGradient(
                                colors: [Colors.blue[200], Colors.white],
                                begin: Alignment.topLeft,
                                end: Alignment.bottomRight
                            )
                        ),
                ),
          )
    )
),

我应该如何记录元素的位置,然后根据此显示其他集合信息?

1 个答案:

答案 0 :(得分:0)

要获取列表的offSet,您需要在scrollController上添加侦听器,以便每次更改时都可以获取offSet。 这是示例代码:

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

class _RadioTestState extends State<RadioTest> {
  ScrollController _scrollController;
  List<String> list;
  @override
  void initState() {
    super.initState();
    _scrollController = ScrollController()
      ..addListener(() {
        print("offset = ${_scrollController.offset}");
      });
    list = List<String>();
    for (var i = 0; i < 50; i++) {
      list.add("test");
    }
  }

  @override
  Widget build(BuildContext context) {
    return ListView(
      controller: _scrollController,
      children: [
        ...list.map(
          (item) => ListTile(
            title: Text("test"),
          ),
        ),
      ],
    );
  }
}

祝你好运。

相关问题