颤振滑块不移动或更新答案

【问题标题】：Flutter Slider Not Moving or Updating颤振滑块不移动或更新
【发布时间】：2019-01-31 03:18:54
【问题描述】：

我正在学习 Flutter（以及一般的编码），但我似乎找不到我最新项目的问题。当我在模拟器中运行时，滑块形式很好，单击拇指并显示标签，但拇指根本不会在轨道上移动，因此永远不会调用 onChanged 事件。

import 'resources.dart';
import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';

class ItemDetail extends StatefulWidget {
  final Item item;

  ItemDetail({Key key, @required this.item}) : super(key: key);

  @override
  _ItemDetailState createState() => new _ItemDetailState(item: item);
}

class _ItemDetailState extends State<ItemDetail> {
  Item item;

  _ItemDetailState({Key key, @required this.item});

  @override
  Widget build(BuildContext context) {
    double margin = ((item.listPrice - item.stdUnitCost)/item.listPrice)*100;
    return new Scaffold(
      appBar: AppBar(
        title: new Text('Item Detail'),
      ),
      body: new Column(
        children: <Widget>[
          new Padding(padding: EdgeInsets.symmetric(vertical: 20.0)),
          new Text(item.itemCode),
          new Text(item.itemDescription),
          new Text(item.itemExtendedDescription),
          new Divider(height: 40.0,),
          new Text('List Price: \$${item.listPrice}'),
          new Text('Cost: \$${item.stdUnitCost}'),
          item.itemType=='N'
              ? new Text('Non-Stock (${item.itemType})')
              : new Text('Stock Item (${item.itemType})'),
          new Text('Available: ${item.stockAvailable}'),
          new Padding(padding: EdgeInsets.symmetric(vertical: 10.0)),
          new Slider(
            value: margin,
            divisions: 20,
            min: 0.0,
            max: 100.0,
            label: margin.round().toString(),
            onChanged: (double value) {
              setState(() {
                margin = value;
              });
            },
          )
        ],
      ),
    );
  }
}

【问题讨论】：

标签： flutter

【解决方案1】：

问题：在上面的例子中，margin 不是一个状态变量。它是build 方法中的局部变量。

修复：将此作为实例变量移动。

原因：只有在其状态发生变化时，小部件才会重建。

代码：

class _ItemDetailState extends State<ItemDetail> {
  Item item;
  var margin;

  _ItemDetailState({Key key, @required this.item}) {
    this.margin = ((item.listPrice - item.stdUnitCost)/item.listPrice)*100;
  }

  @override
  Widget build(BuildContext context) {
    //same as now
  }
}

【讨论】：

【解决方案2】：

对于其他来这里的人，我有一个稍微不同的原因，即滑块没有更新。我将value 设置为常量。确保该值是一个变量。

这个：

Slider(
  value: _myValue,
  ...
  onChanged: (newValue) => {
    setState(() => _myValue = newValue)
  },
),

不是这个：

Slider(
  value: 0, //                     <-- problem
  ...
  onChanged: (newValue) => {
    setState(() => _myValue = newValue)
  },
),

【讨论】：

【解决方案3】：

我在提供 Slider(value: tasksDetails.taskImportance.toDouble(), etc) 时遇到问题

我用Slider((_currentImportance ?? tasksDetails.taskImportance).toDouble(), etc)

然后可以移动滑块。我不知道为什么这现在有效。只能猜测与Denish上面的原因“原因：小部件只有在其状态发生变化时才会重建”有关。所选滑块值在两种情况下均已正确保存。

【讨论】：

【解决方案4】：

我认为变量边距没有构建 UI 的范围。调试时，您可以看到变量的变化，但它没有呈现。我通过以下方式进行了尝试，并且能够更新 UI 值。

    class _MyHomePageState extends State<MyHomePage> {

     double margin=0;

     Widget getSlider(BuildContext context)
      {

        return Slider(
      value:margin.toDouble(),
      onChanged: (newRating){

        setState(() {
          margin = newRating;
        });

      },
      min: 0,
      max: 100,
      divisions: 5,
    );
   } // getslider method closed
     // @0verride Widget build method
    // under children widgets , simply call the getSlider method to place the slider
 } //class

【讨论】：

【解决方案5】：

我将变量放入构建函数时遇到了这个问题?

@override
Widget build(BuildContext context) {

int brightness = 85;

return Scaffold(
...

将变量移到函数外并解决了?

int brightness = 85;

@override
Widget build(BuildContext context) {

return Scaffold(
...

因为每次状态改变时，都会调用这个构建方法并将变量设置回分配的值?

【讨论】：

答案对我没有帮助，但回答模式很糟糕

【解决方案6】：

这可能会有所帮助！（我使用 STATEFULDER 来更新价值）

               double _value = 20;

               StatefulBuilder(
                  builder: (context, state) => Center(
                    child: CupertinoSlider(
                      value: _value,
                      min: 0.0,
                      max: 100.0,
                      onChanged: (val) {
                        state(() {
                          _value = val;
                        });
                      },
                    ),
                  ),
                )

【讨论】：