Question

我为WPF中的复选框创建了样式，并以编程方式创建了这些复选框的数组。样式如下

<Style x:Key="deviceZoom" TargetType="{x:Type CheckBox}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type CheckBox}">
                <DockPanel x:Name="dockPanel">
                    <Canvas Width="24.15" Height="23">
                        <Image Source="/Resources/Icons/deviceUnselectedDiscrete.png" x:Name="DeviceImage" Width="12" Height="19" Canvas.Top="4"/>
                        <Border x:Name="borderDevice"
                                        CornerRadius="5"
                                        Width="20"
                                        Height="10"
                                        Background="#222528"
                                        BorderThickness="0"
                                        Canvas.Top="1"
                                        Canvas.Left="4.15">
                            <TextBlock x:Name="numBoards"  HorizontalAlignment="Center" VerticalAlignment="Center" Padding=".1" FontSize="8" Foreground="White" Text="99"/>                                     
                        </Border>
                    </Canvas>
                </DockPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>    
</Style>

然后我像这样创建一些复选框，并将其添加到根画布

    Style style = canvas.FindResource("deviceZoom") as Style;

    var deviceCheckbox = new CheckBox();
    canvas.Children.Add(deviceCheckbox);
    deviceCheckbox.Style = style;
    //Here I would like to set the label text

现在，我想在每次有新数据时都将值后面的代码设置为标签numBoards，但是我不知道该怎么做。我尝试使用动态属性，但由于复选框是通过编程方式创建的，因此无法对其进行很好的设置，并尝试进行绑定但未成功

Answer 1

首先，添加UserControl。并添加新属性。它绑定numBoards。 XAML是..

<UserControl x:Class="yourproject.myCheckBox"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
            xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
            xmlns:local="clr-namespace:yourproject"
            mc:Ignorable="d" x:Name="rootCtrl"
            d:DesignHeight="450" d:DesignWidth="800">
    <Canvas>
        <CheckBox DataContext="{Binding ElementName=rootCtrl}" >
            <CheckBox.Template>
                <ControlTemplate TargetType="{x:Type CheckBox}">
                    <DockPanel x:Name="dockPanel">
                        <Canvas Width="24.15" Height="23">
                            <Image Source="/Resources/Icons/deviceUnselectedDiscrete.png" x:Name="DeviceImage" Width="12" Height="19" Canvas.Top="4"/>
                            <Border x:Name="borderDevice"
                                        CornerRadius="5"
                                        Width="20"
                                        Height="10"
                                        Background="#222528"
                                        BorderThickness="0"
                                        Canvas.Top="1"
                                        Canvas.Left="4.15">
                                <TextBlock x:Name="numBoards"  HorizontalAlignment="Center" VerticalAlignment="Center" Padding=".1" FontSize="8" Foreground="White" Text="{Binding NumBoards}"/>
                            </Border>
                        </Canvas>
                    </DockPanel>
                </ControlTemplate>
            </CheckBox.Template>
        </CheckBox>
    </Canvas>
</UserControl>

代码是..

public partial class myCheckBox : UserControl, INotifyPropertyChanged
{
    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged(string propertyName)
    {
        this.OnPropertyChanged(new PropertyChangedEventArgs(propertyName));
    }

    protected virtual void OnPropertyChanged(PropertyChangedEventArgs e)
    {
        var handler = this.PropertyChanged;
        if (handler != null)
        {
            handler(this, e);
        }
    }

    private string _NumBoards = "77";
    public string NumBoards
    {
        get
        {
            return _NumBoards;
        }
        set
        {
            _NumBoards = value;
            OnPropertyChanged("NumBoards");
        }
    }
    public myCheckBox()
    {
        InitializeComponent();
    }
}

并使用myCheckBox控件

var deviceCheckbox = new myCheckBox();
deviceCheckbox.NumBoards = "20";
canvas.Children.Add(deviceCheckbox);

Answer 2

CheckBox具有Content属性。通过TemplateBinding将模板中的TextBlock.Text绑定到所有者内容。

<Style x:Key="deviceZoom" TargetType="{x:Type CheckBox}">
    <Setter Property="Template" >
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type CheckBox}">
                <DockPanel x:Name="dockPanel">
                    <Canvas Width="24.15" Height="23">
                        <Image Source="/Resources/Icons/deviceUnselectedDiscrete.png" x:Name="DeviceImage" Width="12" Height="19" Canvas.Top="4"/>
                        <Border x:Name="borderDevice"
                                        CornerRadius="5"
                                        Width="20"
                                        Height="10"
                                        Background="#222528"
                                        BorderThickness="0"
                                        Canvas.Top="1"
                                        Canvas.Left="4.15">
                            <TextBlock x:Name="numBoards"
                                       HorizontalAlignment="Center" VerticalAlignment="Center" 
                                       Padding=".1" FontSize="8" Foreground="White"
                                       Text="{TemplateBinding Content}"/>                                     
                        </Border>
                    </Canvas>
                </DockPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>    
</Style>

然后您可以分配内容，它将显示在TextBlock中：

deviceCheckbox.Content = "I am deviceCheckbox";

以编程方式设置复选框样式模板标签WPF

2 个答案: