WPF控件使用之两个RadioButton-绑定一个bool property

通常RadioButton用于在多个选项中选择一个，如果选项比较多，那么用ComboBox会比较适合，如果选项不是太多，那么用RadioButton比较好。

这里将两个radiobutton绑定到viewmodel里的一个bool属性中，绑定的模式是twoway的。效果是这样的：

其中高限制和低限制分别对应两个组的radiobutton，每一个组的两个radiobutton都绑定同一个bool变量，这里我发现如果只是单纯绑定而不设groupname，会默认将全部他们划分为一个组内，这样会很出现堆栈溢出的问题，因为四个radiobutton中任意触发其中一个，都会导致其他三个变化，而三个中有两个的关系是互斥的，这样导致了两个一直互相通知进入死循环。

另外，在“固定”和“可变”的check下，会动态改变右边需要设置的内容，这里我用了ContentControl 控件来动态选择需要呈现的内容。

前端代码如下：

 <UserControl.Resources>
        <convert:BoolValueConverter x:Key="BoolConvert"/>
               <DataTemplate x:Key="HighFixPanel">
            <StackPanel Orientation="Horizontal" HorizontalAlignment="Left" >
                <Label Content="固定值：" Height="28" Name="label25" />
                <TextBox Height="23"
                         Name="textBox20" 
                         HorizontalAlignment="Left" 
                         Width="108">
                </TextBox>
            </StackPanel>
        </DataTemplate>
        <DataTemplate  x:Key="HighVaraiblePanel">
            <StackPanel Orientation="Horizontal"  HorizontalAlignment="Left">
                <Label>OPC Item Name :</Label>
                <TextBox Width="150" Height="26"></TextBox>
                <Button Width="30" Height="26">B</Button>
                <Button Width="30" Height="26">T</Button>
            </StackPanel>
        </DataTemplate>
        <DataTemplate  x:Key="LowFixPanel" >
            <StackPanel Orientation="Horizontal" Width="200"  HorizontalAlignment="Left">
                <Label  Content="固定值：" Height="28" Name="label27" />
                <TextBox  Height="23" Name="textBox21" 
                         HorizontalAlignment="Left" 
                         Width="108" >
                </TextBox>
            </StackPanel>
        </DataTemplate>
        <DataTemplate  x:Key="LowVaraiblePanel">
            <StackPanel Orientation="Horizontal" Width="500"  HorizontalAlignment="Left">
                <Label>OPC Item Name :</Label>
                <TextBox Width="150" Height="26"></TextBox>
                <Button Width="30" Height="26">B</Button>
                <Button Width="30" Height="26">T</Button>
            </StackPanel>
        </DataTemplate>

    </UserControl.Resources>

 <Label Grid.Column="1" Content="固定" Height="28" Name="label20" HorizontalAlignment="Right" 
                       Margin="0,5" Width="38" />
                <Label Grid.Row="0" Grid.Column="2" Content="可变" Margin="12,5" Height="28" Name="label21" />
                <Label Grid.Row="1" Content="高限制" Height="28" Name="label24" HorizontalAlignment="Right"
                       Margin="0,1,0,0" VerticalAlignment="Top" />

                <RadioButton Grid.Row="1" Grid.Column="1" 
                             Height="16" Name="radHighFix" 
                             HorizontalAlignment="Center" 
                             IsChecked="{Binding Path=LoopSpan.HighLimitIsFix}"/>

                <RadioButton  Grid.Row="1" Grid.Column="2" Height="16"
                              Name="radioButton2" HorizontalAlignment="Center" 
                              IsChecked="{Binding Path=LoopSpan.HighLimitIsFix,Converter={StaticResource BoolConvert}}"/>

                <ContentControl Grid.Column="3" Grid.Row="1" Grid.ColumnSpan="3">
                    <ContentControl.Style>
                        <Style TargetType="ContentControl">
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding ElementName=radHighFix, Path=IsChecked}" Value="True">
                                    <Setter Property="ContentTemplate" Value="{StaticResource HighFixPanel}" />
                                </DataTrigger>
                                <DataTrigger Binding="{Binding ElementName=radHighFix, Path=IsChecked}" Value="False">
                                    <Setter Property="ContentTemplate" Value="{StaticResource HighVaraiblePanel}" />
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </ContentControl.Style>
                </ContentControl>

                <Label Grid.Row="2" Grid.Column="0" Content="低限制" 
                       Height="28" Name="label26" HorizontalAlignment="Right"/>

                <RadioButton Grid.Row="2" Grid.Column="1"
                             Height="16" Name="radLowFix" GroupName="2"
                             HorizontalAlignment="Center"  
                             IsChecked="{Binding Path=LoopSpan.LowLimitIsFix}"/>

                <RadioButton Grid.Row="2" Grid.Column="2" Height="16" GroupName="2"
                             Name="radioButton4" HorizontalAlignment="Center"
                            IsChecked="{Binding Path=LoopSpan.LowLimitIsFix,Converter={StaticResource BoolConvert}}"/>

                <ContentControl  Grid.Column="3" Grid.Row="2" Grid.ColumnSpan="3">
                    <ContentControl.Style>
                        <Style TargetType="ContentControl">
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding LoopSpan.LowLimitIsFix}" Value="True">
                                    <Setter Property="ContentTemplate" Value="{StaticResource LowFixPanel}" />
                                </DataTrigger>
                                <DataTrigger Binding="{Binding LoopSpan.LowLimitIsFix}" Value="False">
                                    <Setter Property="ContentTemplate" Value="{StaticResource LowVaraiblePanel}" />
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </ContentControl.Style>
                </ContentControl>

其中一个组里绑定的后端属性是：

 bool _HighLimitIsFix;

        public bool HighLimitIsFix
        {
            get { return _HighLimitIsFix; }
            set { _HighLimitIsFix = value; 
                OnPropertyChanged("HighLimitIsFix"); }
        }
        bool _lowLimitIsFix;

        public bool LowLimitIsFix
        {
            get { return _lowLimitIsFix; }
            set { _lowLimitIsFix = value; 
                OnPropertyChanged("LowLimitIsFix"); }
        }
        double? _HighLimitFixValue;

        public double? HighLimitFixValue
        {
            get { return _HighLimitFixValue; }
            set { _HighLimitFixValue = value; 
                OnPropertyChanged("HighLimitFixValue"); }
        }
        double? _lowLimitFixValue;

        public double? LowLimitFixValue
        {
            get { return _lowLimitFixValue; }
            set { _lowLimitFixValue = value; 
                OnPropertyChanged("LowLimitFixValue"); }
        }

        private string highLimitOpcItemName;

        public string HighLimitOpcItemName
        {
            get { return highLimitOpcItemName; }
            set
            {
                highLimitOpcItemName = value;
                OnPropertyChanged("HighLimitOpcItemName");
            }
        }

        private string lowLimitOpcItemName;

        public string LowLimitOpcItemName
        {
            get { return lowLimitOpcItemName; }
            set
            {
                lowLimitOpcItemName = value;
                OnPropertyChanged("LowLimitOpcItemName");
            }
        }

然后，两个radiobutton绑定一个bool值，在相反的那个需要一个转换器来转为相反的值

 public class BoolValueConverter : IValueConverter
    {
        //源转目标
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            if (value is bool)
            {
                return !(bool)value;
            }
            return value;
        }
        //目标转源
        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            if (value is bool)
            {
                return !(bool)value;
            }
            return value;
        }
    }