2012-07-21 18 views
15

voglio cambiare la spaziatura tra gli elementi in listView (? Forse dovrei usare un altro View-elemento) codice simile a questo:Windows8 ListView e lo spazio tra gli elementi

<ListView SelectionMode="None" HorizontalContentAlignment="Left" > 
     <ListView.Items> 
      <TextBlock Text="Item 1" /> 
      <TextBlock Text="Item 2" /> 
      <TextBlock Text="Item 3" /> 
      <TextBlock Text="Item 4" /> 
     </ListView.Items> 
     <ListView.ItemsPanel> 
      <ItemsPanelTemplate> 
       <WrapGrid Orientation="Horizontal" HorizontalChildrenAlignment="left"/> 
      </ItemsPanelTemplate> 
     </ListView.ItemsPanel> 
    </ListView> 

voglio imitare il più possibile normale stackpanel (che può contenere elementi). Attualmente gli spazi (spazio orizzontale) tra gli oggetti sono troppo grandi. La mia precedente domanda ->Windows 8 WrapPanel

Grazie in anticipo

risposta

25

È necessario apportare modifiche al modello predefinito. Se si desidera solo per apportare modifiche semplici come l'imbottitura e margini, allora si può fare questo: (testato il codice e dovrebbe funzionare)

  <ListView> 
     <ListView.ItemsPanel> 
       <ItemsPanelTemplate> 
        <WrapGrid Orientation="Horizontal" HorizontalChildrenAlignment="left"/> 
       </ItemsPanelTemplate> 
      </ListView.ItemsPanel> 
     <ListView.ItemContainerStyle> 
       <Style TargetType="ListViewItem"> 
        <Setter Property="Padding" Value="0"/> 
        <Setter Property="Margin" Value="0"/> 
       </Style> 
      </ListView.ItemContainerStyle> 
      <ListViewItem> 
       <TextBlock Foreground="Wheat">hej</TextBlock> 
      </ListViewItem> 
      <ListViewItem> 
       <TextBlock Foreground="Wheat">hej</TextBlock> 
      </ListViewItem> 
     </ListView> 

Per un maggiore controllo eseguire una copia di tutta modello predefinito selezionando un ListViewItem nel designer e nel rightclicking. seleziona il modello di modifica, modifica la copia. Questo genererà il modello predefinito e potrai apportare le tue modifiche lì. Puoi fare lo stesso per listviewtaintainer. Puoi farlo anche usando Blend.

I've added a description and images here (how you can edit a default template)

Fammi sapere come va, e se avete altre domande! In bocca al lupo!

EDIT:

MemeDeveloper indicato di seguito che aveva ancora problemi e risolto modificando qualche altro proprietà- ha inviato un codice e risposta qui, assicuratevi di dare un'occhiata.

+0

Grazie per l'aiuto :) Un'altra domanda. Ero quasi sicuro che dovesse essere fatto a modo suo, ma non sono riuscito a trovare nessuno strumento in cui potessi modificare quegli stili. Come posso fare questo in Blend per esempio? –

+2

Ho pubblicato un post sul blog in cui ho incluso la descrizione e le immagini per come farlo in VS o mixare :) Spero che sia d'aiuto! Non esitate a fare altre domande, ecc. Link: http://www.irisclasson.com/2012/07/22/example-winrtmetro-app-how-to-edit-default-template-in-visual-studio- 2012-and-blend/ –

+0

Wow, fantastico! Grazie mille :) –

2

è necessario modificare la proprietà ListBox.ItemContainerTemplate. Blend o VS visual designer aiuta a estrarlo per la modifica.

+0

... sì e in particolare, all'interno di esso le proprietà ContentMargin e Padding di ListViewItemPresenter – MemeDeveloper

16

Per quanto ne so (windows8.1 negozio XAML app), dopo aver impostato questi due a zero

<ListView.ItemContainerStyle> 
       <Style TargetType="ListViewItem"> 
        <Setter Property="Padding" Value="0"/> 
        <Setter Property="Margin" Value="0"/> 

avevo ancora lacune frustrante che apparentemente non riusciva a liberarsi di.

Utilizzando margini negativi qui potrebbe farlo per voi, ma ... la sua hacky, difficile da lavorare, e non portano sempre a risultati attesi

Dopo aver tirato fuori i miei capelli ho trovato il problema è stata risolta con questi ragazzi cioè

ContentMargin = "0" riempimento = "0"

Nel ListViewItemPresenter come segue:

 <ListView.ItemContainerStyle> 
      <Style TargetType="ListViewItem"> 
       <Setter Property="Padding" Value="0" /> 
       <Setter Property="Margin" Value="0" /> 
       <Setter Property="BorderThickness" Value="0" /> 
       <Setter Property="VerticalContentAlignment" Value="Top" /> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate TargetType="ListViewItem"> 
          <ListViewItemPresenter ContentMargin="0" Padding="0" /> 
         </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
      </Style> 
     </ListView.ItemContainerStyle> 

Speranza che salva qualcun altro da fracassare la testa più volte sulla loro tastiera;)

+1

Hai salvato la mia giornata, amico :-) :-). Stavo cercando di trovarlo da molti giorni. –

+0

Ho passato ore su questo, e avrei trascorso giorni se non l'avessi trovato! –

+0

Avevo ancora bisogno di un ContentMargin negativo per ridurre ulteriormente i margini. –

1

Soluzione che mantiene costante la marginalità articoli GridView per Windows 8.1 App Store. Ispirato dalla soluzione ListView sopra.

<GridView.ItemContainerStyle> 
<Style TargetType="GridViewItem"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="GridViewItem"> 
       <GridViewItemPresenter ContentMargin="0" Padding="0"/> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
</GridView.ItemContainerStyle> 
7

Penso che la corretta ItemContainerStyle proprietà di modificare qui è MinHeight, senza margine o imbottitura.

Problemi correlati