美文网首页
flutter listview 滑动到指定item,制作定位功

flutter listview 滑动到指定item,制作定位功

作者: 梁典典 | 来源:发表于2020-11-11 11:31 被阅读0次

    flutter_scroll_to_index

    git : https://github.com/mdddj/flutter_scroll_to_index

    flutter滚动组件

    Listview 滑动到指定item,类似于定位功能

    如何使用?

    1.创建控制器
    final ScrollToIndexController _scrollToIndexController = ScrollToIndexController();
    
    2.自定义模型对象

    注意自定义对象一定要继承ScrollToIndexBaseObject

    class TestObject extends ScrollToIndexBaseObject {
      final String name;
      final int age;
      TestObject(this.name, this.age);
    }
    
    3.在页面中使用widget

    使用组件ScrollToIndex

          ScrollToIndex(
            itemBuilder: (context, index) {
              TestObject item = objs[index]; // 模型 model
              return Card(
                key: item.globalKey, // 必须要的,用来定位,ScrollToIndexBaseObject 的属性
                elevation: 20,
                margin: EdgeInsets.all(20),
                child: Container(
                  padding: EdgeInsets.all(8),
                  child: Column(
                    children: [
                      Text(item.name),
                      Text("${item.age}"),
                    ],
                  ),
                ),
              );
            },
            list: objs, // 必须要的 model模型列表, 是个数组
            controller: _scrollToIndexController, // 必须要的 controller 
          )
    
    4.滑动到指定index

    使用_scrollToIndexController.to(int index)方法滑动到指定item

    _scrollToIndexController.to(6);
    
    6.销毁
    _scrollToIndexController.dispose();
    

    相关文章

      网友评论

          本文标题:flutter listview 滑动到指定item,制作定位功

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