locked
menuitem checkbox RRS feed

  • Question

  • Hi All.

    I have menuitem with some checkboxes list. I would like that checkboxes list work like radiobutton list. If user select one checkbox other will uncheck. If it is possible how it to do?

    Thanks.

    Tuesday, January 22, 2013 1:02 AM

Answers

  • A good option is to use an attached property to manage this.  For details, see this StackOverflow answer, which is based on Brad Cunningham's ToggleButton blog post.

    Reed Copsey, Jr. - http://reedcopsey.com
    If a post answers your question, please click "Mark As Answer" on that post and "Mark as Helpful".

    • Marked as answer by Sheldon _Xiao Monday, February 4, 2013 10:26 AM
    Tuesday, January 22, 2013 1:04 AM
  • Another simple way would be something like:

            <StackPanel x:Name="MyCheckBoxes">
                <CheckBox Content="Check box 1" Checked="OnChecked"/>
                <CheckBox Content="Check box 2" Checked="OnChecked"/>
                <CheckBox Content="Check box 3" Checked="OnChecked"/>
            </StackPanel>
    

     private void OnChecked(object sender, RoutedEventArgs e)
      {
       foreach (UIElement l_element in MyCheckBoxes.Children)
       {
        CheckBox l_checkBox = l_element as CheckBox;
    
        if (l_checkBox != null && l_checkBox != sender)
        {
         l_checkBox.IsChecked = false;
        }
       }
     

    Although, the direction that Reed is pointing you would probably be a better way.  Just giving you options.

    It would be greatly appreciated if you would mark any helpful entries as helpful and if the entry answers your question, please mark it with the Answer link.

    • Marked as answer by Sheldon _Xiao Monday, February 4, 2013 10:26 AM
    Tuesday, January 22, 2013 1:20 AM
  • Woops.  I fail at pasting. :)

    Here's the full page...

    <Window
    	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    	xmlns:Microsoft_Windows_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero"
    	x:Class="WpfApplication1.MainWindow"
    	x:Name="Window"
    	Title="MainWindow"
    	Width="640" Height="480">
    
    	<Window.Resources>
    		<SolidColorBrush x:Key="CheckBoxStroke" Color="#8E8F8F"/>
    		<Style x:Key="CheckRadioFocusVisual">
    			<Setter Property="Control.Template">
    				<Setter.Value>
    					<ControlTemplate>
    						<Rectangle Margin="14,0,0,0" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
    					</ControlTemplate>
    				</Setter.Value>
    			</Setter>
    		</Style>
    		<Style TargetType="{x:Type RadioButton}">
    			<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
    			<Setter Property="Background" Value="#F4F4F4"/>
    			<Setter Property="BorderBrush" Value="{StaticResource CheckBoxStroke}"/>
    			<Setter Property="BorderThickness" Value="1"/>
    			<Setter Property="Template">
    				<Setter.Value>
    					<ControlTemplate TargetType="{x:Type RadioButton}">
    						<BulletDecorator Background="Transparent">
    							<BulletDecorator.Bullet>
    								<Microsoft_Windows_Themes:BulletChrome BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" IsChecked="{TemplateBinding IsChecked}" IsRound="False" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}"/>
    							</BulletDecorator.Bullet>
    							<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
    						</BulletDecorator>
    						<ControlTemplate.Triggers>
    							<Trigger Property="HasContent" Value="true">
    								<Setter Property="FocusVisualStyle" Value="{StaticResource CheckRadioFocusVisual}"/>
    								<Setter Property="Padding" Value="4,0,0,0"/>
    							</Trigger>
    							<Trigger Property="IsEnabled" Value="false">
    								<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
    							</Trigger>
    						</ControlTemplate.Triggers>
    					</ControlTemplate>
    				</Setter.Value>
    			</Setter>
    		</Style>
    	</Window.Resources>
    
    	<StackPanel x:Name="LayoutRoot">
    		<RadioButton Content="RadioButton" HorizontalAlignment="Left" GroupName="MyGroup" Margin="5" IsChecked="True"/>
    		<RadioButton Content="RadioButton" HorizontalAlignment="Left" GroupName="MyGroup" Margin="5"/>
    		<RadioButton Content="RadioButton" HorizontalAlignment="Left" GroupName="MyGroup" Margin="5"/>
    	</StackPanel>
    </Window>

    ~Christine
    • Marked as answer by Sheldon _Xiao Monday, February 4, 2013 10:25 AM
    Tuesday, January 22, 2013 5:48 AM

All replies

  • A good option is to use an attached property to manage this.  For details, see this StackOverflow answer, which is based on Brad Cunningham's ToggleButton blog post.

    Reed Copsey, Jr. - http://reedcopsey.com
    If a post answers your question, please click "Mark As Answer" on that post and "Mark as Helpful".

    • Marked as answer by Sheldon _Xiao Monday, February 4, 2013 10:26 AM
    Tuesday, January 22, 2013 1:04 AM
  • Another simple way would be something like:

            <StackPanel x:Name="MyCheckBoxes">
                <CheckBox Content="Check box 1" Checked="OnChecked"/>
                <CheckBox Content="Check box 2" Checked="OnChecked"/>
                <CheckBox Content="Check box 3" Checked="OnChecked"/>
            </StackPanel>
    

     private void OnChecked(object sender, RoutedEventArgs e)
      {
       foreach (UIElement l_element in MyCheckBoxes.Children)
       {
        CheckBox l_checkBox = l_element as CheckBox;
    
        if (l_checkBox != null && l_checkBox != sender)
        {
         l_checkBox.IsChecked = false;
        }
       }
     

    Although, the direction that Reed is pointing you would probably be a better way.  Just giving you options.

    It would be greatly appreciated if you would mark any helpful entries as helpful and if the entry answers your question, please mark it with the Answer link.

    • Marked as answer by Sheldon _Xiao Monday, February 4, 2013 10:26 AM
    Tuesday, January 22, 2013 1:20 AM
  • Hello Eugzl.

    If you edit the template for a radioButton... the "BulletChrome" has a property ... "IsRound".

    <Microsoft_Windows_Themes:BulletChrome 
    	BorderBrush="{TemplateBinding BorderBrush}" 
    	Background="{TemplateBinding Background}" 
    	IsChecked="{TemplateBinding IsChecked}" 
    	IsRound="False" 
    	RenderMouseOver="{TemplateBinding IsMouseOver}" 
    	RenderPressed="{TemplateBinding IsPressed}"/>


    Set that to false and you have the grouping abilities of a RadioButton, but it looks just like a CheckBox.

    Here is a copy of the full style...

    <Style x:Key="RadioButtonStyle1" TargetType="{x:Type RadioButton}">
    	<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
    	<Setter Property="Background" Value="#F4F4F4"/>
    	<Setter Property="BorderBrush" Value="{StaticResource CheckBoxStroke}"/>
    	<Setter Property="BorderThickness" Value="1"/>
    	<Setter Property="Template">
    		<Setter.Value>
    			<ControlTemplate TargetType="{x:Type RadioButton}">
    				<BulletDecorator Background="Transparent">
    					<BulletDecorator.Bullet>
    						
    						<!--Set the "IsRound" property to False.-->
    						<Microsoft_Windows_Themes:BulletChrome BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" IsChecked="{TemplateBinding IsChecked}" IsRound="False" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}"/>
    						
    						
    					</BulletDecorator.Bullet>
    					<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
    				</BulletDecorator>
    				<ControlTemplate.Triggers>
    					<Trigger Property="HasContent" Value="true">
    						<Setter Property="FocusVisualStyle" Value="{StaticResource CheckRadioFocusVisual}"/>
    						<Setter Property="Padding" Value="4,0,0,0"/>
    					</Trigger>
    					<Trigger Property="IsEnabled" Value="false">
    						<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
    					</Trigger>
    				</ControlTemplate.Triggers>
    			</ControlTemplate>
    		</Setter.Value>
    	</Setter>
    </Style>

    Hope you get it worked out quickly and easily.

    ~Christine


    Tuesday, January 22, 2013 2:47 AM
  • Hi Christine. Thanks for replay.

    I copy and past your style but in line

    <Setter Property="BorderBrush" Value="{StaticResource CheckBoxStroke}"/>

    I have blue wave underline under StaticResource CheckBoxStroke with message:
    The resource "CheckBoxStroke" could not be resolved.

    I added according reference for project. My radiobutton list looks like:

    <MenuItem Header="RadioButtonMenuItem">
        <MenuItem >
            <MenuItem.Header>
                <StackPanel>
                    <RadioButton Content="Choice 1" />
                    <RadioButton Content="Choice 2" />
                    <RadioButton Content="Choice 3" />
                </StackPanel>
            </MenuItem.Header>
        </MenuItem>
    </MenuItem>

    But doesn't work. Where I'm wrong? What need to do to get result?

    Thanks.

    • Edited by zleug Tuesday, January 22, 2013 5:22 AM
    Tuesday, January 22, 2013 5:10 AM
  • Woops.  I fail at pasting. :)

    Here's the full page...

    <Window
    	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    	xmlns:Microsoft_Windows_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero"
    	x:Class="WpfApplication1.MainWindow"
    	x:Name="Window"
    	Title="MainWindow"
    	Width="640" Height="480">
    
    	<Window.Resources>
    		<SolidColorBrush x:Key="CheckBoxStroke" Color="#8E8F8F"/>
    		<Style x:Key="CheckRadioFocusVisual">
    			<Setter Property="Control.Template">
    				<Setter.Value>
    					<ControlTemplate>
    						<Rectangle Margin="14,0,0,0" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
    					</ControlTemplate>
    				</Setter.Value>
    			</Setter>
    		</Style>
    		<Style TargetType="{x:Type RadioButton}">
    			<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
    			<Setter Property="Background" Value="#F4F4F4"/>
    			<Setter Property="BorderBrush" Value="{StaticResource CheckBoxStroke}"/>
    			<Setter Property="BorderThickness" Value="1"/>
    			<Setter Property="Template">
    				<Setter.Value>
    					<ControlTemplate TargetType="{x:Type RadioButton}">
    						<BulletDecorator Background="Transparent">
    							<BulletDecorator.Bullet>
    								<Microsoft_Windows_Themes:BulletChrome BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" IsChecked="{TemplateBinding IsChecked}" IsRound="False" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}"/>
    							</BulletDecorator.Bullet>
    							<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
    						</BulletDecorator>
    						<ControlTemplate.Triggers>
    							<Trigger Property="HasContent" Value="true">
    								<Setter Property="FocusVisualStyle" Value="{StaticResource CheckRadioFocusVisual}"/>
    								<Setter Property="Padding" Value="4,0,0,0"/>
    							</Trigger>
    							<Trigger Property="IsEnabled" Value="false">
    								<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
    							</Trigger>
    						</ControlTemplate.Triggers>
    					</ControlTemplate>
    				</Setter.Value>
    			</Setter>
    		</Style>
    	</Window.Resources>
    
    	<StackPanel x:Name="LayoutRoot">
    		<RadioButton Content="RadioButton" HorizontalAlignment="Left" GroupName="MyGroup" Margin="5" IsChecked="True"/>
    		<RadioButton Content="RadioButton" HorizontalAlignment="Left" GroupName="MyGroup" Margin="5"/>
    		<RadioButton Content="RadioButton" HorizontalAlignment="Left" GroupName="MyGroup" Margin="5"/>
    	</StackPanel>
    </Window>

    ~Christine
    • Marked as answer by Sheldon _Xiao Monday, February 4, 2013 10:25 AM
    Tuesday, January 22, 2013 5:48 AM
  • Hi zleug,
     
    I am marking your issue as "Answered", if you have new findings about your issue, please let me know.


    Best regards,


    Sheldon _Xiao
    MSDN Community Support | Feedback to us
    Develop and promote your apps in Windows Store
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    Monday, February 4, 2013 10:26 AM