Zum Inhalt
Kuonen.UI

ProgressBar

Zeigt einen Fortschritt zwischen Minimum und Maximum. Ist die Dauer unbekannt, läuft mit IsIndeterminate ein Stück durch die Bahn – nur solange es sichtbar ist, am Bildtakt des Fensters.

Vorführung: ProgressBarVorführung: ProgressBar

KXAML

ProgressBarSeite.kxaml
<StackPanel xmlns="https://ui.kuonen.org/kxaml"
            xmlns:x="https://ui.kuonen.org/kxaml/x"
            x:Class="Kuonen.UI.Galerie.Seiten.ProgressBarVorfuehrung"
            Spacing="12">
  <TextBlock Text="Bestimmt" FontWeight="SemiBold" />
  <!-- Bestimmt: der Regler setzt den Wert. -->
  <ProgressBar x:Name="Balken" Value="30" Width="320" HorizontalAlignment="Left" />
  <Slider Maximum="100" Value="30" Width="320" HorizontalAlignment="Left" ValueChanged="Regler_ValueChanged" />
  <TextBlock Text="Unbestimmt" FontWeight="SemiBold" />
  <!-- Unbestimmt: erst auf Wunsch (eine laufende Anzeige braucht jedes Bild). -->
  <ProgressBar x:Name="Unbestimmt" Width="320" HorizontalAlignment="Left" />
  <ToggleSwitch OffContent="Unbestimmt aus" OnContent="Unbestimmt läuft" Checked="Schalter_Checked" Unchecked="Schalter_Unchecked" />
  <ProgressBar Value="60" IsEnabled="False" Width="320" HorizontalAlignment="Left" />
</StackPanel>
ProgressBarSeite.kxaml.cs
using Kuonen.UI;
using Kuonen.UI.Controls;
using Kuonen.UI.Ereignisse;

namespace Kuonen.UI.Galerie.Seiten;

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

/// <summary>KXAML-Fassung der ProgressBar-Seite: der Baum steht in ProgressBarSeite.kxaml, hier nur das Verhalten.</summary>
public sealed partial class ProgressBarVorfuehrung
{
    public ProgressBarVorfuehrung() => InitializeComponent();

    private void Regler_ValueChanged(object? sender, WertGeaendertArgs e) => Balken.Value = e.Neu;

    private void Schalter_Checked(object sender, RoutedEventArgs e) => Unbestimmt.IsIndeterminate = true;

    private void Schalter_Unchecked(object sender, RoutedEventArgs e) => Unbestimmt.IsIndeterminate = false;
}

C#

ProgressBarSeite.cs
using Kuonen.UI;
using Kuonen.UI.Controls;
using Kuonen.UI.Layout;

namespace Kuonen.UI.Galerie.Seiten;

/// <summary>Galerie-Seite: <see cref="ProgressBar"/>.</summary>
public sealed partial class ProgressBarSeite : GalerieSeite
{
    public override string Titel => "ProgressBar";

    public override string Beschreibung =>
        "Zeigt einen Fortschritt zwischen Minimum und Maximum. Ist die Dauer unbekannt, läuft mit IsIndeterminate ein "
        + "Stück durch die Bahn – nur solange es sichtbar ist, am Bildtakt des Fensters.";

    public override string Stichworte => "Fortschritt Fortschrittsanzeige Ladebalken unbestimmt IsIndeterminate Wert";

    public override string Datei => nameof(ProgressBarSeite);

    public override UIElement Baue()
    {
        // Bestimmt: der Regler setzt den Wert.
        var balken = new ProgressBar { Value = 30, Width = 320, HorizontalAlignment = HorizontalAlignment.Left };
        var regler = new Slider { Maximum = 100, Value = 30, Width = 320, HorizontalAlignment = HorizontalAlignment.Left };
        regler.ValueChanged += (_, e) => balken.Value = e.Neu;

        // Unbestimmt: erst auf Wunsch (eine laufende Anzeige braucht jedes Bild).
        var unbestimmt = new ProgressBar { Width = 320, HorizontalAlignment = HorizontalAlignment.Left };
        var schalter = new ToggleSwitch { OffContent = "Unbestimmt aus", OnContent = "Unbestimmt läuft" };
        schalter.Checked += (_, _) => unbestimmt.IsIndeterminate = true;
        schalter.Unchecked += (_, _) => unbestimmt.IsIndeterminate = false;

        var seite = new StackPanel { Spacing = 12 };
        seite.Children.Add(new TextBlock { Text = "Bestimmt", FontWeight = 600 });
        seite.Children.Add(balken);
        seite.Children.Add(regler);
        seite.Children.Add(new TextBlock { Text = "Unbestimmt", FontWeight = 600 });
        seite.Children.Add(unbestimmt);
        seite.Children.Add(schalter);
        seite.Children.Add(new ProgressBar { Value = 60, IsEnabled = false, Width = 320, HorizontalAlignment = HorizontalAlignment.Left });
        return seite;
    }
}