flutter-列表滚动按钮

2022-10-05  本文已影响0人  ChaosHeart
import 'package:flutter/material.dart';
import 'package:imes_base_plugins/common/layout.dart';

///上下滚动按钮
class UpDownScrollWidget extends StatefulWidget {
  final ScrollController sc; //上下滚动控制器

  const UpDownScrollWidget({Key key, @required this.sc}) : super(key: key);

  @override
  State<UpDownScrollWidget> createState() => _UpDownScrollWidgetState();
}

///Chaos20200826
class _UpDownScrollWidgetState extends State<UpDownScrollWidget> {
  //上下滚动
  bool _upDown = false;

  ///build
  @override
  void initState() {
    super.initState();
    _listenerSc(_upDown, widget.sc);
  }

  ///dispose
  @override
  void dispose() {
    super.dispose();
  }

  ///build
  @override
  Widget build(BuildContext context) {
    return _rollingWidget(_upDown, widget.sc);
  }

  ///上下滚动 按钮
  _rollingWidget(bool upDown, ScrollController sc) {
    return InkWell(
      onTap: () {
        upDown ? sc.jumpTo(0) : sc.jumpTo(sc.position.maxScrollExtent);
      },
      child: ClipRRect(
        borderRadius: BorderRadius.circular(w(25)),
        child: Image.asset(
          upDown ? "images/iqc_sampling_sys/icon-top.png" : "images/iqc_sampling_sys/icon-down.png",
          width: w(50),
          height: w(50),
          fit: BoxFit.fill,
        ),
      ),
    );
  }

  ///上下滚动 监听滚动
  _listenerSc(bool upDown, ScrollController sc) {
    sc.addListener(() {
      // logs("打印当前滚动位置:${sc.offset}");
      //判断显示上下那个按钮
      if (sc.offset < sc.position.maxScrollExtent / 2) {
        _upDown = false;
      } else {
        _upDown = true;
      }
      setState(() {});
    });
  }
}
上一篇下一篇

猜你喜欢

热点阅读