Milad-Akarie / skeletonizer

MIT License
367 stars 24 forks source link

Possible to use with Sliver List/Grid? #1

Closed arnab closed 1 year ago

arnab commented 1 year ago

This is a super cool plugin! Thank you!

I am trying to use this within a CustomScrollView that usually renders SliverList and SliverGrids.

During loading, when I try to use a fake SliverList:

  _skeletonedLoadingList(BuildContext ctx) => Skeletonizer(
        enabled: true,
        child: SliverList.separated(
          itemCount: 7,
          itemBuilder: (context, index) {
            return Card(
              child: ListTile(
                title: Text('Item number $index as title'),
                subtitle: const Text('Subtitle here'),
                trailing: const Icon(Icons.ac_unit),
              ),
            );
          },
          separatorBuilder: (ctx, i) =>
              const Divider(thickness: 0.8, height: 2),
        ),
      );

... I get this error:

A RenderSkeletonizer expected a child of type RenderBox but received a child of type RenderSliverList.

Is it possible to use this with Sliver widgets?

arnab commented 1 year ago

I was able to work around this by using a standard ListView (not a Sliver) and wrapping that with Box constraints:

  _skeletonedLoadingList(BuildContext ctx) => Skeletonizer(
        enabled: true,
        child: SizedBox(
          height: 500,
          child: ListView.separated(
            itemCount: 7,
            itemBuilder: (context, index) {
              return Card(
                child: ListTile(
                  title: Text('Item number $index as title'),
                  subtitle: const Text('Subtitle here'),
                  trailing: const Icon(Icons.ac_unit),
                ),
              );
            },
            separatorBuilder: (ctx, i) =>
                const Divider(thickness: 0.8, height: 2),
          ),
        ),
      );
Milad-Akarie commented 1 year ago

Hey @arnab Thanks for reporting, I totally missed this use-case as I tested on CustomScrollView as a whole.

Just added SliverSkeletonizer and Skeletonizer.sliver ( same thing ) to be used with sliver widgets in version 0.2.0.