#user-interface #dart #flutter #alignment
#пользовательский интерфейс #dart #флаттер #выравнивание
Вопрос:
Мне было интересно, почему следует использовать [Expanded] / [Flexible]
сгибание поверх [Align]
выравнивания? Вы можете точно выровнять свой виджет по [Align] и даже потенциально избежать [Padding]
.
Давайте посмотрим на это с другой точки зрения, является ли использование flex of [Expanded] / [Flexible]
более эффективным и быстрым, чем [Align]
?
Ответ №1:
Между Expanded/Flex
и Align
нет сравнения. Взгляните на следующий фрагмент.
Column(
children: [
Container(color: Colors.blue, height: 200),
Align(child: Container(color: Colors.green)), // doesn't show anything
Expanded(child: Container(color: Colors.orange)), // shows up in the remaining space
],
);
Наличие Align
в качестве родительского элемента Container
ничего не покажет на экране, но если вы используете Expanded/Flex
, это займет оставшееся место.
Комментарии:
1. @TheUniqueProgrammer Да, это будет видно потом, я просто хотел показать разницу, запрошенную оператором, между этими двумя виджетами на примере.
2. Ну, это не показывает разницы, поскольку @TheUniqueProgrammer показал, что это то же самое, когда используется Expanded Align .
Ответ №2:
Не уверен, на что вы ссылаетесь. Expanded
предназначен для (более или менее) «выбора», какой виджет внутри Row
/ Column
должен заполнить оставшееся пространство. В то время как Align
просто позиционирует дочерний элемент внутри себя при заданном выравнивании.
Комментарии:
1. Например, я должен использовать Expanded Align, если я хочу что-то выровнять, в противном случае это на это не влияет. Интересно, лучше ли это, чем Expanded (flex) Padding?
2. Это сбивает с толку.. можете ли вы показать пример кода? не уверен, что вы имеете в виду, говоря «это не влияет».. наличие a
Expanded
внутри aRow
/Column
всегда должно иметь эффект3. Я имею в виду, что я не могу использовать виджет выравнивания отдельно в виджете столбца, потому что ничего не произойдет, если я не оберну вокруг него расширенный виджет. Есть причина для этого?
4. конечно, это так.. если у вас есть
Column
withcrossAxisAlignment
=CrossAxisAlignment.stretch
и у вас есть Align (дочерний элемент: Text(‘blubb’)), он расположит ваш текстовый виджет blubb по центру по горизонтали.5. Очевидно, что вы не можете
Align
разместить свой виджет вертикально в aColumn
, потому чтоAlign
у вас не будет больше свободного места, чем размер его дочернего виджета.. для этогоExpanded
и предназначен. расти, чтобы заполнить доступное пространство.