Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added feature to hide the shimmer effect #32

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

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