Flutter - 带有更改开/关图标的通知按钮

Question

I would like to convert this elevated button with the "notifications on / off" function to a button with a changing icon, similar to the button below which is for dark / light mode. only that stops with notifications on and off, the icon changes...

                          child: ElevatedButton(
                            style: ElevatedButton.styleFrom(
                                primary: Color(0xFF34445C)),
                            onPressed: () {
                              setState(() {
                                _notificationsEnabled =
                                    !_notificationsEnabled;
                                _updateNotifications(_notificationsEnabled);
                              });
                            },
                            child: Text(
                                _notificationsEnabled
                                    ? 'PUSH-BENACHRICHTIGUNGEN AKTIVIERT'
                                    : 'PUSH-BENACHRICHTIGUNGEN DEAKTIVIERT',
                                style: TextStyle(
                                    fontSize: 11.0)),
                          ),

So the line (isDark? Icons.wb_sunny: Icons.brightness_2,) would have to be connected to the _notificationsEnabled function so that the icon does not change depending on the dark / light mode, but rather a notifications on / off icon.

                    child: ClipOval(
                      child: Material(
                        color: Color(0xFF282C39),
                        child: InkWell(
                          splashColor: Colors.blue,
                          child: SizedBox(
                              width: 32,
                              height: 32,
                              child: Icon(
                                  isDark ? Icons.wb_sunny : Icons.brightness_2,
                                  size: 20,
                                  color: Colors.white)),
                          onTap: () {
                            isDark
                                ? Magazin.of(context)!
                                .setBrightness(Brightness.light)
                                : Magazin.of(context)!
                                .setBrightness(Brightness.dark);
                          },
                        ),
                      ),
                    ),

Answer 1

You should use ElevatedButton.icon . Here an example base on your code.

        ElevatedButton.icon(
            icon: _notificationsEnabled
                ? Icon(Icons.notifications_active)
                : Icon(Icons.notifications_off),
            label: Text(
              _notificationsEnabled
                  ? 'PUSH-BENACHRICHTIGUNGEN AKTIVIERT'
                  : 'PUSH-BENACHRICHTIGUNGEN DEAKTIVIERT',
              style: TextStyle(fontSize: 11.0),
            ),
            onPressed: () {
              setState(() {
                _notificationsEnabled = !_notificationsEnabled;
                _updateNotifications(_notificationsEnabled);
              });
            },
          ),