Flutter +提供程序:如何将滑块的值传递回提供程序?

时间:2019-09-26 19:51:18

标签: flutter dart provider

扑1.9.1 提供者3.1.0

我目前正在构建我的第一个应用程序,并且我决定立即加入状态管理,以免日后在构建过程中陷入困境。

我已经设置了width_restriction_provider;

class WidthRestrictionProvider extends ChangeNotifier {
  int _widthRestriction = 140;
  int get widthRestriction => _widthRestriction;

  set widthRestriction(int val) {
    _widthRestriction = val;
    notifyListeners();
  }

  changeWidthSlider(int newValue) {
    _widthRestriction = newValue;
    notifyListeners();
      }
    }

这是我的滑块小部件;

  class WidthSlider extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
       final WidthRestrictionProvider widthRestrictionProvider =
        Provider.of<WidthRestrictionProvider>(context);
        return Container(
      child: Slider(
                      min: 140.0,
                      max: 420.0,
                      onChanged: () => widthRestrictionProvider.changeWidthSlider(newValue);
                    ),

    );
  }
}

我尝试了许多不同的方法,但在此过程中一直遇到问题。

如何将新的滑块值成功传递回提供程序?

我目前正在学习Flutter和Dart,因此如果这个问题有点基本,我深表歉意。

1 个答案:

答案 0 :(得分:0)

我通过对范围滑块使用 statefulWidget 解决了这个问题。希望对你有用

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

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

class _RangeSliderPricingState extends State<RangeSliderPricing> {
  RangeValues _currentRangeValues = RangeValues(20, 40);
  @override
  Widget build(BuildContext context) {
    return RangeSlider(
      values: _currentRangeValues,
      min: 0,
      max: 100,
      divisions: 5,
      labels: RangeLabels(
        _currentRangeValues.start.round().toString(),
        _currentRangeValues.end.round().toString(),
      ),
      onChanged: (RangeValues values) {
        print('on change working $values');
        setState(() {
          _currentRangeValues = values;
        });

        context.read<ProductController>().fliterByPriceRange(
            priceStart: values.start.round().toDouble(),
            priceEnd: values.end.round().toDouble());
      },
    );
  }
}