CODEWITHSUNDEEP
flutter
edi233
edi233

Reputation: 3031

Change icon after click in flutter

I have code:

class SoundIcon extends StatelessWidget {
  bool soundIsAvailable;
  SoundIcon(this.soundIsAvailable);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(10),
      alignment: Alignment.bottomLeft,
      child: IconButton(
        icon: SvgPicture.asset(
          soundIsAvailable ? "assets/graphics/sound_on.svg" : "assets/graphics/sound_off.svg",
          fit: BoxFit.fill,
        ),
        tooltip: 'Set sound',
        onPressed: () {
          setSoundStatus(context);
        },
      ),
    );
  }

  void setSoundStatus(BuildContext context) {
    final level1Cubit = context.read<Level1Cubit>();
    level1Cubit.setSoundStatus();
  }
}

What I need to do to change icon after click, because now it works only when screen refresh.

Upvotes: 0

Views: 1601

Answers (1)

Larvouu
Larvouu

Reputation: 162

I think your issue is that you have to use the setState method, so the UI can refresh.

Please note that the setState method is a member of the State class. Not the StatefulWidget class. See The method 'setState' isn't defined for the type 'pickImage' for more on this.

Here is what your code should look like IMO :

import 'package:flutter/material.dart';

class SoundIcon extends StatefulWidget {

  bool soundIsAvailable;
  SoundIcon({Key key, this.soundIsAvailable}) : super(key: key);

  @override
  _SoundIconState createState() => _SoundIconState();
}

class _SoundIconState extends State<SoundIcon> {

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(10),
      alignment: Alignment.bottomLeft,
      child: IconButton(
        icon: SvgPicture.asset(
          widget.soundIsAvailable ? "assets/graphics/sound_on.svg" : "assets/graphics/sound_off.svg",
          fit: BoxFit.fill,
        ),
        tooltip: 'Set sound',
        onPressed: () {
//you have to use a setState to perform a relaunch of the UI
          setState(() {
            widget.soundIsAvailable = true;
          });
        },
      ),
    );
  }
}

Upvotes: 1

Related Questions