0

因此,环顾四周,我希望制作一个像单选按钮一样的 GroupBox。标题部分将充当项目符号。我从这个问题中获取了一些代码

样式化 GroupBox

这就是我想要的样子。但我想把它作为一个单选按钮。所以我输入了这段代码(请注意,我现在只做了一周或两周的 WPF)

    <Style TargetType="{x:Type RadioButton}" >
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RadioButton}">
                    <BulletDecorator>
                        <BulletDecorator.Bullet>
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto" />
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>
                                <Border x:Name="SelectedBorder"
                                        Grid.Row="0"
                                        Margin="4"
                                        BorderBrush="Black"
                                        BorderThickness="1"
                                        Background="#25A0DA">
                                    <Label x:Name="SelectedLabel" Foreground="Wheat">
                                        <ContentPresenter Margin="4" />
                                    </Label>
                                </Border>
                                <Border>

                                </Border>
                            </Grid>
                        </BulletDecorator.Bullet>
                    </BulletDecorator>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsChecked" Value="true">
                            <Setter TargetName="SelectedBorder" Property="Background" Value="PaleGreen"/>
                            <Setter TargetName="SelectedLabel"
                                    Property="Foreground"
                                    Value="Black" />
                        </Trigger>

                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

我有一种感觉,我可以在网格的第二行添加一个标签,但是我不知道如何访问它。我在 Window.Resources 部分的测试项目中有该模板(我计划将其移动到我的主项目中的资源字典)我的窗口的 xaml 是这个

<Grid>
    <GroupBox Name="grpDoor" Margin ="8"  Grid.Row="0" Grid.Column="0">
        <GroupBox.Header>
            WPF RadioButton Template
        </GroupBox.Header>
        <StackPanel Margin ="8">
            <RadioButton   FontSize="15" Content="Dhaka" Margin="4" IsChecked="False"/>
            <RadioButton   FontSize="15" Content="Munshiganj" Margin="4" IsChecked="True" />
            <RadioButton   FontSize="15" Content="Gazipur" Margin="4" IsChecked="False" />
        </StackPanel>
    </GroupBox>
</Grid>

然后我希望有这样的事情(虽然不知道我会怎么做)

<Grid>
    <GroupBox Name="grpDoor" Margin ="8"  Grid.Row="0" Grid.Column="0">
        <GroupBox.Header>
            WPF RadioButton Template
        </GroupBox.Header>
        <StackPanel Margin ="8">
            <RadioButton   FontSize="15"
                           Content="Dhaka"
                           Margin="4"
                           IsChecked="False">
                <RadioButton.Description>
                    This is a description that would show under my Header
                </RadioButton.Description>
            </RadioButton>
            <RadioButton   FontSize="15"
                           Content="Munshiganj"
                           Margin="4"
                           IsChecked="True">
                <RadioButton.Description>
                    This is a description that would show under my Header
                </RadioButton.Description>
            </RadioButton>
            <RadioButton   FontSize="15"
                           Content="Gazipur"
                           Margin="4"
                           IsChecked="False">
                <RadioButton.Description>
                    This is a description that would show under my Header
                </RadioButton.Description>
            </RadioButton>
        </StackPanel>
    </GroupBox>
</Grid>
4

2 回答 2

1

根据您的说明,这是一个非常简单的示例,其中 RadioButton 看起来像 GroupBox。

<Window x:Class="MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApplication1"
        Title="MainWindow" Height="350" Width="525">
    <Window.DataContext>
        <local:SimpleViewModel/>
    </Window.DataContext>
    <Window.Resources>
        <DataTemplate DataType="{x:Type local:SimpleOption}">
            <RadioButton GroupName="choice" IsChecked="{Binding Path=IsSelected, Mode=TwoWay}">
                <RadioButton.Template>
                    <ControlTemplate TargetType="{x:Type RadioButton}">
                        <GroupBox x:Name="OptionBox" Header="{Binding Path=DisplayName, Mode=OneWay}">
                            <TextBlock Text="{Binding Path=Description, Mode=OneWay}"/>
                        </GroupBox>
                        <ControlTemplate.Triggers>
                            <DataTrigger Binding="{Binding Path=IsSelected, Mode=OneWay}" Value="True">
                                <Setter TargetName="OptionBox" Property="Background" Value="Blue"/>
                            </DataTrigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </RadioButton.Template>
            </RadioButton>
        </DataTemplate>
    </Window.Resources>
    <Grid>
        <ListBox ItemsSource="{Binding Path=Options, Mode=OneWay}"/>
    </Grid>
</Window>

public class SimpleViewModel
{

    public SimpleViewModel()
    {
        Options = new ObservableCollection<SimpleOption>();
        var _with1 = Options;
        _with1.Add(new SimpleOption {
            DisplayName = "Dhaka",
            Description = "This is a description for Dhaka."
        });
        _with1.Add(new SimpleOption {
            DisplayName = "Munshiganj",
            Description = "This is a description for Munshiganj.",
            IsSelected = true
        });
        _with1.Add(new SimpleOption {
            DisplayName = "Gazipur",
            Description = "This is a description for Gazipur."
        });
    }

    public ObservableCollection<SimpleOption> Options { get; set; }

}

public class SimpleOption : INotifyPropertyChanged
{

    public string DisplayName {
        get { return _displayName; }
        set {
            _displayName = value;
            NotifyPropertyChanged("DisplayName");
        }
    }

    private string _displayName;
    public string Description {
        get { return _description; }
        set {
            _description = value;
            NotifyPropertyChanged("Description");
        }
    }

    private string _description;
    public bool IsSelected {
        get { return _isSelected; }
        set {
            _isSelected = value;
            NotifyPropertyChanged("IsSelected");
        }
    }

    private bool _isSelected;
    private void NotifyPropertyChanged(string propertyName)
    {
        if (PropertyChanged != null) {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }
    public event PropertyChangedEventHandler INotifyPropertyChanged.PropertyChanged;
    public delegate void PropertyChangedEventHandler(object sender, PropertyChangedEventArgs e);

}
于 2013-07-01T18:54:13.420 回答
1

我会用一个自定义的附加属性来做。这样,您可以从 绑定到它ViewModel,或直接在 XAML 中应用它。

首先,在您的程序集中创建一个新类Style

public static class RadioButtonExtender
{
    public static readonly DependencyProperty DescriptionProperty = DependencyProperty.RegisterAttached(
        "Description", 
        typeof(string),
        typeof(RadioButtonExtender), 
        new FrameworkPropertyMetadata(null));

    [AttachedPropertyBrowsableForType(typeof(RadioButton))]
    public static string GetDescription(RadioButton obj)
    {
        return (string)obj.GetValue(DescriptionProperty);
    }

    public static void SetDescription(RadioButton obj, string value)
    {
        obj.SetValue(DescriptionProperty, value);
    }
}

你的风格Bullet会改变,所以标签是:

<Label x:Name="SelectedLabel" 
       Foreground="Wheat"
       Content="{Binding (prop:RadioButtonExtender.Description), RelativeSource={RelativeSource TemplatedParent}} />

然后,您可以在最终的 XAML 中使用它:

<RadioButton FontSize="15"
             Content="Dhaka"
             Margin="4"
             IsChecked="False">
    <prop:RadioButtonExtender.Description>
        This is a description that would show under my Header
    </prop:RadioButtonExtender.Description>
</RadioButton>

另外,由于您是Style在单独的程序集中创建的,因此您可以创建自定义 XAML 命名空间以更轻松地使用您的属性。

于 2013-07-01T19:09:27.223 回答