Блог

Я новичок в флаттере. Я думаю, что понимаю некоторые идеи — в частности, метод build() заключается в том, как вы вносите изменения, воссоздавая вещи, а не изменяя их.

Но меня это смущает. В моем build() я пытаюсь создать новую строку () с новым текстом() в качестве одного из ее дочерних элементов. Но dart жалуется, что «значения в литерале списка const должны быть постоянными».

Обратите внимание, что это урезанная версия того, что я на самом деле написал. Я понимаю, что мне нужно вызвать setState (), чтобы все изменилось. Но я действительно не понимаю, почему displayText это не const Text так . Или, собственно, почему это должно быть const Text , так Text как само по себе является неизменным, и я строю совершенно новое Row .

 import 'package:flutter/material.dart';

class GameTimer extends StatefulWidget {
  final TextStyle timerStyle;
  const GameTimer({Key? key, required this.timerStyle}) : super(key: key);
  @override
  State createState() => _TimerState();
}

class _TimerState extends State<GameTimer> {
  final startedAt = DateTime.now();
  String timerDisplay() {
    int minutes = (DateTime.now().difference(startedAt).inSeconds / 60).floor();
    return '$minutes';
  }

  @override
  Widget build(BuildContext context) {
    var displayText = Text(timerDisplay(), style: widget.timerStyle); // this is not const Text
    return Row(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: const <Widget>[
          Icon(Icons.play_circle),
          displayText, // <== "the values in a const list literal must be const."
        ]);
  }
}
 

Как метод построения виджета() может изменить текст в строке() в зависимости от состояния? Это флаттер 3.5, дарт 2.14.

const виджеты не могут быть обновлены с помощью переменной.

 Text("Some text");
 

Это const текстовый виджет.

 Text(textValueVariable);
 

Это не const виджет. Потому что значение textValueVariable может быть изменено.

Использование const позволяет избежать ненужных перестроек виджета.

В вашем сценарии,

 
class GameTimer extends StatefulWidget {
  const GameTimer({
    Key? key,
    required this.timerStyle,
  }) : super(key: key);

  final TextStyle timerStyle;

  @override
  State createState() => _TimerState();
}

class _TimerState extends State<GameTimer> {
  final startedAt = DateTime.now();

  // Initial value of Text
  String _timerDisplay = '0';

  void updateTimerDisplay() {
    int minutes = (DateTime.now().difference(startedAt).inSeconds / 60).floor();

    // Update value of Text
    setState(() {
      _timerDisplay = minutes.toString();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      children: [
        const Icon(Icons.play_circle), // Only this Icon widget is a const
        Text(
          _timerDisplay,
          style: widget.timerStyle,
        ),
      ],
    );
  }
}