CODEWITHSUNDEEP
flutter
e-j5
e-j5

Reputation: 1859

Flutter ColorFiltered Widget with Text widget

I'm using the ColorFiltered widget to grey out widgets that are disabled for a reason.

The ColorFiltered widget works well with images, but it won't change the Text widget color.

Is that a way to grey out images and Text widgets at once?

The following is my 'DisableWidget'

class DisableWidget extends StatelessWidget {
  final Widget child;
  final bool disable;
  const DisableWidget({
    Key key,
    this.child,
    this.disable = false,
  }) : super(key: key);

  Widget build(BuildContext context) {
    return disable
        ? ColorFiltered(
            colorFilter: ColorFilter.mode(Colors.grey, BlendMode.saturation),
            child: AbsorbPointer(absorbing: true, ignoringSemantics: true, child: child),
          )
        : child;
  }
}

Upvotes: 0

Views: 924

Answers (1)

e-j5
e-j5

Reputation: 1859

I managed to do it by wrapping the ColorFiltered with Opacity widget.

Here is my final DisableWidget.

class DisableWidget extends StatelessWidget {
  final Widget child;
  final bool disable;
  const DisableWidget({
    Key key,
    this.child,
    this.disable = false,
  }) : super(key: key);

  Widget build(BuildContext context) {
    return disable
        ? Opacity(
            opacity: 0.5,
            child: ColorFiltered(
              colorFilter: ColorFilter.mode(Colors.grey, BlendMode.saturation),
              child: AbsorbPointer(
                absorbing: true,
                ignoringSemantics: true,
                child: child,
              ),
            ),
          )
        : child;
  }
}

Upvotes: 2

Related Questions