Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there any definite list of Sliver widgets

Tags:

I am trying to use Sliver to implement collapsible list header. As I am changing widgets from normal to Sliver I often end up with error like this:

I/flutter ( 3141): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════ I/flutter ( 3141): The following assertion was thrown building NotificationListener<ScrollNotification>(): I/flutter ( 3141): A RenderViewport expected a child of type RenderSliver but received a child of type I/flutter ( 3141): RenderRepaintBoundary. I/flutter ( 3141): RenderObjects expect specific types of children because they coordinate with their children during I/flutter ( 3141): layout and paint. For example, a RenderSliver cannot be the child of a RenderBox because a I/flutter ( 3141): RenderSliver does not understand the RenderBox layout protocol. I/flutter ( 3141):  I/flutter ( 3141): The RenderViewport that expected a RenderSliver child was created by: I/flutter ( 3141):   Viewport ← _ScrollableScope ← IgnorePointer-[GlobalKey#307856652] ← Listener ← _GestureSemantics ← I/flutter ( 3141):   RawGestureDetector-[LabeledGlobalKey<RawGestureDetectorState>#701223524] ← RepaintBoundary ← I/flutter ( 3141):   CustomPaint ← RepaintBoundary ← NotificationListener<ScrollNotification> ← I/flutter ( 3141):   GlowingOverscrollIndicator ← Scrollable ← ⋯ I/flutter ( 3141): I/flutter ( 3141): The RenderRepaintBoundary that did not match the expected child type was created by: I/flutter ( 3141):   RepaintBoundary ← NotificationListener<ScrollNotification> ← GlowingOverscrollIndicator ← I/flutter ( 3141):   Scrollable ← SingleChildScrollView ← Viewport ← _ScrollableScope ← I/flutter ( 3141):   IgnorePointer-[GlobalKey#307856652] ← Listener ← _GestureSemantics ← I/flutter ( 3141):   RawGestureDetector-[LabeledGlobalKey<RawGestureDetectorState>#701223524] ← RepaintBoundary ← ⋯ I/flutter ( 3141): 

My understanding is this is because normal widgets can't be used directly to render in Sliver widgets.

Is there any definite list of Sliver widgets in the framework?

sliver.dart doesn't show much

like image 464
robotoaster Avatar asked Jun 12 '17 07:06

robotoaster


People also ask

What is silver list in flutter?

In Flutter, a sliver is a slice of a scrollable area you can use to achieve custom scrolling behaviors. When you finish this tutorial, you'll know more about slivers and be comfortable using them.

What are silver widgets?

Sliver is a portion of the scrollable area which is used to achieve a custom scrolling effect. In other words, the sliver widget is a slice of the viewport. We can implement all of the scrollable views, such as ListView, GridView using slivers.

What is SliverFixedExtentList?

SliverFixedExtentList class Null safety. A sliver that places multiple box children with the same main axis extent in a linear array. SliverFixedExtentList places its children in a linear array along the main axis starting at offset zero and without gaps.

How do I use CustomScrollView in flutter?

Now lets start implementation of CustomScrollView in Flutter First of all, create a basic project and return a Custom Scroll View widget. Then, add a silver app bar and then add a silver grid. Here we only used two child widgets in the custom scroll view. The Entry point of code.


2 Answers

The docs for RenderSliver seem to be the closest thing we have to definitive Sliver documentation at the moment.

RenderSliver is implemented by

  • RenderSliverHelpers (mixin)
  • RenderSliverMultiBoxAdaptor (abstract)
    • RenderSliverFixedExtentBoxAdaptor (abstract)
      • _RenderSliverPrototypeExtentList (concrete)
      • RenderSliverFillViewport (concrete)
      • RenderSliverFixedExtentList (concrete)
    • RenderSliverGrid (concrete)
    • RenderSliverList (concrete)
  • RenderSliverPadding (concrete)
  • RenderSliverPersistentHeader (abstract)
    • RenderSliverFloatingPersistentHeader (concrete)
      • RenderSliverFloatingPinnedPersistentHeader (concrete)
    • RenderSliverPinnedPersistentHeader (concrete)
    • RenderSliverScrollingPersistentHeader (concrete)
  • RenderSliverSingleBoxAdapter (abstract)
    • RenderSliverFillRemaining (concrete)
    • RenderSliverToBoxAdapter (concrete)

These RenderSliver implementations are created by the following widgets:

SliverMultiBoxAdaptorWidget subclasses:

  • SliverPrototypeExtentList
  • SliverFillViewport
  • SliverFixedExtentList
  • SliverGrid
  • SliverList

StatelessWidget subclasses:

  • SliverPersistentHeader
    • which is used by SliverAppBar

SingleChildRenderObjectWidget subclasses:

  • SliverFillRemaining
  • SliverPadding
  • SliverToBoxAdapter

So those are the widgets you can use when you want to produce instances of RenderSliver.

Of course, it's likely that more and more RenderSliver-creating widgets will be added over time, and you can also make your own! Hopefully this list will be enough to get you started.

like image 78
Collin Jackson Avatar answered Oct 02 '22 21:10

Collin Jackson


As of 2021, according to their docs, these are some of the sliver widgets:

SliverAnimatedList

A sliver that animates items when they are inserted or removed.

SliverAnimatedOpacity

Animated version of SliverOpacity which automatically transitions the sliver child's opacity over a given duration whenever the given opacity changes.

SliverFadeTransition

Animates the opacity of a sliver widget.

SliverFillRemaining

A sliver that contains a single box child that fills the remaining space in the viewport.

SliverFillViewport

A sliver that contains multiple box children that each fills the viewport.

SliverFixedExtentList

A sliver that places multiple box children with the same main axis extent in a linear array.

SliverGrid

A sliver that places multiple box children in a two dimensional arrangement.

SliverIgnorePointer

A sliver widget that is invisible during hit testing.

SliverLayoutBuilder

Builds a sliver widget tree that can depend on its own SliverConstraints.

SliverList

A sliver that places multiple box children in a linear array along the main axis.

SliverOffstage

A sliver that lays its sliver child out as if it was in the tree, but without painting anything, without making the sliver child available for hit testing, and without taking any room in the parent.

SliverOpacity

A sliver widget that makes its sliver child partially transparent.

SliverOverlapAbsorber

A sliver that wraps another, forcing its layout extent to be treated as overlap.

SliverOverlapAbsorberHandle

Handle to provide to a SliverOverlapAbsorber, a SliverOverlapInjector, and an NestedScrollViewViewport, to shift overlap in a NestedScrollView.

SliverOverlapInjector

A sliver that has a sliver geometry based on the values stored in a SliverOverlapAbsorberHandle.

SliverPadding

A sliver that applies padding on each side of another sliver.

SliverPersistentHeader

A sliver whose size varies when the sliver is scrolled to the edge of the viewport opposite the sliver's GrowthDirection.

SliverPrototypeExtentList

A sliver that places its box children in a linear array and constrains them to have the same extent as a prototype item along the main axis.

SliverReorderableList

A sliver list that allows the user to interactively reorder the list items.

SliverSafeArea

A sliver that insets another sliver by sufficient padding to avoid intrusions by the operating system.

SliverToBoxAdapter

A sliver that contains a single box widget.

SliverVisibility

Whether to show or hide a sliver child.

like image 43
user1032613 Avatar answered Oct 02 '22 21:10

user1032613