DataTrigger on RadioButton IsChecked

12,768

Solution 1

Just making the text transparent is a bad idea, the user will still be able to edit it while it is transparent. Besides that the code is obfuscated and redundant. Do not create two styles for a TextBox, both containing the same setters; create a base-style and use BasedOn for sub-styles.

Not quite sure where your code goes wrong, i would suggest you clean it up, maybe there is some logical error, also here is a working example:

<Page
  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">
  <Page.Resources>
  
  </Page.Resources>
  <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
      <Grid>
      <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
      </Grid.RowDefinitions>
      <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="Auto"/>
      </Grid.ColumnDefinitions>
        <RadioButton Name="rbCycle" GroupName="g1" Content="Cycle"/>
        <RadioButton Name="rbFixed" GroupName="g1" Content="Fixed" Grid.Column="1"/>
        <TextBox Grid.Row="1" Text="cycle box">
            <TextBox.Style>
                <Style TargetType="{x:Type TextBox}">
                    <Setter Property="Visibility" Value="Hidden"/>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding IsChecked, ElementName=rbCycle}" Value="True">
                            <Setter Property="Visibility" Value="Visible"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </TextBox.Style>
        </TextBox>
        <TextBox Grid.Row="1" Grid.Column="1" Text="fixed box">
            <TextBox.Style>
                <Style TargetType="{x:Type TextBox}">
                    <Setter Property="Visibility" Value="Hidden"/>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding IsChecked, ElementName=rbFixed}" Value="True">
                            <Setter Property="Visibility" Value="Visible"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </TextBox.Style>
        </TextBox>
      </Grid>
  </ScrollViewer>
</Page>

Solution 2

If you're using binding to set the values of your radio buttons, don't use groups. If you're using groups, don't use binding. The two don't play well together.

That may not be the cause of what you're seeing. But I bet it is. And it's certainly interfering with your ability to diagnose the problem, because after you start clicking on buttons their binding doesn't work anymore.

Share:
12,768
KyleLib
Author by

KyleLib

Updated on June 04, 2022

Comments

  • KyleLib
    KyleLib almost 2 years

    I have a scenario where I need to hide some content based on whether a radio button is checked or unchecked. For some reason I can't get this to work the way I expect it to. The behavior is the opposite of what I expect. If I adjust my xaml to accomodate the actual behavior that I'm seeing it everything gets hidden.

    Essentially what I have is two radio buttons labeled Fixed and Cycle. When Fixed is checked I want the textbox associated with Fixed to have a visible foreground and the textbox associated with Cycle to have a transparent foreground and vice-versa. What I'm seeing is the exact opposite.

    Here's my trigger:

    <Grid.Resources>
      <Style TargetType="TextBox" x:Key="FixedModeStyle">
        <Setter Property="Foreground" Value="Transparent" />
        <Setter Property="Width" Value="40" />
        <Setter Property="Height" Value="20" />
        <Setter Property="Margin" Value="10" />
        <Style.Triggers>
          <DataTrigger Binding="{Binding IsChecked, 
                                 ElementName=rbtFixedMode}" Value="True" >
            <Setter Property="Foreground" 
                    Value="{DynamicResource My.Fonts.Global.LightForeground}" />
          </DataTrigger>
          </Style.Triggers>                  
      </Style>
      <Style TargetType="TextBox" x:Key="CycleModeStyle">
        <Setter Property="Foreground" Value="Transparent" />
        <Setter Property="Width" Value="40" />
        <Setter Property="Height" Value="20" />
        <Setter Property="Margin" Value="10" />
        <Style.Triggers>
          <DataTrigger Binding="{Binding IsChecked, 
                       ElementName=rbtCycleMode}" Value="True" >
            <Setter Property="Foreground" 
                    Value="{DynamicResource My.Fonts.Global.LightForeground}" />
          </DataTrigger>
        </Style.Triggers>
      </Style>
    </Grid.Resources>
    

    Here's my radio buttons and associated textboxes:

    <RadioButton x:Name="rbtFixedMode" Content="Fixed" 
                 GroupName="AveragingMode"
                 Foreground="{DynamicResource My.Fonts.Global.LightForeground}" 
                 IsChecked="{Binding AveragingWindowMode, 
                      Converter={StaticResource EnumToBooleanConverter}, 
                      ConverterParameter={x:Static  Processors:AveragingMode.Fixed}}" />
    <DockPanel Grid.Row="1" IsEnabled="{Binding IsChecked, ElementName=rbtFixedMode}">
      <TextBox x:Name="txtFixedIntervalLength" 
               Style="{StaticResource FixedModeStyle}" DockPanel.Dock="Left" 
               Text="{Binding AveragingWindowFixedLength}" />
    </DockPanel>
    
    <RadioButton x:Name="rbtCycleMode" Content="Cycle" 
                 GroupName="AveragingMode" Grid.Row="2"
                 Foreground="{DynamicResource My.Fonts.Global.LightForeground}"                           
                 IsChecked="{Binding AveragingWindowMode, 
                      Converter={StaticResource EnumToBooleanConverter}, 
                      ConverterParameter={x:Static Processors:AveragingMode.Cycles}}" />
    
    <DockPanel Grid.Row="3" IsEnabled="{Binding IsChecked, ElementName=rbtCycleMode}">
      <TextBox x:Name="txtCycleIntervalLength" 
               Style="{StaticResource CycleModeStyle}" DockPanel.Dock="Left"  
               Text="{Binding AveragingWindowCycleLength}"/>
      <TextBlock x:Name="txbCycles" Text="Cycles" Margin="4,10"
                 Foreground="{DynamicResource My.Fonts.Global.LightForeground}" />
    </DockPanel>
    

    Any ideas?

  • KyleLib
    KyleLib almost 13 years
    Thanks for the input. I agree with your statement regarding hiding text. FWIW, I am also disabling the dockpanel containing the textbox to preclude the user from getting focus on it. The requirements is to provide a settings feature where a user specifies how a stream of numeric samples should be averaged. Choices are a fixed time interval, or a number of cycles factored in hertz. There is additional content that goes along with the textboxes like units of time and such, which I left out for brevity, which are only meaninful in the context of the checkbox that is checked.