How to change the color of a button using the Map key

Viewed 41

I have a Map class in my code that has an int that I want to use as a key and a string containing text.

 final texts = <int, String>{

    2: 'Even',
    4: 'Even',
    6: 'Even',
    8: 'Even',
    10: 'Even',
    12: 'Even',
    1: 'not Even',
    3: 'not Even', 
    5: 'not Even',
    7: 'not Even',
  };

Map elements can move between elevated and text button. These elements are answer options and I would like certain actions to occur when the Elevatedbutton is fully filled with options. If all the options in elevatedbutton are correct, then they change color to green. If any options are incorrect, they are highlighted in red.

I think I could use even key values for correct answers, odd ones for incorrect ones and perform a check when filling, something like this.

for(int i = 0; i <= 20; i++)
  if(i.isEven) print(texts[i]);

But I do not know how I can do a key check and change the color exactly when all elevatedbutton will be filled. All my code

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:neural_puzzle/resources/resources.dart';

class GameView extends StatefulWidget {
  const GameView({Key? key}) : super(key: key);

  @override
  State<GameView> createState() => _GameViewState();
}
class SlotData {
  final int fromTextButtonIndex;
  final String text;
  const SlotData(this.fromTextButtonIndex, this.text);
}
class _GameViewState extends State<GameView> {

  final appBar = AppBar();
  static const numberOfAnswers = 6;

  final freeSlots = List.generate(
    numberOfAnswers,
    (int index) => index,
    growable: true,

  );

  final slots = <int, SlotData>{};
  
  final texts = <int, String>{

    2: 'Even',
    4: 'Even',
    6: 'Even',
    8: 'Even',
    10: 'Even',
    12: 'Even',
    1: 'not Even',
    3: 'not Even', 
    5: 'not Even',
    7: 'not Even',
  };

  _moveSlot(SlotData? textData, int slotIndex) {
    if (textData == null) return;
    setState(() {
      texts[textData.fromTextButtonIndex] = textData.text;
      slots.remove(slotIndex);
      freeSlots.add(slotIndex);
    });
  }

  _moveText(String text, int textIndex) {
    setState(() {
      if (freeSlots.isEmpty || texts[textIndex]!.isEmpty) {
        return;
      }
      final freeSlot = freeSlots.removeAt(0);
      slots[freeSlot] = SlotData(textIndex, text);
      texts[textIndex] = '';
    });
  }
  @override
  Widget build(BuildContext context) {
    SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: []);

    final maxWidth = MediaQuery.of(context).size.width;

    return Scaffold(
      appBar: PreferredSize(
          preferredSize: const Size.fromHeight(40.0),
        child: AppBar(
        ),
      ),
      body: Center(
          child: Column(children: <Widget>[
        Expanded(
            flex: 6,
            child: Container(
              color: Colors.white,
              padding: const EdgeInsets.only(left: 3, right: 3),
              child: 
    const Center(
                child: Image(image: AssetImage(LvlImages.testLvl))))),
        Expanded(
            flex: 5,
            child: Column(
              children: [
                Wrap(
                  alignment: WrapAlignment.spaceAround,
                  spacing: 5.0,
                  children: [
                    for (var i = 0; i < numberOfAnswers; i++)
                      ElevatedButton(
                        onPressed: () => _moveSlot(slots[i], i),
                        child: Text(slots[i]?.text ?? ''),
                      ),
                  ],
                ),
                Wrap(
                  alignment: WrapAlignment.spaceAround,
                  spacing: 5.0,
                  children: [
                    for (final textEntry in texts.entries)
                      TextButton(
                        style: TextButton.styleFrom(
                          textStyle: const TextStyle(fontSize: 20),
                        ),
                        onPressed: () =>
                            _moveText(textEntry.value, textEntry.key),
                        child: Text(textEntry.value),
                      ),
                  ],
                )
              ],
            )),
      ])),
    );
  }
}
0 Answers
Related