Проблема с отображением флаттера - PullRequest
0 голосов
/ 06 февраля 2019

Я пишу очень простое приложение, которое просто отображает цифры на экране, и вы можете увеличивать и уменьшать значение этого числа с помощью некоторых кнопок.

Работает нормально, за исключением того, что текстовый дисплей часто сходит с ума,Я покажу вам, что я имею в виду:

display issue

Приведенный выше текст пытается отобразить значение 20, но почему-то пытается,как вы можете видеть.

Кажется, что это происходит только с двузначными или более высокими значениями.Мой код:

class _SinglePlayerModeParentState extends State<SinglePlayerMode> {

@override
void initState() {
  super.initState();
  SystemChrome.setEnabledSystemUIOverlays([]);
  SystemChrome.setPreferredOrientations([DeviceOrientation.landscapeLeft,]);
}

@override
Widget build(BuildContext context) {
Widget numberDisplay = GestureDetector(
  onTap: () {
    print("GestureDetector");
    _incrementBy1();
  },
  child: Center(child: Text(_numberValue.toString(),
    style: TextStyle(
      fontSize: 200.0,
      color: Colors.white,
      ),
    ),
  ),
);

Этот код уже отображал эти текстовые проблемы, прежде чем я переставил код, чтобы включить также следующее:

Widget buttonRow() {
  return Row(
    mainAxisSize: MainAxisSize.max,
    crossAxisAlignment: CrossAxisAlignment.end,
    mainAxisAlignment: MainAxisAlignment.spaceAround,
    children: [
      Row(
       mainAxisAlignment: MainAxisAlignment.spaceAround,
       children: <Widget>[
         Padding(
           padding: EdgeInsets.only(left: 40.0, right: 20.0),
           child: FloatingActionButton(
              heroTag: null,
              onPressed: _numberValueMinus5,
              child: Text('-5'),
            ),
         ),
         Padding(
           padding: EdgeInsets.only(left: 20.0, right: 40.0),
           child: FloatingActionButton(
              heroTag: null,
              onPressed: _numberValueMinus1,
              child: Text('-1'),
            ),
         ),
        ],
      ),
      Row(
        children: <Widget>[
          Padding(
            padding: EdgeInsets.only(left: 40.0, right: 20.0),
            child: FloatingActionButton(
              heroTag: null,
              onPressed: _numberValuePlus1,
              child: Text('+1'),
            ),
          ),
          Padding(
            padding: EdgeInsets.only(left: 20.0, right: 40.0),
            child: FloatingActionButton(
              heroTag: null,
              onPressed: _numberValuePlus5,
              child: Text('+5'),
            ),
          ),
        ],
      ),
    ],
  );
}

return MaterialApp(
  title: 'Bean Counter',
  home: Scaffold(
    backgroundColor: Colors.blueAccent,
    body: Column(
      children: [
        Padding(
          padding: EdgeInsets.only(top: 90.0, bottom: 40.0),
          child: numberDisplay,
        ),
        buttonRow(),
      ],
    ),
  ),
);
}

Не уверен, что я могу сделать по-другому здесь,это просто текст!

Есть мысли?

Редактировать: Тестирование решения FittedBox.

@override
Widget build(BuildContext context) {
  Widget numberDisplay = GestureDetector(
    onTap: () {
      print("GestureDetector");
      _incrementBy1();
    },
    child: Center(
      child: FittedBox(
        fit: BoxFit.scaleDown,
        child: Text(_numberValue.toString(),
          style: TextStyle(
          fontSize: 200.0,
          color: Colors.white,
          ),
        ),
      ),
    ),
  );

}

Результаты: при этом пытается отобразить число 30:

Text issue 2

Как видите, он по-прежнему не отображается должным образом.Я также пробовал BoxFit.contain, та же проблема.Информация получена по этой ссылке: https://docs.flutter.io/flutter/painting/BoxFit-class.html

Есть еще идеи, ребята?Или я неправильно реализовал FittedBox?

Редактировать: пробовал с AutoSizeText, как рекомендуется ниже.Код:

@override
Widget build(BuildContext context) {
Widget scoreText = GestureDetector(
  onTap: () {
    print("GestureDetector");
    _incrementBy1();
  },
  child: Center(
    child: AutoSizeText(_numberValue.toString(),
      style: TextStyle(
      fontSize: 200.0,
      color: Colors.white,
      ),
    ),
  ),
);

Результаты:

Text issue 3

Argh!Отображение текста на четком экране.Уровень: сложный.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...