Skip to content

Conversation

@gmaggio
Copy link

@gmaggio gmaggio commented Aug 19, 2020

This is practically the same request as #12. I think it will come in handy for a lot of developers to have the ability to remove all gradient blending and just draw the child. A simple use case is to have a Card UI that shimmers while loading and reveals the text content once loaded.

How to:
Set hideOnDisabled to true to hide the shimmer effect when enabled is false.

@gmaggio gmaggio mentioned this pull request Aug 19, 2020
@The-Redhat
Copy link

Looks good to me

@gmaggio
Copy link
Author

gmaggio commented Sep 8, 2020

@hnvn I wonder if you could review this and possibly merge it as I think it's a much needed feature. Cheers.

@makinghappen
Copy link

@hnvn can you please merge this?

@krrskl
Copy link

krrskl commented Dec 19, 2023

In case someone else comes to this topic and wants an alternative solution to waiting for the feature, they could create the logic in a widget and use that as a shimmer wrapper:

import 'package:flutter/material.dart';
import 'package:shimmer/shimmer.dart';

class CustomShimmer extends StatelessWidget {
  final Widget child;
  final bool loading;
  final Color baseColor;
  final Color highlightColor;

  const CustomShimmer({
    super.key,
    required this.child,
    this.loading = false,
    this.baseColor = Colors.white,
    this.highlightColor = Colors.white60,
  });

  @override
  Widget build(BuildContext context) {
    if (loading) {
      return Shimmer.fromColors(
        baseColor: baseColor,
        highlightColor: highlightColor,
        child: child,
      );
    }

    return child;
  }
}

@GugaDavi
Copy link

In case someone else comes to this topic and wants an alternative solution to waiting for the feature, they could create the logic in a widget and use that as a shimmer wrapper:

import 'package:flutter/material.dart';
import 'package:shimmer/shimmer.dart';

class CustomShimmer extends StatelessWidget {
  final Widget child;
  final bool loading;
  final Color baseColor;
  final Color highlightColor;

  const CustomShimmer({
    super.key,
    required this.child,
    this.loading = false,
    this.baseColor = Colors.white,
    this.highlightColor = Colors.white60,
  });

  @override
  Widget build(BuildContext context) {
    if (loading) {
      return Shimmer.fromColors(
        baseColor: baseColor,
        highlightColor: highlightColor,
        child: child,
      );
    }

    return child;
  }
}

I'm having issues with this approach because whenever there's a change in the loading state, the child component gets destroyed and rebuilt. So, if in the given flow you need to change the loading value, the child’s initState will always be called.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants