ListView 1x1

Bisher hat man bei einfachen Auswahllisten meist eine Listbox verwendet. Mit Windows 8 kommt nun ein sehr ähnlich klingendes Steuerelement hinzu: Listview.

Listbox

image

Listview

image

Ohne das ich dazu Details in der Dokumentation von WinRT finde konnte, gehe ich davon aus, das Listbox das ältere einfachere Control ist. Listview sieht optisch ansprechender aus, unterstützt Gruppierung und Drag&Drop und reagiert moderner auf Touch. Überraschend zeigt der Task Manager weniger Speicherverbrauch bei Listview an.

Dummy Daten

Für die weiteren Tests wird eine Liste von Personen angelegt.

Public Class person
    Private _name As String
    Public Property name() As String
        Get
            Return _name
        End Get
        Set(ByVal value As String)
            _name = value
        End Set
    End Property
    Private _alter As Integer
    Public Property alter() As Integer
        Get
            Return _alter
        End Get
        Set(ByVal value As Integer)
            _alter = value
        End Set
    End Property


End Class

Public Class personen
    Inherits List(Of person)
    Public Sub New()

        Add(New person With {.name = "Hannes", .alter = 27})
        Add(New person With {.name = "Monique", .alter = 34})
        Add(New person With {.name = "Franz", .alter = 62})
        Add(New person With {.name = "kevin", .alter = 12})
        Add(New person With {.name = "Albert", .alter = 43})
        Add(New person With {.name = "Scott", .alter = 38})
        Add(New person With {.name = "Michael", .alter = 89})
        Add(New person With {.name = "Sabine", .alter = 22})
        Add(New person With {.name = "Fiona", .alter = 14})
        Add(New person With {.name = "Zora", .alter = 50})
        Add(New person With {.name = "Vanessa", .alter = 23})


    End Sub

End Class

Im XAML Code ist ein  Button zum löschen von Einträgen deklariert. Die Zuweisung der Liste erfolgt über das Attribut Itemssource. Da das Listview Control nicht weis, was es genau anzeigen soll, muss man entweder ins Datatemplate gehen oder das Attribut DisplayMemberpath setzen, ganz wie in Silverlight.

<ListView   Width="200" HorizontalAlignment="Left"
                 AllowDrop="True" SelectionMode="Single" 
                  DisplayMemberPath="name" Height="350" Margin="39,10,46,-60"  Name="listbox1"/>
<Button Content="Button" HorizontalAlignment="Right" Width="75" Click="Button_Click_1"/>

Um nun die Bindung zwischen Control und Objekt auch in beide Richtungen aktiv werden zu lassen, reicht es nicht mit der generischen Liste zu arbeiten. Wir brauchen ein Notification System->ObservableCollection. Anders wie in .NET ist das kein echter Datentyp in WinRT sondern wird gewrapped auf IObservableVector. Weswegen auch nur in VB und C# der aus Silverlight bekannte Weg zur Verfügung steht. Sie können aus den NET Sprachen auch direkt mit dem WinRT Typen arbeiten. Meist wird man das nicht tun um vorhandenen Code nutzen zu können.

Also folgender Code macht die gebundene Liste Observable

   Dim p As New ObservableCollection(Of person)(New personen)
    Private Sub UserControl2_Loaded(sender As Object, e As RoutedEventArgs) Handles Me.Loaded
        listbox1.ItemsSource = p
    End Sub

    Private Sub Button_Click_1(sender As Object, e As RoutedEventArgs)
        p.RemoveAt(listbox1.SelectedIndex)
    End Sub
Jedes Mal wenn Benutzer auf Button clickt, verschwindet das ausgewählte Element mit einer Animation aus der Liste.

Pingbacks and trackbacks (1)+

Kommentar schreiben