Der Status der Listen-Widgets wird nicht aktualisiert, wenn StatefulBuilder flattert

Question

Meine Frage ist, dass setstate nicht mit dem Statefulbuilder und der Liste der Widgets funktioniert, deren Farbe ich aktualisieren möchte. Obwohl die Farbe der Schaltfläche aktualisiert wird. Ich bin mir nicht sicher, wo das Problem liegt

 Color currentColor = Colors.grey;
 void changecolor(Color color) {
   setState(() {
   currentColor = color;
   });
 }
 List<Widget> list = [];
 @override
Widget build(BuildContext context) {
   return Container(
   child: Stack(
       children: [
         Container(
          height: MediaQuery.of(context).size.height,
           width: MediaQuery.of(context).size.width,
       ),
         Positioned(
            right: 50,
          top: 50,
          child: RaisedButton(
            elevation: 3.0,
             onPressed: () {
              showDialog(
                context: context,
                 builder: (BuildContext context) {
                   return AlertDialog(
                     titlePadding: const EdgeInsets.all(0.0),
                    contentPadding: const EdgeInsets.all           (0.0),
                      content: SingleChildScrollView(
                       child: MaterialPicker(
                        pickerColor: currentColor,
                        onColorChanged: changecolor,
                        enableLabel: true,
                      ),
                   ),
                  );
              },
             );
          },
          child: const Text('Change me'),
          color: currentColor,
          
        ),
      ),
      ...list,
      Positioned(
        left: 50,
        top: 50,
        child: RaisedButton(
          child: Text(
            'Add another Color Sticker',
            style: TextStyle(fontSize: 10),
            ),
            onPressed: () {
               setState(
                () {
                 list.add(
                  StatefulBuilder(
                      builder: (BuildContext context,                     StateSetter setState) {
                         return Positioned(
                           left: 100,
                            top: 100,
                           child: Container(
                             color: currentColor,
                              height: 100,
                             width: 100,
                           ),
                          );
                       },
                     ),
                   );
                 },
               );
             },
            ),
          ),
       ],
      ),
    );

Kann mir jemand bei diesem Problem helfen? Ich kann nicht verstehen, warum die Farbe des Behälters nicht aktualisiert wird. Vielen Dank im Voraus.

Answer 1

Sie können den folgenden Code kopieren und ausführen.
In diesem Fall können Sie ein Snippet verwenden ValueNotifier<Color>und ValueListenableBuilder
codieren

ValueNotifier<Color> currentColor = ValueNotifier(Colors.grey);
...
MaterialPicker(
    pickerColor: currentColor.value,
...
child: const Text('Change me'),
              color: currentColor.value,
...
list.add(ValueListenableBuilder(
                        valueListenable: currentColor,
                        builder: (BuildContext context, Color current,
                            Widget child) {
                          return Positioned(
                            left: 100,
                            top: 100,
                            child: Container(
                              color: current,
                              height: 100,
                              width: 100,
                            ),
                          );
                        }));    

Arbeitsdemo

vollständiger Code

import 'package:flutter/material.dart';
import 'package:flutter_colorpicker/flutter_colorpicker.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Test(),
    );
  }
}

class Test extends StatefulWidget {
  @override
  _TestState createState() => _TestState();
}

class _TestState extends State<Test> {
  ValueNotifier<Color> currentColor = ValueNotifier(Colors.grey);

  void changecolor(Color color) {
    setState(() {
      currentColor.value = color;
    });
  }

  List<Widget> list = [];

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Stack(
        children: [
          Container(
            height: MediaQuery.of(context).size.height,
            width: MediaQuery.of(context).size.width,
          ),
          Positioned(
            right: 50,
            top: 50,
            child: RaisedButton(
              elevation: 3.0,
              onPressed: () {
                showDialog(
                  context: context,
                  builder: (BuildContext context) {
                    return AlertDialog(
                      titlePadding: const EdgeInsets.all(0.0),
                      contentPadding: const EdgeInsets.all(0.0),
                      content: SingleChildScrollView(
                        child: MaterialPicker(
                          pickerColor: currentColor.value,
                          onColorChanged: changecolor,
                          enableLabel: true,
                        ),
                      ),
                    );
                  },
                );
              },
              child: const Text('Change me'),
              color: currentColor.value,
            ),
          ),
          ...list,
          Positioned(
            left: 50,
            top: 50,
            child: RaisedButton(
              child: Text(
                'Add another Color Sticker',
                style: TextStyle(fontSize: 10),
              ),
              onPressed: () {
                setState(
                  () {
                    list.add(ValueListenableBuilder(
                        valueListenable: currentColor,
                        builder: (BuildContext context, Color current,
                            Widget child) {
                          return Positioned(
                            left: 100,
                            top: 100,
                            child: Container(
                              color: current,
                              height: 100,
                              width: 100,
                            ),
                          );
                        }));
                  },
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}