How to implement a XAML Radio Button control with an ObservableCollection source? - wpf

Question

I have the following ComboBox element in XAML:
<ComboBox ItemsSource="{Binding CollectionControlValues}"
SelectedItem="{Binding CollectionControlSelectedValue, UpdateSourceTrigger=PropertyChanged}">
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Value}" />
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
I would like to implement RadioButtons in the same way, like this:
PSEUDO-CODE:
<RadioButtons ItemsSource="{Binding CollectionControlValues}"
SelectedItem="{Binding CollectionControlSelectedValue, UpdateSourceTrigger=PropertyChanged}">
<RadioButtons .ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Value}" />
</DataTemplate>
</RadioButtons .ItemTemplate>
</RadioButtons >
However, the only WPF RadioButton implementations I can find are static like this.
<StackPanel x:Name="rbHolder1" Style="{StaticResource rbStackPanelStyle}">
<RadioButton Style="{StaticResource rbStyle}">RadioButton 1</RadioButton>
<RadioButton Style="{StaticResource rbStyle}">RadioButton 2</RadioButton>
<RadioButton Style="{StaticResource rbStyle}">RadioButton 3</RadioButton>
<RadioButton Style="{StaticResource rbStyle}">...</RadioButton>
</StackPanel>
How can I create a RadioButton control which is not static like the above but instead gets its data from its ItemsSource property as in the above ComboBox example?

Answer 1

Use ItemsControl and DataTemplate:
<ItemsControl ItemsSource="{Binding CollectionControlValues}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<RadioButton Content="{Binding Value}" IsChecked="{Binding SomeProperty}" GroupName="name"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>

Answer 2

code in window1.xaml file
<Window x="RadioButton.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
xmlns:local ="clr-namespace:RadioButton"
Title="Window1" Height="300" Width="300" Loaded="Window_Loaded">
<StackPanel>
<StackPanel.Resources>
<ObjectDataProvider x:Key="RadioOptions" MethodName="GetValues" ObjectType="{x:Type sys:Enum}">
<ObjectDataProvider.MethodParameters>
<x:Type TypeName="local:RadioOption" />
</ObjectDataProvider.MethodParameters>
</ObjectDataProvider>
<Style x:Key="RadioButtonList" TargetType="{x:Type ListBox}">
<Setter Property="BorderBrush" Value="{x:Null}" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="ItemContainerStyle">
<Setter.Value>
<Style TargetType="{x:Type ListBoxItem}" >
<Setter Property="Margin" Value="2" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<Border Background="Transparent">
<RadioButton Focusable="False"
IsHitTestVisible="False"
IsChecked="{TemplateBinding IsSelected}">
<ContentPresenter />
</RadioButton>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Setter.Value>
</Setter>
</Style>
</StackPanel.Resources>
<ListBox Margin="37,20,28,58" Name="listBox1" Style="{StaticResource RadioButtonList}" ItemsSource="{Binding Source={StaticResource RadioOptions}}" />
</StackPanel>
this line
<ListBox` Margin="37,20,28,58" Name="listBox1" Style="{StaticResource RadioButtonList}"
ItemsSource="{Binding Source={StaticResource RadioOptions}}"
is using itemsource property
C# code
namespace RadioButton
{
public enum RadioOption
{
option1,
option2,
option3,
option4
}
public partial class Window1 : Window
{
public Window1()
{
InitializeComponent();
}
}
}
i think this will help you out..