#flutter #dart
Вопрос:
У меня есть следующий код:
containers.add(Container( decoration: BoxDecoration( borderRadius: BorderRadius.circular(10), color: Colors.blue, ), margin: const EdgeInsets.all(10), width: MediaQuery.of(context).size.width/2-20, height: MediaQuery.of(context).size.width/2-20, child: Column( children: [ Text( value2, style: TextStyle( inherit: false, color: Colors.white, fontSize: MediaQuery.of(context).size.width/2, fontWeight: FontWeight.bold, ) ), ] ) )); }); } });
Сам контейнер переходит в список, который передается в представление сетки, в конечном итоге превращаясь в сетку шириной 2 по экрану. Я хочу сделать так, чтобы высота текста составляла половину высоты контейнера, определяемой шириной и высотой MediaQuery.of(context).size.width/2-20
. Возможно ли это? Спасибо
Ответ №1:
Вы можете использовать Expanded
вместе с FittedBox
:
class HalfHeightText extends StatelessWidget { final String label; const HalfHeightText({required this.label}); Widget build(BuildContext context) { return Container( decoration: BoxDecoration( borderRadius: BorderRadius.circular(10), color: Colors.blue, ), margin: const EdgeInsets.all(10), width: MediaQuery.of(context).size.width / 2 - 20, height: MediaQuery.of(context).size.width / 2 - 20, child: Column( children: [ // =========================================== Expanded( child: FittedBox( fit: BoxFit.contain, child: Text( label, style: const TextStyle( inherit: false, color: Colors.white, fontWeight: FontWeight.bold, ), ), ), ), const Expanded(child: SizedBox.shrink()), // =========================================== ], ), ); } }
Результат:
HalfHeightText(label: "Text")
Ответ №2:
используйте ширину: MediaQuery.of(контекст).размер.ширина 0,50, его среднее значение, как у пользователя шириной 50%, или же MediaQuery.of(контекст).размер.ширина 0,25, среднее значение 25%