2014-09-01 10 views
5

So come funziona la funzione columndefinition in XAML ma c'è qualcosa che voglio fare e non so come.XAML Columndefinitions width * non occupa spazio disponibile

voglio 4 colonne del genere:

<Grid.ColumnDefinitions> 
    <ColumnDefinition Width="110" /> 
    <ColumnDefinition Width="*" /> 
    <ColumnDefinition Width="80" /> 
    <ColumnDefinition Width="80" /> 
</Grid.ColumnDefinitions> 
  1. colonna ha fissato la larghezza delle colonne
  2. deve prendere tutto lo spazio disponibile (sì, è tra le colonne e questo è esattamente il problema)
  3. colonna ha larghezza fissa
  4. colonna ha larghezza fissa

La seconda colonna contiene del testo e il problema è che quando quel testo è troppo corto, la seconda colonna non occupa tutto lo spazio disponibile. diventa più piccolo automaticamente e questo per ogni riga. Posso farlo funzionare con questo codice nel blocco di testo:

MinWidth="2000" 

Ma non è la strada buona dal momento che questo numero potrebbe essere troppo basso quando lo schermo è grande.

Qui tutta la listview contenente le 4 colonne:

<ListView Grid.Row="1" Grid.ColumnSpan="4" ItemsSource="{Binding blabla}" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch"> 
    <ListView.ItemTemplate> 
     <DataTemplate> 
      <Grid> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="110" /> 
        <ColumnDefinition Width="*" /> 
        <ColumnDefinition Width="80" /> 
        <ColumnDefinition Width="80" /> 
       </Grid.ColumnDefinitions> 
       <Image Height="110" Width="110" Grid.Column="0" Source="{Binding blabla}" HorizontalAlignment="Stretch" /> 
       <TextBlock Text="{Binding blabla}" TextWrapping="Wrap" Margin="5,0,0,0" Grid.Column="1" FontSize="16" HorizontalAlignment="Stretch" TextAlignment="Left" FlowDirection="LeftToRight" MinWidth="2000" VerticalAlignment="Center" ScrollViewer.HorizontalScrollBarVisibility="Disabled" FontStretch="UltraCondensed"/> 
       <TextBlock Grid.Column="2" TextWrapping="Wrap" Foreground="Black" Margin="5,0,0,0" HorizontalAlignment="Stretch" VerticalAlignment="Center"/> 
       <Image Source="{Binding blabla, Converter={StaticResource ImgConverter}}" Grid.Column="3" Width="76" Height="76" HorizontalAlignment="Center" Stretch="None" VerticalAlignment="Center" Margin="0"/> 
      </Grid> 
     </DataTemplate> 
    </ListView.ItemTemplate> 
</ListView> 
+0

Controllare effettivamente la larghezza del controllo genitore. Questo non verrà impostato su tutta la larghezza che ti aspettavi. – loop

+0

Cosa intendi? quale controllo genitore? – XHotSniperX

+0

scusa, non sono in grado di esprimerlo chiaramente. Ma puoi solo indagare su quanta area stai utilizzando Grid in Designer. – loop

risposta

8

Il layout è ben definito, ma mancava una piccola cosa che sta causando che il contenuto del ListViewItem è emarginati a sinistra perché è definito nel ListViewItemStyle predefinito che è denominato "ItemContainerStyle" per il controllo ListView.

Tutto quello che dovete fare è aggiungere questo ListViewItemStyle che ho modificato per allungare il contenuto orizzontalmente e verticalmente attraverso tutto lo spazio disponibile per l'elemento alle risorse

<Style x:Key="StretchedListViewItemStyle" 
      TargetType="ListViewItem"> 
     <Setter Property="HorizontalContentAlignment" 
       Value="Stretch" /> 
     <Setter Property="VerticalContentAlignment" 
       Value="Stretch" /> 
</Style> 

quindi impostarlo come l'ItemContainerStyle per ListView come segue:

<ListView Grid.Row="1" Grid.ColumnSpan="4" ItemsSource="{Binding blabla}" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" ItemContainerStyle="{StaticResource StretchedListViewItemStyle}"/> 
+0

Wow l'hai trovato! Non sapevo che listview fosse in stile in quel modo. Grazie mille! – XHotSniperX

+0

Prego :) –

Problemi correlati