Flutter教程：infinity_slider的多次嵌套实现滑动链接效果

Target

• 多个infinity_slider嵌套实现滑动链接效果❙Fu'p .dev/packages/v…
• github: github.com /herghost000…

Idea

1. 查找父级infinity_slider控制

用户未通过小组件树监听跟踪当前infinity_slider 使用父项 滚动

infinity_slider control❙❙❙_pageController finity_slider ControllerPosition

禁用当前 infinity_slider 由控件创建的光晕效果 当父控件 infinity_slider 不存在时到达边缘

步骤

finit1) 在 InfinitySlider 中查找父 finity 控制

将此代码添加到类

static InfinitySliderState of(BuildContext context) {
    return context.ancestorStateOfType(TypeMatcher<InfinitySliderState>());
}
复制代码

在 中初始化以下代码初始化状态

@override
Widget build(BuildContext context) {
    return NotificationListener(
      onNotification: _handleScrollNotification,
      child: NotificationListener(
            onNotification: _handleGlowNotification,
            child: PageView.builder(
                ......
            )
        )
    );
)

bool _handleGlowNotification(OverscrollIndicatorNotification notification) {
    if (notification.depth == 0 &&
        _canLinkWithAncestorScroll(notification.leading)) {
      notification.disallowGlow();
      return true;
    }
    return false;
}

❀2 监控当前_der 滚动控件

@override
Widget build(BuildContext context) {
    return NotificationListener(
        onNotification: _handleScrollNotification,
        child: PageView.builder(
            ......
        )
    );
}

void _handleScrollNotification(ScrollNotification notification) {
    
}
复制代码

3) 控制父级 infinity_slider滚动控件

bool _handleScrollNotification(ScrollNotification notification) {
    if (notification is OverscrollNotification && _ancestor != null) {
      if (_canLinkWithAncestorScroll(notification.overscroll < 0)) {
        _ancestor._pageController.position
            .moveTo(_ancestor._pageController.offset + notification.overscroll);
      }
    }
}
  
bool _canLinkWithAncestorScroll(bool onLeftEdge) {
    if (_ancestor == null) return false;
    return (onLeftEdge &&
        _ancestor._pageController.offset !=
            _ancestor._pageController.position.minScrollExtent) ||
        ((!onLeftEdge &&
            _ancestor._pageController.offset !=
                _ancestor._pageController.position.maxScrollExtent));
}
复制代码

4) 禁用控制器生成的光晕 infinity_s lider❙ 与家长控制元素'控制

@override
Widget build(BuildContext context) {
    return NotificationListener(
      onNotification: _handleScrollNotification,
      child: NotificationListener(
            onNotification: _handleGlowNotification,
            child: PageView.builder(
                ......
            )
        )
    );
)

bool _handleGlowNotification(OverscrollIndicatorNotification notification) {
    if (notification.depth == 0 &&
        _canLinkWithAncestorScroll(notification.leading)) {
      notification.disallowGlow();
      return true;
    }
    return false;
}

作者：Sestra Po
链接：https://juejin.im/post/5d6c973ae51d45620064bb92
来源：掘金
版权归作者所有。商业转载请联系作者获取授权。非商业转载请注明出处。