2012-08-17 9 views
8

W mojej aplikacji w stylu Metro dla Windows 8, wiążę Listview do ObservableCollection i chciałbym, aby kolor tła każdego ListViewItem był naprzemienny (biały, szary, biały, etc)Aplikacja Metro - ListView - jak zmienić kolor tła ListViewItems

<ListView x:Name="stopsListView" ItemsSource="{Binding}" > 
     <ListView.ItemTemplate> 
      <DataTemplate> 
       <Grid Height="66" > 
        <TextBlock Text="{Binding Title}" /> 
       </Grid> 
      </DataTemplate> 
     </ListView.ItemTemplate> 

w WPF, to odbywa się za pomocą stylu z wyzwalaczy - patrz this page.

Jak to osiągnąć w aplikacji Metro?

Aktualizacja:

Po poprawna odpowiedź została podana poniżej, poszedłem dalej i rzeczywiście zakodowane go. Oto niektóre kodu dla każdego, kto go potrzebuje:

kod dla klasy konwertera wartość:

public class AltBackgroundConverter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, string language) 
    { 
     if (!(value is int)) return null; 
     int index = (int)value; 

     if (index % 2 == 0) 
      return Colors.White; 
     else 
      return Colors.LightGray; 
    } 

    // No need to implement converting back on a one-way binding 
    public object ConvertBack(object value, Type targetType, object parameter, string language) 
    { 
     throw new NotImplementedException(); 
    } 
} 

kodują XAML ListView:

<ListView x:Name="stopsListView" ItemsSource="{Binding}"> 

     <ListView.ItemTemplate> 
      <DataTemplate> 
       <Grid Width="250" Height="66" Margin="5"> 
        <Grid.Background> 
         <SolidColorBrush Color="{Binding IndexWithinParentCollection, Mode=OneWay, Converter={StaticResource AltBGConverter}}" /> 
        </Grid.Background> 

... i podczas dodawania elementów do kolekcji lub modyfikując kolekcję, pamiętaj o ustawieniu indeksu w kolekcji:

myCollection.add(item); 
item.IndexWithinParentCollection = myCollection.Count; 

Oczywiście, jeśli twoja kolekcja często się zmienia, takie podejście będzie kosztowne w utrzymaniu, ponieważ będziesz musiał ponownie zindeksować swoje produkty, dzięki czemu łatwiej było przechowywać odniesienie do kolekcji nadrzędnej w ramach każdej pozycji, następnie obliczyć Indeks w locie za pomocą .IndexOf(), aby uniknąć konieczności ciągłego aktualizowania wartości indeksu za każdym razem, gdy zmienia się kolekcja.

Odpowiedz

5

Możesz użyć konwertera - pobierz indeks wiersza z elementu i przekonwertuj go na pędzel. Ponadto - jeśli ItemTemplate nie daje wystarczającej kontroli - użyj ItemContainerStyle, aby zmodyfikować pędzel na poziomie szablonu ListViewItem.

Inną opcją może być określenie ItemTemplateSelector, który daje inny szablon z innym pędzlem w zależności od przedmiotu Wciąż trzeba jednak wygenerować indeksy wierszy lub w jakiś sposób włączyć selektor, aby określić, czy pozycja jest na parzystym, czy nieparzystym miejscu.

+0

zastanawiałem się o tym sam, ale w jaki sposób przekazać indeks wiersza do konwertera? Czy istnieje jakaś składnia XAML, aby to zrobić, czy musiałbym jawnie powiedzieć każdemu obiektowi, jaki jest jego indeks w kolekcji? –

+0

Musisz dodać właściwość do obiektu, tak. Następnie zrób coś w stylu Background = "{Binding ItemIndex, Converter = {StaticResource ItemIndexToBackgroundConverter}}" –

+0

To jest poprawna odpowiedź, dziękuję. Szkoda, że ​​nie ma składni XAML do przekazania indeksu przedmiotów do konwertera. Być może mógłbym ustawić elementy, aby odwoływały się do ich własnej kolekcji rodziców i po prostu użyć .indexOf - to podejście wydaje się, jakby prawdopodobnie łamało wszystkie rodzaje reguł. –

1

Nigdy nie starał się zrobić stylizację tak ale co jeśli:

zwiążesz kolor tła do niektórych nieruchomości i że własność zostanie ustalona poprzez IValueConverter być może według wskaźnika bieżącej pozycji w ListView.

Jeśli mam jakiś sens.

Edit:

Zabawne, gdy pisałem moją odpowiedź, Filip Skakun przyszedł z dokładnie tej samej idei.

+0

Byłem tu pierwszy. :) –

+0

No pisałem moje myśli, zbyt powoli coz stresu (co, jeśli się myliłem), to zauważyłem, że okienko z „ktoś już odpowiedział podczas gdy grasz slowpoke” :) – Oleg

+0

Najśmieszniejsze, że StackOverflow jest. :) –

0

wyszukiwać w Internecie i okazało się techniki, które obejmowały dodanie właściwość index do danego modelu, a następnie dodając do konwertera DataTemplate.Nie było to idealne, ponieważ zmieniło tylko zawartość elementu listy, więc w zależności od dopełnienia i wyrównania treści zobaczysz luki wokół tła wiersza. Nie podobał mi się również kodowy zapach modyfikujący moje obiekty modelu danych za pomocą kodu interfejsu użytkownika.

Spróbuj to pomoże, http://www.bendewey.com/index.php/523/alternating-row-color-in-windows-store-listview

Powiązane problemy