Я пишу очень простое приложение, которое просто отображает цифры на экране, и вы можете увеличивать и уменьшать значение этого числа с помощью некоторых кнопок.
Работает нормально, за исключением того, что текстовый дисплей часто сходит с ума,Я покажу вам, что я имею в виду:
![display issue](https://i.stack.imgur.com/V4JNu.png)
Приведенный выше текст пытается отобразить значение 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](https://i.stack.imgur.com/mUT7N.png)
Как видите, он по-прежнему не отображается должным образом.Я также пробовал 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](https://i.stack.imgur.com/zWC2Z.png)
Argh!Отображение текста на четком экране.Уровень: сложный.