Как мне динамически изменять Padding или margin при флаттере

Question

Для динамического изменения высоты и ширины я использую:

final screenSize = MediaQuery.of(context).size;

Container(
      height: screenSize.height*0.45,
       width: screenSize.width*0.45,

   ),
 ),

Мой вопрос в том, как я могу динамически изменять отступы и поля, чтобы макет выглядел одинаково на экране другого размера, или я должен также использовать screenSize с отступом и полем? Вот как я сейчас его использую

padding: const EdgeInsets.only(top: 10.0, left: 10),

Answer 1

Что вы делаете сейчас, так это то, что будет заполнение 10 пикселей сверху и 10 пикселей с левой стороны экрана. Чтобы Контейнер мог иметь большую или меньшую форму на разных размерах экрана. Вы можете сделать это динамически, используя значения screenSize и медиа-запрос, чтобы вы установили заполнение в соответствии с размером экрана:

padding: EdgeInsets.only(top: screenSize.height*0.1, left: screenSize.width*0.1), 

Результатом приведенного выше кода будет заполнение 10% от высоты экрана сверху и 10% ширины экрана слева. Вот как вы можете динамически устанавливать отступы. (Также имейте в виду, что вы не можете использовать ключевое слово const, если вы используете значения mediaQuery, поскольку значение недоступно во время компиляции.

Посмотрите эту статью.