实时实时更新文本数据

Question

我对Flutter还是很陌生，我一直在寻找答案。

我想制作一个非常简单的时间选择器样式的对象，而无需弹出窗口或其他干扰。因此，因此.....

我有一个String对象和一个Text小部件以显示该String。 Text小部件周围有一个垂直拖动手势识别器。拖动时，我会使用一些计算方法来调整String的值，并期望通过Text小部件将其显示出来。除一个主要问题外，此方法有效。

Text小部件可能需要30秒或更长时间才能更改，因此用户无法使用拖动方法看到他们选择的值。

是否有任何方法可以强制Text小部件在更改时显示字符串？

[我尝试将Text小部件包装在手势识别器中，但是触摸区域太小，因此其他文本和填充小部件。

child: Padding(
  padding: EdgeInsets.fromLTRB(20,10, 20, 5),
  child: Column(
    children:<Widget>[
      Text("Start of Day",
        style: new TextStyle(
          fontWeight: FontWeight.bold,
          fontSize: 16.0,
          color: Colors.black,
        ),
      ),
      Text(_startOfDay,
        style: new TextStyle(
          fontWeight: FontWeight.bold,
          fontSize: 16.0,
          color: Colors.black,
        ),
      ),
    ],
  ),
),
onVerticalDragStart: (DragStartDetails details){
  _offset = 0;
},
onVerticalDragUpdate: (DragUpdateDetails moveDetails){
  _offset = _offset + moveDetails.delta.dy;
  if(_offset > 10||_offset < -10){
    var startparts = _startOfDay.split(":");
    double startHour = double.parse(startparts[0]);
    double startMinute = (double.parse(startparts[1]))/15;
    if(_offset > 10){
      startMinute = startMinute - 1;
      if(startMinute < 0){
        startMinute = 3;
        startHour = startHour - 1;
      }
      if(startHour < 0){
        startHour=0;
        startMinute=0;
      }
      _startOfDay = startHour.toInt().toString().padLeft(2,'0')+ ':' + (startMinute * 15).toInt().toString().padLeft(2,'0');
      _offset = _offset - 10;
      globals.startOfDay=_startOfDay;
    }
    if(_offset < -10){
      startMinute = startMinute + 1;
      if(startMinute > 3){
        startMinute = 0;
        startHour = startHour + 1;
      }
      if(startHour == 24){
        startHour=23;
        startMinute=3;
      }
      _startOfDay = startHour.toInt().toString().padLeft(2,'0')+ ':' + (startMinute * 15).toInt().toString().padLeft(2,'0');
      globals.startOfDay=_startOfDay;
      _offset = _offset + 10;
    }
  }
} 

Answer 1

您所缺少的是setState(...)。

[属性更改时，您需要调用setState()以使用属性的新状态重建小部件。在这种情况下，只要setState发生更改，就需要调用_startOfDay。

尝试此代码：

child: Padding(
  padding: EdgeInsets.fromLTRB(20,10, 20, 5),
  child: Column(
    children:<Widget>[
      Text("Start of Day",
        style: new TextStyle(
          fontWeight: FontWeight.bold,
          fontSize: 16.0,
          color: Colors.black,
        ),
      ),
      Text(_startOfDay,
        style: new TextStyle(
          fontWeight: FontWeight.bold,
          fontSize: 16.0,
          color: Colors.black,
        ),
      ),
    ],
  ),
),
onVerticalDragStart: (DragStartDetails details){
  _offset = 0;
},
onVerticalDragUpdate: (DragUpdateDetails moveDetails){
  _offset = _offset + moveDetails.delta.dy;
  if(_offset > 10||_offset < -10){
    var startparts = _startOfDay.split(":");
    double startHour = double.parse(startparts[0]);
    double startMinute = (double.parse(startparts[1]))/15;
    if(_offset > 10){
      startMinute = startMinute - 1;
      if(startMinute < 0){
        startMinute = 3;
        startHour = startHour - 1;
      }
      if(startHour < 0){
        startHour=0;
        startMinute=0;
      }
      _startOfDay = startHour.toInt().toString().padLeft(2,'0')+ ':' + (startMinute * 15).toInt().toString().padLeft(2,'0');
      setState(() {});
      _offset = _offset - 10;
      globals.startOfDay=_startOfDay;
    }
    if(_offset < -10){
      startMinute = startMinute + 1;
      if(startMinute > 3){
        startMinute = 0;
        startHour = startHour + 1;
      }
      if(startHour == 24){
        startHour=23;
        startMinute=3;
      }
      _startOfDay = startHour.toInt().toString().padLeft(2,'0')+ ':' + (startMinute * 15).toInt().toString().padLeft(2,'0');
      globals.startOfDay=_startOfDay;
      _offset = _offset + 10;
      setState(() {});
    }
  }
}