В чем разница между "*" и "Авто" в определениях компоновки сетки Silverlight?
пытается понять следующее:
<Grid Name="Root">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
</Grid>
Может ли кто-нибудь помочь мне объяснить разницу между * и Auto в приведенном выше фрагменте?
спасибо
Ответы
Ответ 1
Auto
означает, что этот столбец/строка содержит размер содержащихся элементов.
*
означает разделение остальной части доступного пространства с другими столбцами/строками, которые также указывают *
.
Фактически *
эквивалентно 1*
. Для ширины или высоты можно указать 2*
, 3*
... N*
. Алгоритм, используемый Silverlight, состоит в том, чтобы суммировать все значения N для всех строк с помощью *
, а затем дать каждой строке соответствующую долю доступного пространства. Например: -
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="2*" />
<RowDefinition Height="3*" />
<RowDefinition Height="Auto" />
</Grid.Definitions>
Это сначала определит, насколько высока четвертая строка должна быть из ее содержимого и вычесть из полной доступной высоты. Остальная часть высоты будет разделена между рядами *
. Первый получает 1/6, второй получает 1/3, а третий получает 1/2 от доступной высоты.
Ответ 2
Auto
сделает каждый размер столбца таким образом, чтобы он мог вместить все, что содержится в нем.
*
будет использовать максимальный объем доступного пространства. Лучше всего использовать, когда у вас есть столбец "left over", который вы хотите изменить только до того, что осталось.
Пример Сетка ширины undefined.
Сценарий 1:
Column 1 | Column 2 | Column 3
----------------------------------
100 Width | Auto | 200 Width
В этом случае столбец 2 может быть любым между 1 и любым содержимым, которое ему требуется, и максимальным пространством, доступным для ширины сетки. Если столбец 2 был изменен на *
и ширина, определенная на сетке в целом, она заполнила бы левое пространство для достижения ширины сетки. Если у вас было два столбца, заданных как *
, и определенная ширина сетки, они будут конкурировать за левое пространство и разделить его.
Обычно я использую *
только для одного столбца (хотя это не правило), если у меня есть элемент управления, который настроен на динамический размер, чтобы столбец заполнил все пространство, оставленное другими столбцами, Это здорово, если вам нужны столбцы определенного размера для элемента с динамическим размером и хотите, чтобы определенные столбцы оставались фиксированными и определяли один столбец для расширения, чтобы заполнить остальную часть элемента управления. Auto
не будет делать этого с пустым или низким столбцами контента, которые фактически не заполнят оставшееся пространство.
Сценарий 2 (col 3 содержит контент шириной 100, а сетка имеет общую ширину 800):
Column 1 | Column 2 | Column 3 | Column 4
--------------------------------------------
100 Width | 200 Width | Auto | *
Столбец 3 будет иметь размер до 100. Столбец 4 будет иметь размер до 400 ширины, чтобы заполнить левое пространство.
Ответ 3
Эта страница (правда, из Silverlight 2, но она по-прежнему действительна) содержит несколько примеров использования сетки со следующими пояснениями:
Для каждой строки в Grid мы имеем элемент RowDefinition. Все определения строк заключены в элемент Grid.RowDefinitions. Наши первые две строки имеют высоту 50 пикселей, а высота третьего - "*". Это указывает на то, что строка займет все место в сетке, которая не будет взята другими строками.
и
Другой вариант - установить ширину и/или высоту на "авто". Таким образом, каждый столбец/строка меняет свой размер так, чтобы соответствовать ширине/высоте элементов управления в нем. Например: