Running Syncfusion Flutter Sliders on Flutterflow?

Question

I'm trying to get this widget up and running on flutterflow using a mixture of boilerplate and example code but I keep getting errors that make me think I may be missing a/some dependencies. I'm about 3 days into using dart/flutter so please forgive me if I'm missing something pretty basic!

Here's my custom widget code:

import 'package:syncfusion_flutter_sliders/sliders.dart';

class NewCustomWidget extends StatefulWidget {
  const NewCustomWidget({
    Key? key,
    this.width,
    this.height,
    this.value,
  }) : super(key: key);

  final double? width;
  final double? height;
  final double? value;

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

// dynamic setState;

class _NewCustomWidgetState extends State<NewCustomWidget> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: SfSlider(),
        ),
      ),
    );
  }
}

double _value = 40.0;

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: const Text('Syncfusion Flutter Slider'),
    ),
    body: SfSlider(
      min: 0.0,
      max: 100.0,
      value: _value,
      interval: 20,
      showTicks: true,
      showLabels: true,
      enableTooltip: true,
      minorTicksPerInterval: 1,
      onChanged: (dynamic value) {
        setState(() {
          _value = value;
        });
      },
    ),
  );
}

And my dependencies are here:

And my defined parameters are here:

The errors I'm getting are these...

the named parameter 'onChange' is required, but there's no corresponding argument. Try adding the required argument.

Same thing for value (which I've added as a parameter in the interface) and setState parameters.

Is there some setup I'm missing or something basic?

Answer 1

You have used the slider widget two times in your code. The errors that you are getting are related to the first slider which does not have the required parameter. Also, you should not create a widget build context without a class or function, It will remain as dead code because it can not be accessed. I made the required changes in your code.

Full Code : -

import 'package:flutter/material.dart';
import 'package:syncfusion_flutter_sliders/sliders.dart';

void main() {
  runApp(const NewCustomWidget());
}

class NewCustomWidget extends StatefulWidget {
  const NewCustomWidget({
    Key? key,
    this.width,
    this.height,
    this.value,
  }) : super(key: key);

  final double? width;
  final double? height;
  final double? value;

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

// dynamic setState;

class _NewCustomWidgetState extends State<NewCustomWidget> {
  double _value = 40.0;
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Syncfusion Flutter Slider'),
        ),
        body: Center(
          child: SfSlider(
            min: 0.0,
            max: 100.0,
            value: _value,
            interval: 20,
            showTicks: true,
            showLabels: true,
            enableTooltip: true,
            minorTicksPerInterval: 1,
            onChanged: (dynamic value) {
              setState(() {
                _value = value;
              });
            },
          ),
        ),
      ),
    );
  }
}

Output : -