ListView

<StackPanel xmlns="https://ui.kuonen.org/kxaml"
            xmlns:x="https://ui.kuonen.org/kxaml/x"
            x:Class="Kuonen.UI.Galerie.Seiten.ListViewVorfuehrung"
            Spacing="12">
  <!-- Die Ansicht wählen: Details, Liste, Symbole oder Kacheln. -->
  <StackPanel Orientation="Horizontal" Spacing="12">
    <RadioButton Content="Details" GroupName="ListViewAnsicht" IsChecked="True" Checked="Ansicht_Checked" />
    <RadioButton Content="Liste" GroupName="ListViewAnsicht" IsChecked="False" Checked="Ansicht_Checked" />
    <RadioButton Content="Symbole" GroupName="ListViewAnsicht" IsChecked="False" Checked="Ansicht_Checked" />
    <RadioButton Content="Kacheln" GroupName="ListViewAnsicht" IsChecked="False" Checked="Ansicht_Checked" />
  </StackPanel>
  <CheckBox Content="Nach Typ gruppieren" Checked="Gruppen_Checked" Unchecked="Gruppen_Unchecked" />
  <!-- Einträge, Spalten und Gruppenschlüssel kommen aus dem Code-Behind (Rückrufe lassen sich in KXAML nicht schreiben). -->
  <ListView x:Name="Liste" Width="440" Height="240" />
</StackPanel>

using Kuonen.UI;
using Kuonen.UI.Controls;
using Kuonen.UI.Ereignisse;

namespace Kuonen.UI.Galerie.Seiten;

public sealed partial class ListViewSeite
{
    protected override Func<UIElement>? KxamlFabrik => () => new ListViewVorfuehrung();
}

/// <summary>KXAML-Fassung der ListView-Seite: der Baum steht in ListViewSeite.kxaml, hier Einträge, Spalten und das Verhalten.</summary>
public sealed partial class ListViewVorfuehrung
{
    private readonly GridView _details = new();

    public ListViewVorfuehrung()
    {
        InitializeComponent();
        var dateien = new ListViewSeite.Eintrag[300];
        string[] typen = ["Bild", "Text", "Tabelle"];
        for (int i = 0; i < dateien.Length; i++) dateien[i] = new ListViewSeite.Eintrag($"Datei {i + 1}", typen[i % 3], (i * 37 % 900) + 10);
        _details.Columns.Add(new GridViewColumn { Header = "Name", Width = 160, DisplayMemberBinding = d => ((ListViewSeite.Eintrag)d!).Name });
        _details.Columns.Add(new GridViewColumn { Header = "Typ", Width = 90, DisplayMemberBinding = d => ((ListViewSeite.Eintrag)d!).Typ });
        _details.Columns.Add(new GridViewColumn { Header = "Grösse (KB)", Width = 100, DisplayMemberBinding = d => ((ListViewSeite.Eintrag)d!).Groesse });
        Liste.ItemsSource = dateien;
        Liste.View = _details;
    }

    private void Ansicht_Checked(object sender, RoutedEventArgs e) => Liste.View = (string?)((RadioButton)sender).Content switch
    {
        "Liste" => null,
        "Symbole" => new IconView(),
        "Kacheln" => new TileView(),
        _ => _details,
    };

    private void Gruppen_Checked(object sender, RoutedEventArgs e) => Liste.GroupBy = d => ((ListViewSeite.Eintrag)d!).Typ;

    private void Gruppen_Unchecked(object sender, RoutedEventArgs e) => Liste.GroupBy = null;
}

using Kuonen.UI;
using Kuonen.UI.Controls;
using Kuonen.UI.Layout;

namespace Kuonen.UI.Galerie.Seiten;

/// <summary>Galerie-Seite: <see cref="ListView"/> mit Details, Liste, Symbolen, Kacheln und Gruppen.</summary>
public sealed partial class ListViewSeite : GalerieSeite
{
    public override string Titel => "ListView";

    public override string Beschreibung =>
        "Eine Liste mit Ansichten wie im Explorer: Details (GridView mit Spaltenköpfen), Liste, grosse Symbole und Kacheln, wahlweise "
        + "nach einem Schlüssel gruppiert (die Gruppen klappen auf und zu). Sie legt nur die sichtbaren Einträge an.";

    public override string Stichworte => "Liste Ansicht View GridView IconView TileView Details Symbole Kacheln Gruppen GroupBy Explorer";

    public override string Datei => nameof(ListViewSeite);

    /// <summary>Ein Eintrag der Vorführung.</summary>
    public sealed record Eintrag(string Name, string Typ, int Groesse)
    {
        public override string ToString() => Name;
    }

    public override UIElement Baue()
    {
        var dateien = new Eintrag[300];
        string[] typen = ["Bild", "Text", "Tabelle"];
        for (int i = 0; i < dateien.Length; i++) dateien[i] = new Eintrag($"Datei {i + 1}", typen[i % 3], (i * 37 % 900) + 10);
        var details = new GridView();
        details.Columns.Add(new GridViewColumn { Header = "Name", Width = 160, DisplayMemberBinding = d => ((Eintrag)d!).Name });
        details.Columns.Add(new GridViewColumn { Header = "Typ", Width = 90, DisplayMemberBinding = d => ((Eintrag)d!).Typ });
        details.Columns.Add(new GridViewColumn { Header = "Grösse (KB)", Width = 100, DisplayMemberBinding = d => ((Eintrag)d!).Groesse });
        var liste = new ListView { Width = 440, Height = 240, ItemsSource = dateien, View = details };

        var ansichten = new StackPanel { Orientation = Orientation.Horizontal, Spacing = 12 };
        foreach (var (name, ansicht) in new (string, ViewBase?)[] { ("Details", details), ("Liste", null), ("Symbole", new IconView()), ("Kacheln", new TileView()) })
        {
            var feld = new RadioButton { Content = name, GroupName = "ListViewAnsicht", IsChecked = name == "Details" };
            feld.Checked += (_, _) => liste.View = ansicht;
            ansichten.Children.Add(feld);
        }
        var gruppen = new CheckBox { Content = "Nach Typ gruppieren" };
        gruppen.Checked += (_, _) => liste.GroupBy = d => ((Eintrag)d!).Typ;
        gruppen.Unchecked += (_, _) => liste.GroupBy = null;

        var seite = new StackPanel { Spacing = 12 };
        seite.Children.Add(ansichten);
        seite.Children.Add(gruppen);
        seite.Children.Add(liste);
        return seite;
    }
}