How to pass value from slider to text widget if data are from API?-CodePudding

How can I make this kind of logic: I need the values from the future to be passed to the slider, and when the user drags the slider, the resulting value in the slider is passed to the text widget? I'm trying to do this right now, but I'm getting an error:

The following _TypeError was thrown building FutureBuilder<Map<dynamic, dynamic>?>(dirty, state: _FutureBuilderState<Map<dynamic, dynamic>?>#05fc8):
type 'String' is not a subtype of type 'double' of 'function result'

I managed to do something like this when the data was hardcoded, but I can't do it with values from the API. Also, the fetchGains method accepts a string, not a double.

My map is like that

{
  "min": 1,
  "max": 16,
  "value": 0,
  "step": 1
}

i wrote this code:

Future<Map>? futureGains;

      double values = 1;
      @override
      void initState() {
        super.initState();
        futureGains = GetGainsForCameras().fetchGains(values.toString());
      }
    
       FutureBuilder<Map?>(
                  future: futureGains,
                  builder: (context, shapshot) {
                    return Column(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        SizedBox(
                          width: 510,
                          child: Slider(
                            value: values.toDouble(),
                            activeColor: Colors.green,
                            max: double.parse(shapshot.data?['max'] ?? '')   0.01,
                            min: double.parse(shapshot.data?['min'] ?? ''),
                            inactiveColor: Colors.green,
                            label: shapshot.data?['value'] ?? '',
                            onChanged: (double value) {
                              var v = values;
                              setState(() {
                                v = value;
                                print(value);
                              });
                            },
                          ),
                        ),
                        Text(values.toString(),
                            style: TextStyle(fontSize: 10, color: Colors.black)),
                      ],
                    );
                  })

CodePudding user response：

I think the first problem is you are expecting String but the values in map are int. So, if you really want the string, your map should look like this

{
  "min": "1",
  "max": "16",
  "value": "1",
  "step": "1"
}

and the second problem is null values. You cannot parse empty string. So the code should be changed to:

max: double.parse(shapshot.data?['max'] ?? '16'),
min: double.parse(shapshot.data?['min'] ?? '1'),

And if the value in your map is your current-position, it must be between min and max, it cannot be zero because your min is 1.

Last problem is in your onChanged method. Change it to:

onChanged: (double value) {
  setState(() {
    values = value;
    print(value);
  });
},

Here is the working code: (I didn't used the value in the map, like you.)

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

  @override
  State<TestWidget> createState() => _TestWidgetState();
}

class _TestWidgetState extends State<TestWidget> {
  Future<Map>? futureGains() async {
    return {"min": "1", "max": "16", "value": "1", "step": "1"};
  }
  double current = 1;
  Future<Map>? testMap;

  @override
  void initState() {
    testMap = futureGains();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: FutureBuilder<Map?>(
          future: testMap,
          builder: (context, shapshot) {
            return Column(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              mainAxisSize: MainAxisSize.min,
              children: [
                SizedBox(
                  width: 510,
                  child: Slider(
                    value: current.toDouble(),
                    activeColor: Colors.green,
                    max: double.parse(shapshot.data?['max'] ?? '16')   0.01,
                    min: double.parse(shapshot.data?['min'] ?? '1'),
                    inactiveColor: Colors.green,
                    label: shapshot.data?['value'] ?? '',
                    onChanged: (double value) {
                      setState(() {
                        current = value;
                      });
                    },
                  ),
                ),
                Text(current.toString(),
                    style: const TextStyle(fontSize: 10, color: Colors.black)),
              ],
            );
          }),
    );
  }
}