Zum Inhalt
Kuonen.UI

RadioButton

Optionsfelder wählen genau eine Möglichkeit aus einer Gruppe. Eine Gruppe sind die Felder mit demselben GroupName, ohne GroupName die Felder mit demselben Elternteil.

Vorführung: RadioButtonVorführung: RadioButton

KXAML

RadioButtonSeite.kxaml
<StackPanel xmlns="https://ui.kuonen.org/kxaml"
            xmlns:x="https://ui.kuonen.org/kxaml/x"
            x:Class="Kuonen.UI.Galerie.Seiten.RadioButtonVorfuehrung"
            Spacing="16">
  <StackPanel Orientation="Horizontal" Spacing="48">
    <!-- Gruppe 1: über den gemeinsamen Elternteil. IsChecked vor Checked: der Startzustand meldet nichts. -->
    <StackPanel Spacing="6">
      <TextBlock Text="Grösse" FontWeight="SemiBold" />
      <RadioButton Content="Klein" IsChecked="False" Checked="Groesse_Checked" />
      <RadioButton Content="Mittel" IsChecked="True" Checked="Groesse_Checked" />
      <RadioButton Content="Gross" IsChecked="False" Checked="Groesse_Checked" />
    </StackPanel>
    <!-- Gruppe 2: über GroupName, auch wenn die Felder verschiedene Elternteile hätten. -->
    <StackPanel Spacing="6">
      <TextBlock Text="Getränk" FontWeight="SemiBold" />
      <RadioButton Content="Kaffee" GroupName="Getraenk" IsChecked="False" Checked="Getraenk_Checked" />
      <RadioButton Content="Tee" GroupName="Getraenk" IsChecked="True" Checked="Getraenk_Checked" />
      <RadioButton Content="Kakao (aus)" GroupName="Getraenk" IsEnabled="False" />
    </StackPanel>
  </StackPanel>
  <TextBlock x:Name="Meldung" Text="Gewählt: Mittel, Tee." />
</StackPanel>
RadioButtonSeite.kxaml.cs
using Kuonen.UI;
using Kuonen.UI.Controls;
using Kuonen.UI.Ereignisse;

namespace Kuonen.UI.Galerie.Seiten;

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

/// <summary>KXAML-Fassung der RadioButton-Seite: der Baum steht in RadioButtonSeite.kxaml, hier nur das Verhalten.</summary>
public sealed partial class RadioButtonVorfuehrung
{
    private string _groesse = "Mittel", _getraenk = "Tee";

    public RadioButtonVorfuehrung() => InitializeComponent();

    private void Zeige() => Meldung.Text = $"Gewählt: {_groesse}, {_getraenk}.";

    private void Groesse_Checked(object sender, RoutedEventArgs e)
    {
        _groesse = (string)((RadioButton)sender).Content!;
        Zeige();
    }

    private void Getraenk_Checked(object sender, RoutedEventArgs e)
    {
        _getraenk = (string)((RadioButton)sender).Content!;
        Zeige();
    }
}

C#

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

namespace Kuonen.UI.Galerie.Seiten;

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

    public override string Beschreibung =>
        "Optionsfelder wählen genau eine Möglichkeit aus einer Gruppe. Eine Gruppe sind die Felder mit demselben "
        + "GroupName, ohne GroupName die Felder mit demselben Elternteil.";

    public override string Stichworte => "Optionsfeld Auswahl Gruppe GroupName einer aus mehreren";

    public override string Datei => nameof(RadioButtonSeite);

    public override UIElement Baue()
    {
        var meldung = new TextBlock { Text = "Gewählt: Mittel, Tee." };
        string groesse = "Mittel", getraenk = "Tee";
        void Zeige() => meldung.Text = $"Gewählt: {groesse}, {getraenk}.";

        // Gruppe 1: über den gemeinsamen Elternteil.
        var groessen = new StackPanel { Spacing = 6 };
        groessen.Children.Add(new TextBlock { Text = "Grösse", FontWeight = 600 });
        foreach (var name in new[] { "Klein", "Mittel", "Gross" })
        {
            var feld = new RadioButton { Content = name, IsChecked = name == groesse };
            feld.Checked += (_, _) =>
            {
                groesse = name;
                Zeige();
            };
            groessen.Children.Add(feld);
        }

        // Gruppe 2: über GroupName, auch wenn die Felder verschiedene Elternteile hätten.
        var getraenke = new StackPanel { Spacing = 6 };
        getraenke.Children.Add(new TextBlock { Text = "Getränk", FontWeight = 600 });
        foreach (var name in new[] { "Kaffee", "Tee" })
        {
            var feld = new RadioButton { Content = name, GroupName = "Getraenk", IsChecked = name == getraenk };
            feld.Checked += (_, _) =>
            {
                getraenk = name;
                Zeige();
            };
            getraenke.Children.Add(feld);
        }
        getraenke.Children.Add(new RadioButton { Content = "Kakao (aus)", GroupName = "Getraenk", IsEnabled = false });

        var gruppen = new StackPanel { Orientation = Orientation.Horizontal, Spacing = 48 };
        gruppen.Children.Add(groessen);
        gruppen.Children.Add(getraenke);

        var seite = new StackPanel { Spacing = 16 };
        seite.Children.Add(gruppen);
        seite.Children.Add(meldung);
        return seite;
    }
}