Cosa fa la stella WPF (Larghezza = "100 *")


Risposte:


234

In una griglia WPF, Width="*"o Height="*"indica il dimensionamento proporzionale.
Ad esempio: per dare il 30% alla colonna 1 e il 70% alla colonna 2 -

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

inserisci qui la descrizione dell'immagine

E allo stesso modo per le righe -

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

I numeri non devono essere numeri interi.
Se la larghezza per RowDefinition (altezza per ColumnDefinition) viene omessa, 1 * è implicito.
In questo esempio, la colonna 1 è 1,5 volte più larga della colonna 2 -

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

Colonna 1: 1.5 *, Colonna 2 1 * (implicita)

È possibile combinare larghezze fisse e adattamento automatico con larghezze * (proporzionali); in tal caso le colonne * vengono ripartite al resto dopo aver calcolato l'adattamento automatico e le larghezze fisse -

<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" />

inserisci qui la descrizione dell'immagine


30

Se hai 2 colonne come questa:

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

significa che la prima colonna è 10 volte più larga della seconda. È come dire "10 parti colonna 1 e 1 parte colonna 2."

La cosa interessante di questo è che le tue colonne verranno ridimensionate proporzionalmente. Altre opzioni sono:

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

Spero che aiuti!


8

prendiamo il seguente esempio .....

una griglia e ha 3 colonne e ciascuna contiene un pulsante di dimensione 100.

inserisci qui la descrizione dell'immagine

Il codice XAML è ...

    <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>

Ma in realtà la sua dimensione è ...

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

Conclusione:

La dimensione totale della griglia è 600

"Auto": la colonna viene ridimensionata con il contenuto. (La seconda colonna ha un pulsante di larghezza 100)

"*": La larghezza della prima colonna è 3 volte la terza colonna.


3

Inoltre, puoi tralasciare "*" se questo è l'elemento della dimensione dell'unità. Quindi usando l'esempio di codice di Pwninstein, sarebbe semplicemente:

<ColumnDefinition Width="10*/>
<ColumnDefinition/>
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.