Flutter - Listview with Listener

전에 ScrollController를 이용해서 동작을 읽었는데

Listener을 통해 Drag 이벤트 등을 읽을 수 있습니다

 

@override
Widget build(BuildContext context) {
  var _data = Provider.of<VisibilityData>(context);

  return Scaffold(
      appBar: AppBar(title: Text('Scroll test')),
      body: Listener(
        onPointerMove: (value) {
          if (value.delta.dy > 0) {
            _data.setVisible(true);
          } else if (value.delta.dy < 0) {
            _data.setVisible(false);
          }
        },
        child: ListView.builder(
            itemCount: 20,
            itemBuilder: (context, index) {
              return ListTile(
                leading: CircleAvatar(
                  child: Text('${index + 1}'),
                ),
                title: Text('2 x $index = ${index * 2}'),
              );
            }),
      ),
      floatingActionButton: Visibility(
        visible: _data.getVisible,
        child: FloatingActionButton(
          child: Icon(Icons.add),
          onPressed: () {},
        ),
      ));
}

 

delta는 변화량 dy는 수직측, 만약 수평측이 필요하다면 dx를 사용하면 되고

controller를 사용하지 않기 때문에 Stateless위젯에서 사용할 때 유용한거 같습니다

 

조금 더 개선을 해보자면 bool값의 변화가 필요할 때만 호출을 하면 될거 같습니다

if (value.delta.dy > 0 && !_data.getVisible) {
   _data.setVisible(true);
} else if (value.delta.dy < 0 && _data.getVisible) {
   _data.setVisible(false);
}