Question

我正在学习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;
              });
            },
          )
        ],
      ),
    );
  }
}

Answer 1

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

修复：将其作为 instance 变量移动。

原因：仅当其状态更改时，窗口小部件才会得到重建。

代码：

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
  }
}

Answer 2

我认为可变边距不具有构建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

Answer 3

给Slider(value: tasksDetails.taskImportance.toDouble(), etc)

时遇到问题

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

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

Answer 4

将变量放入构建函数function

时遇到了这个问题

@override
Widget build(BuildContext context) {

int brightness = 85;

return Scaffold(
...

将变量移动到函数外部并得到求解solved

int brightness = 85;

@override
Widget build(BuildContext context) {

return Scaffold(
...

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

Flutter Slider无法移动或更新

4 个答案: