Was macht der WPF-Stern (Breite = "100 *")


Antworten:


234

In einem WPF-Raster Width="*"oder Height="*"bedeutet proportionale Dimensionierung.
Zum Beispiel: 30% für Spalte 1 und 70% für Spalte 2 geben -

<ColumnDefinition Width="3*" />
<ColumnDefinition Width="7*" />

Geben Sie hier die Bildbeschreibung ein

Und ebenso für Reihen -

<RowDefinition Height="3*" />
<RowDefinition Height="7*" />

Die Zahlen müssen keine ganzen Zahlen sein.
Wenn die Breite für RowDefinition (Höhe für ColumnDefinition) weggelassen wird, wird 1 * impliziert.
In diesem Beispiel ist Spalte 1 1,5-mal breiter als Spalte 2 -

<ColumnDefinition Width="1.5*" />
<ColumnDefinition />

Spalte 1: 1,5 *, Spalte 2 1 * (impliziert)

Sie können Auto-Fit- und feste Breiten mit * (proportionalen) Breiten mischen. In diesem Fall werden die * Spalten auf den Rest aufgeteilt, nachdem die automatische Anpassung und die festen Breiten berechnet wurden.

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="Auto" />  <!-- Auto-fit to content, 'Hi' -->
    <ColumnDefinition Width="50.5" />  <!-- Fixed width: 50.5 device units) -->
    <ColumnDefinition Width="69*" />   <!-- Take 69% of remainder -->
    <ColumnDefinition Width="31*"/>    <!-- Take 31% of remainder -->
</Grid.ColumnDefinitions>
<TextBlock Text="Hi" Grid.Column="0" />

Geben Sie hier die Bildbeschreibung ein


30

Wenn Sie 2 Spalten wie diese haben:

<ColumnDefinition Width="10*"/>
<ColumnDefinition Width="*"/>

Dies bedeutet, dass die erste Spalte 10x breiter als die zweite ist. Es ist wie "10 Teile Spalte 1 und 1 Teil Spalte 2" zu sagen.

Das Coole daran ist, dass die Größe Ihrer Spalten proportional geändert wird. Andere Optionen sind:

//Take up as much space as the contents of the column need
<ColumnDefinition Width="Auto"/>
//Fixed width: 100 pixels
<ColumnDefinition Width="100"/>

Hoffentlich hilft das!


8

wir nehmen folgendes Beispiel .....

ein Raster und hat 3 Spalten und jede enthält eine Schaltfläche der Größe 100.

Geben Sie hier die Bildbeschreibung ein

XAML-Code ist ...

    <Grid x:Name="LayoutRoot" Width="600">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="3*" />
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" Name="button1" VerticalAlignment="Top" Width="100" />
    <Button Content="Button1" Height="23" HorizontalAlignment="Left" Margin="0,10,0,0" Name="button2" VerticalAlignment="Top" Width="100" Grid.Column="1" />
    <Button Content="Button2" Height="23" HorizontalAlignment="Left" Margin="0,10,0,0" Name="button3" VerticalAlignment="Top" Width="100" Grid.Column="2" />
</Grid>

Aber eigentlich ist seine Größe ....

<Grid.ColumnDefinitions>
        <ColumnDefinition Width="375" />
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="125" />
</Grid.ColumnDefinitions>

Fazit:

Die Gesamtgröße des Gitters beträgt 600

"Auto": Die Spalte wird mit ihren Enthalten in der Größe geändert. (2. Spalte hat Knopf der Breite 100)

"*": Die Breite der 1. Spalte beträgt 3x der 3. Spalte.


3

Außerdem können Sie das "*" weglassen, wenn dies das Element der Einheitsgröße ist. Mit Pwninsteins Codebeispiel wäre es also nur:

<ColumnDefinition Width="10*/>
<ColumnDefinition/>
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.