MaterialDesignInXamlToolkit icon indicating copy to clipboard operation
MaterialDesignInXamlToolkit copied to clipboard

MaterialDesignToolToggleListBox with RadioButton behaviour

Open mgnslndh opened this issue 5 years ago • 1 comments

Background

I'm using the MaterialDesignToolToggleListBox for selecting one of up to three possible modes that can be available to the user. The current implementation of MaterialDesignToolToggleListBox will allow the user to unselect items in the list box which leaves us with no item selected.

Current Behaviour

CurrentBehaviour

Since i'm binding the SelectedValue of the ListBox I will get a binding/validation error since the SelectedItem will be null when the user unselect the item.

Expected Behaviour

ExpectedBehaviour

Solutions

I would like to set a property on ListBoxAssist or use a new style to get a RadioButton behaviour on MaterialDesignToolToggleListBox.

  1. Create a new style MaterialDesignToolRadioButtonListBox which uses RadioButton to achieve the desired result. (I have not tried this)
  2. Use an attached property to hook into the SelectionChanged event and prevent unselect. Possible name could be PreventUnselect

Pseudo code for option 2

private void SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if(sender is ListBox listBox)
    {
        if (ListBoxAssist.GetIsToggle(listBox) &&
            listBox.SelectionMode == SelectionMode.Single)
        {
            if (e.AddedItems.Count == 0 && e.RemovedItems.Count == 1)
            {
                listBox.SelectedItem = e.RemovedItems[0];
            }
        }
    }            
}

mgnslndh avatar May 17 '19 05:05 mgnslndh

MaterialDesignTabRadioButton should do the trick in that case

<StackPanel
  Orientation="Horizontal"
  Margin="4">
  <RadioButton
    Style="{StaticResource MaterialDesignTabRadioButton}"
    Margin="4"
    IsChecked="True"
    Content="ONE" />
  <RadioButton
    Style="{StaticResource MaterialDesignTabRadioButton}"
    Margin="4"
    IsChecked="False"
    Content="TWO" />
  <RadioButton
    Style="{StaticResource MaterialDesignTabRadioButton}"
    Margin="4"
    IsChecked="False"
    IsEnabled="False"
    Content="THREE" />
</StackPanel>

But yes if you want to use the same style as MaterialDesignToolToggleListBox, we should create a new style like MaterialDesignTabRadioButton

ElieTaillard avatar May 15 '22 16:05 ElieTaillard