title: How can I make instant screen change in flutter?
body: <p>I want to create circles whose radius are chosen by users in flutter. When I change the options, the circle always stays fixed on the screen and does not change. I have to restart for the image on the screen to change. I searched how to fix it but couldn't find a solution. I used the setstate function but it didn't work. How can I change the image on the screen when I change the radius?</p>
  <pre><code>  LatLng _initialCameraPosition = LatLng(37.77483, -122.41942);
    late GoogleMapController _controller;
    String dropdownValue = '100';
    
   Set&lt;Circle&gt; _circles = HashSet&lt;Circle&gt;();
  
    void _setCircles(String radius) async {
      
      var position = await Geolocator.getCurrentPosition(
          desiredAccuracy: LocationAccuracy.high);
      
      setState(() {
        _circles.add(
          Circle(
              circleId: CircleId(&quot;0&quot;),
              center: LatLng(position.latitude, position.longitude),
              radius: double.parse(radius),
              strokeWidth: 2,
              fillColor: Color.fromRGBO(102, 51, 153, .5)),
        );
      });
    }
    @override
    void initState() {
      super.initState();
      _setCircles(dropdownValue);
    }
    void _onMapCreated(GoogleMapController _cntlr) {
      _controller = _cntlr;   
    }
    @override
    Widget build(BuildContext context) {
      return Scaffold(
        body: Column(
          children: [
            Expanded(
              flex: 10,
              child: SizedBox(
                child: GoogleMap(
                  initialCameraPosition:
                      CameraPosition(target: _initialCameraPosition),
                  mapType: MapType.normal,
                  onMapCreated: _onMapCreated,
                  myLocationEnabled: true,
                  circles: _circles,
                ),
              ),
            ),
            Expanded(
              flex: 1,
              child: DropdownButton&lt;String&gt;(
                value: dropdownValue,
                icon: const Icon(Icons.arrow_downward),
                iconSize: 24,
                elevation: 16,
                style: const TextStyle(color: Colors.deepPurple),
                underline: Container(
                  height: 2,
                  color: Colors.deepPurpleAccent,
                ),
                onChanged: (String? newValue) {
                  setState(() {
                    dropdownValue = newValue!;
                    _setCircles(newValue);
                  });
                },
                //onTap: () =&gt; updateStatus(dropdownValue),
                items: &lt;String&gt;[
                  '100',
                  '250',
                  '500',
                  '1000',
                ].map&lt;DropdownMenuItem&lt;String&gt;&gt;((String value) {
                  return DropdownMenuItem&lt;String&gt;(
                    value: value,
                    child: Text(value),
                  );
                }).toList(),
              ),
            ),
          ],
        ),
      );
    }
  }
  </code></pre>
  <p><strong>EDIT</strong> I wrote <code>_circles.clear();</code> before the add function. This worked for me</p>