Flutter Scrollable Widgets like ListView,GridView or powerful CustomScrollView can't nest inner scrollview

Related tags

Templates nested_inner_scroll_coordinator
Overview

Introduction

Flutter Scrollable Widgets like ListView,GridView or powerful CustomScrollView can't nest inner scrollview. If Nested, inner scrollview will scroll dependently, that's not very good to user.

NestedScrollView give us another choice, but it's not very flexible. For example, We must provide "header+body" widgets. So I make nested_inner_scroll library inpired by NestedScrollView,this library has features:

  1. inner scroll and outer scroll is independent, when we scroll one,other's position will not be affected.
  2. When inner scroll at it's edge, it can trigger out scroll view to scroll
  3. Support nested fling effect, it's smooth when fling innerview or outview

Usage

  1. new NestedInnerScrollCoordinator instance, it needs one ScrollController as parent
  2. give NestedInnerScrollCoordinator.outController to outview as ScrollController
  3. prepare Key instance for every innerview as scrollKey property
  4. give NestedInnerScrollCoordinator.innerController to innerView as ScrollController
  5. wrap every innerview with NestedInnerScrollChild widget that's all, then you can have nested inner scroll views you can check example project main.dart for more information

Other Tips

  1. If you want to scroll inner view, you need to do it by ScrollPosition _coordinator.getInnerPosition(innerViewKey)?.jumpTo(0)

  2. If you want to have pull to refresh features, you can use 'pull_to_refresh_notification' library

  3. Every inner scroll view should have fixed height

Issues

If you have any problem in use, give issues to me but with template:

description

minim code example

flutter doctor -v info

You might also like...

A ListView that allows you to group list items and support headers like iOS UITableView section.

A ListView that allows you to group list items and support headers like iOS UITableView section.

GroupListView package for Flutter. A ListView that allows you to group list items and support headers like iOS UITableView section. Features List Item

Nov 21, 2022

Greentick assignment - State management tool provider and UI components like ListView etc

Greentick assignment - State management tool provider and UI components like ListView etc

greentick_assignment This project is a part of assignment, which demonstrate the

Feb 11, 2022

Api Call Check flutter - A new Flutter project that demonstrates api calling and displays them in a scrollable list

Api Call Check flutter - A new Flutter project that demonstrates api calling and displays them in a scrollable list

api_fetch A new Flutter project that demonstrates api calling and displays them

Jan 2, 2022

Flutter GridView Example in a Shopping List Design - day 10

Flutter GridView Example in a Shopping List Design - day 10

Flutter GridView Example UI Design A part of #flutter100daysofcode. Let's create a beautiful and animated GridView Example UI with Flutter. Watch it o

Dec 26, 2022

An application used to manage all your tabs in a clean, scrollable, categorized format.

An application used to manage all your tabs in a clean, scrollable, categorized format.

Tabmanager Created by Sami-ul You can contact me here: [email protected] Recent updates Made the app run faster by using the backend to serve t

Nov 2, 2022

This repo is for anything that can be reusable in flutter like custom widgets 🟥, animations 🌟and more

Ease This packa is for anything that can be reusable in flutter like custom widgets 🟥 , animations 🌟 and more. Features 1-custom text widget to ease

Dec 3, 2022

Flutter control system widgets, like on-off controller.

control_system Flutter control system widgets, like on-off controller. Introduction A control system manages, commands, directs, or regulates the beha

Jan 9, 2022

A fully-featured Last.fm client and scrobbler with Shazam-like scrobbling, a collage generator, home screen widgets, and more!

Finale A fully-featured Last.fm client and scrobbler with Shazam-like scrobbling, a collage generator, and more! The app is available on iOS, Android,

Jan 5, 2023

Easily build your Widgets, Avoid parenthesis nesting, easy to build UI, A little like swift-ui.

Easily build your Widgets, Avoid parenthesis nesting, easy to build UI, A little like swift-ui.

tenon_mortise Easily build your Widgets, Avoid parenthesis nesting, easy to build UI, A little like swift-ui. Getting Started Usage To use this plugin

Dec 15, 2022
Comments
  • Disabled mouse wheel scrolling with Flutter web

    Disabled mouse wheel scrolling with Flutter web

    When I assign the coordinator to the outer scrollable's controller, my whole flutter website doesn't scroll when I use the wheel on the mouse. I have to manually drag the scroll bar on the side to scroll through my web app.

    I first thought it could be my own problem implementing the package, however, using the example code provided, the same problem happened. I could not scroll it with my mouse wheel.

    opened by RitchieP 0
  • [bug] Looking up a deactivated widget's ancestor is unsafe.

    [bug] Looking up a deactivated widget's ancestor is unsafe.

    when I go back from my screen that exception fires Looking up a deactivated widget's ancestor is unsafe. The issue happens on the disposing state, try to dispose the screen somehow and you will catch the exception in the console

    opened by AlaaEldeenYsr 2
Owner
jaysonss
jaysonss
GitHub
A loading more list which supports ListView,GridView,WaterfallFlow and Slivers.

loading_more_list A loading more list which supports ListView,GridView,WaterfallFlow and Slivers. Language: English | 中文简体 Web demo for LoadingMoreLis

FlutterCandies 292 Dec 19, 2022
Flutter package. A wrapper for scrollable widgets that enables smooth scrolling with a mouse on all platforms.

Dynamic Mouse Scroll A wrapper for scrollable widgets that enables smooth scrolling with a mouse on all platforms. First gif: Scrolling slowly. Second

null 3 Dec 15, 2022
A recipe app, in which you will learn about different Scrollable widgets.

Scrollable-Widgets : A recipe app, in which you will learn about different Scrollable widgets. Concepts Included : ListView & Nested ListView GridView

Ashirbad Swain 6 Apr 26, 2022
Flutter Bidirectional ListView - ListView with items that can be scrolled in both directions with a fixed item count and scroll boundaries.

Flutter Bidirectional ListView ListView with items that can be scrolled and lazy loaded in up and down direction with a fixed item count and scroll bo

Christoph Rothermel 7 May 30, 2022
best flutter / dart practices + Custom Painter + Sliver App Bar + Custom Scrollview

Weekly Budget Flutter App A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get yo

Mohamed Awnallah 4 Oct 21, 2021
A Flutter widget for Scrollview, pop when overscroll

overscroll_pop A Flutter widget for Scrollview, pop when overscroll like Instagram, Pinterest, ... Getting Started Include the package to your project

null 22 Dec 21, 2022
A wrapper for a Flutter ScrollView which enables lazy loading

Lazy load scrollview A wrapper for a ScrollView that will enable lazy loading Usage Add lazy_load_scrollview dependency to your pubspec.yaml: dependen

Quirijn Groot Bluemink 104 Nov 7, 2022
A _Flutter_ package that provides a diagonal scrollview.

Diagonal ScrollView for Flutter THE PACKAGE IS DISCONTINUED! Use InteractiveViewer instead. A Flutter package that allows to scroll in both, horizonta

Ranfi Castillo de Aza 35 Dec 12, 2021
This example uses a ScrollView, JSON Rest API, Navigation, Alert Pop Up, Progress Indicator, Globals, Images in a shared asset folder, and 100% Shared Code

This example uses a ScrollView, JSON Rest API, Navigation, Alert Pop Up, Progress Indicator, Globals, Images in a shared asset folder, and 100% Shared Code. Now with the ability to login with FaceID, TouchID, and Fingerprint Reader on Android.

Rody Davis 672 Jan 6, 2023
Flutter tableview - A flutter widget like iOS UITableview. let listView with section header and each section header will hover at the top.

中文 flutter_tableview A flutter widget like iOS UITableview. let listView with section header and each section header will hover at the top. Installing

null 41 Jul 22, 2022