Come rendere DockPanel riempire lo spazio disponibile

Sto provando il contenuto di un carrello acquisti in un ItemsControl(ListBox). Per fare ciò, ho creato il seguente DataTemplate:Come rendere DockPanel riempire lo spazio disponibile

<DataTemplate x:Key="Templates.ShoppingCartProduct" 
       DataType="{x:Type viewModel:ProductViewModel}"> 
    <DockPanel HorizontalAlignment="Stretch"> 
     <TextBlock DockPanel.Dock="Left" 
        Text="{Binding Path=Name}" 
        FontSize="10" 
        Foreground="Black" /> 
     <TextBlock DockPanel.Dock="Right" 
        Text="{Binding Path=Price, StringFormat=\{0:C\}}" 
        FontSize="10" 
        Foreground="Black" /> 
    </DockPanel> 
</DataTemplate>

Quando gli articoli sono visualizzati nel mio carrello della spesa invece, il nome e il prezzo TextBlocks sono seduti accanto l'un l'altro, e v'è una grande quantità di estremamente spazio bianco sul lato destro.

Stava chiedendo quale fosse il metodo migliore per forzare lo DockPanel ad allungare per riempire tutto lo spazio reso disponibile dallo ListItem?

fonte

2009-07-03 Richard McGuire

Bind la Width del DockPanel al ActualWidth del ListBoxItem:

<DockPanel Width="{Binding ActualWidth, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}}"> 
...

Un'altra opzione: si può solo ridefinire la ItemContainerStyle in modo che il ListBoxItem è allungata orizzontalmente:

<ListBox.ItemContainerStyle> 
    <Style TargetType="ListBoxItem"> 
     <Setter Property="HorizontalContentAlignment" Value="Stretch"/> 
    </Style> 
</ListBox.ItemContainerStyle>

fonte

2009-07-03 19:03:32

Ho provato ad utilizzare quello che lega e sembra essere la causa del ListBoxItem a crescere continuamente in termini di dimensioni, durante la visualizzazione con Snoop, ho visto la larghezza sia del ListBoxItem e DockPanel supera i 300.000. –

Provare a legare a ActualWidth del ListBox stesso, quindi ... –

Oh, ok, ho capito ... devi impostare LastChildFill = "False" sul DockPanel, altrimenti il secondo TextBlock è allungato –

DockPanel s sono cattivi La tentazione di utilizzare la combinazione StackPanel/DockPanel per layout complessi porta a "dead end del layout". Utilizzare una griglia:

<Grid> 
    <TextBlock HorizontalAlignment="Left" 
... 
    <TextBlock HorizontalAlignment="Right" 
... 
/Grid>

Io uso Grid s quasi esclusivamente, utilizzando una griglia separata per ogni blocco di elementi che "vanno di pari passo"

fonte

2009-07-03 20:48:07

Non penso che DockPanels sia malvagio, a volte possono essere piuttosto utili ... tuttavia devo ammettere che probabilmente non era l'opzione migliore in quel caso –

Naturalmente questo è soggettivo e non sono un male assoluto;) Ma guarda dove Rich sta già andando - usando ItemContainerStyle (roba semi-avanzato) per un compito semplice - un po 'indicativo ... –

Ho considerato una griglia all'inizio. Tuttavia, dato un ListBox ristretto, o un valore abbastanza lungo per le proprietà Name o Price, i due TextBlock finiranno per sovrapporsi ai loro valori. Inoltre, difficilmente classificherei due riquadri di testo alle estremità opposte di un pannello come "layout complesso". –

La cosa bella di pannelli dock è che già riempiono tutto lo spazio disponibile . LastChildFill è true per impostazione predefinita (ma l'ho impostato di seguito per chiarezza), quindi non impostare l'attributo DockPanel sull'ultimo figlio e riempirà lo spazio disponibile.

<DockPanel HorizontalAlignment="Stretch" LastChildFill="true"> 
    <TextBlock DockPanel.Dock="Left" 
       Text="{Binding Path=Name}" 
       FontSize="10" 
       Foreground="Black" /> 
    <TextBlock 
       Text="{Binding Path=Price, StringFormat=\{0:C\}}" 
       FontSize="10" 
       Foreground="Black" /> 
</DockPanel>

fonte

2014-02-24 23:32:18 NielW

Come rendere DockPanel riempire lo spazio disponibile

risposta

Problemi correlati