Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to get a group of toggle buttons to act like radio buttons in WPF?

Tags:

wpf

xaml

I have a group of buttons that should act like toggle buttons, but also as radio buttons where only one button can be selected / pressed down at a current time. It also need to have a state where none of the buttons are selected / pressed down.

The behavior will be kind of like Photoshop toolbar, where zero or one of the tools are selected at any time!

Any idea how this can be implemented in WPF?

like image 906
code-zoop Avatar asked Mar 02 '10 11:03

code-zoop


People also ask

What is button group in radio button?

A radio button group is a container control that holds radio buttons. The radio button group defines the layout for the buttons it contains, including a group title, text alignment for button labels, and whether or not to show a border. You can place a radio button group control within a section control.

What is difference between toggle button and radio button?

Toggle switches are best used for changing the state of system functionalities and preferences. Toggles may replace two radio buttons or a single checkbox to allow users to choose between two opposing states. Sometimes deciding which user interface element to use — radio buttons, checkboxes, or toggles — can be tough.

What is WPF RadioButton?

Advertisements. A Radio Button is a control that allows a user to select a single option from a group of options. The user is limited to select a single option from a related list of options which are mutually exclusive. It has only two options −


Video Answer


6 Answers

This is easiest way in my opinion.

<RadioButton Style="{StaticResource {x:Type ToggleButton}}" />

Enjoy! -- Pricksaw

like image 179
Uday Kiran Thummalapalli Avatar answered Nov 24 '22 00:11

Uday Kiran Thummalapalli


The easiest way is to style a ListBox to use ToggleButtons for its ItemTemplate

<Style TargetType="{x:Type ListBox}">
    <Setter Property="ListBox.ItemTemplate">
        <Setter.Value>
            <DataTemplate>
                <ToggleButton Content="{Binding}" 
                              IsChecked="{Binding IsSelected, Mode=TwoWay, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}}}"
                />
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>

Then you can use the SelectionMode property of the ListBox to handle SingleSelect vs MultiSelect.

like image 43
Bryan Anderson Avatar answered Nov 24 '22 00:11

Bryan Anderson


<RadioButton Content="Point" >
    <RadioButton.Template>
        <ControlTemplate>
            <ToggleButton IsChecked="{Binding IsChecked, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                          Content="{Binding Content, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"/>
        </ControlTemplate>
    </RadioButton.Template>
</RadioButton>

it works for me, enjoy!

like image 29
RoKK Avatar answered Nov 23 '22 23:11

RoKK


you could always use a generic event on the Click of the ToggleButton that sets all ToggleButton.IsChecked in a groupcontrol(Grid, WrapPanel, ...) to false with the help of the VisualTreeHelper; then re-check the sender. Or something in the likes of that.

private void ToggleButton_Click(object sender, RoutedEventArgs e)
    {
        int childAmount = VisualTreeHelper.GetChildrenCount((sender as ToggleButton).Parent);

        ToggleButton tb;
        for (int i = 0; i < childAmount; i++)
        {
            tb = null;
            tb = VisualTreeHelper.GetChild((sender as ToggleButton).Parent, i) as ToggleButton;

            if (tb != null)
                tb.IsChecked = false;
        }

        (sender as ToggleButton).IsChecked = true;
    }
like image 35
Sam Avatar answered Nov 24 '22 00:11

Sam


you can put grid with radiobuttons in it, and create button like template for raduiobuttons. than just programmaticaly remove check if you don't want buttons to be toggled

like image 37
Arsen Mkrtchyan Avatar answered Nov 24 '22 00:11

Arsen Mkrtchyan


You can also try System.Windows.Controls.Primitives.ToggleButton

 <ToggleButton Name="btnTest" VerticalAlignment="Top">Test</ToggleButton>

Then write code against the IsChecked property to mimick the radiobutton effect

 private void btnTest_Checked(object sender, RoutedEventArgs e)
 {
     btn2.IsChecked = false;
     btn3.IsChecked = false;
 }
like image 38
Jojo Sardez Avatar answered Nov 24 '22 00:11

Jojo Sardez