如何从自定义控件创建自定义按钮?

时间:2014-10-29 03:14:13

标签: wpf custom-controls

我正在测试一些有关自定义控件的代码。我在主题文件夹中定义了以下样式。LayerGrid.xamlbutton imagetextPanelButtonStyle中使用了此layergrid.cs样式。

<Style TargetType="{x:Type common:LayerGrid}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate>
                <DockPanel VerticalAlignment="Stretch" HorizontalAlignment="Stretch" LastChildFill="True"
                           Name="PART_ParentPanel">
                    <DockPanel.Resources>
                        <Style x:Key="PanelButtonStyle" TargetType="Button">
                            <Setter Property="OverridesDefaultStyle" Value="True"></Setter>
                            <Setter Property="Focusable" Value="False"></Setter>
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="{x:Type Button}">
                                        <Border x:Name="BorderPath" Margin="0"
                                            BorderThickness="0" Background="{StaticResource TabItemBackgroundBrushUnselected}"
                                            BorderBrush="{StaticResource TabItem_BorderBrush_Selected}">
                                            <StackPanel Orientation="Horizontal">
                                                <Image Source="/MCLF;component/Images/图像 3.png" Width="15" Height="15"
                                                    HorizontalAlignment="Center " VerticalAlignment="Center"></Image>
                                                <TextBlock TextTrimming="CharacterEllipsis"
                                                        Text ="{TemplateBinding Name}"></TextBlock>
                                            </StackPanel>
                                        </Border>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </DockPanel.Resources>
                    <StackPanel Name="PART_BottomCntl" Orientation="Horizontal" DockPanel.Dock="Bottom" Background="AliceBlue"></StackPanel>
                    <StackPanel Name="PART_LeftCntl" Orientation="Horizontal" DockPanel.Dock="Left" Background="AliceBlue">
                        <StackPanel.LayoutTransform>
                            <RotateTransform Angle="90"/>
                        </StackPanel.LayoutTransform>
                    </StackPanel>
                    <StackPanel Name="PART_RightCntl" Orientation="Horizontal" DockPanel.Dock="Right" Background="AliceBlue">
                        <StackPanel.LayoutTransform>
                            <RotateTransform Angle="90"/>
                        </StackPanel.LayoutTransform>
                    </StackPanel>
                    <Grid Name="PART_MasterGrid" IsSharedSizeScope="True" Background="AliceBlue"></Grid>
                </DockPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>


private Button AddToColumnStackPanel(Layer layer)
{
    var btn = new Button
    {
        //Background = Brushes.Transparent,
        //BorderBrush = Brushes.Transparent,
        //BorderThickness = new Thickness(0),
        //Height = 22,
        //MinWidth = 55.0,
        Padding = new Thickness(10, 0, 10, 0),
        //FontWeight = FontWeights.Bold,
        Style = (Style)PART_MasterGrid.FindResource("PanelButtonStyle"),
    };
    btn.Click += (o, e) =>...
}

DP Layer.NameMainWindow.xaml确定

<controls:Layer Level="1" Orientation="Column" Name="Symbols" ColumnLocation="Left">
<controls:Layer.Content>
    <Grid>
        <Grid.DataContext>
            <vm:MainViewModel/>
        </Grid.DataContext>
    </Grid>
</controls:Layer.Content>

现在问题是DP Name=Symbols没有正确绑定到按钮PanelButtonStyle 我阅读了类似的帖子,但该示例将整个目标类型设置为DP somecustomControl WPF Custom Control: TemplateBinding to Image

enter image description here

更新DP Name位于class Layer,用于定义每个图层的位置,方向,名称,内容等属性...... {{ 1}}用作支持自定义控件的类。 在class LayerGrid我们有:

LayerGrid.cs

public class LayerGrid : ContentControl { ... } public class Layer : UIElement { public enum LayerOrientation { Row, Column } public enum LayerColumnLocation { Left, Right } public static readonly DependencyProperty LevelProperty; public static readonly DependencyProperty ContentProperty; public static readonly DependencyProperty OrientationProperty; public static readonly DependencyProperty NameProperty; public static readonly DependencyProperty ColumnLocationProperty; public string Name { get { return (string)GetValue(NameProperty); } set { SetValue(NameProperty, value); } } static Layer() { NameProperty = DependencyProperty.Register( "Name", typeof(string), typeof(Layer)); ... } } 用于布置一般小组;通过调用上面的函数,每个按钮将被添加到相应的stackPanel,例如LayerGrid.xaml

PART_LeftCntl

<DockPanel> <StackPanel Name="PART_BottomCntl" Orientation="Horizontal" DockPanel.Dock="Bottom" Background="AliceBlue"></StackPanel> <StackPanel Name="PART_LeftCntl" Orientation="Horizontal" DockPanel.Dock="Left" Background="AliceBlue"> <StackPanel.LayoutTransform> <RotateTransform Angle="90"/> </StackPanel.LayoutTransform> </StackPanel> <StackPanel Name="PART_RightCntl" Orientation="Horizontal" DockPanel.Dock="Right" Background="AliceBlue"> <StackPanel.LayoutTransform> <RotateTransform Angle="90"/> </StackPanel.LayoutTransform> </StackPanel> <Grid Name="PART_MasterGrid" IsSharedSizeScope="True" Background="AliceBlue"></Grid> </DockPanel> 负责提供内容;

Update2 下面附有相同MainWindow.xaml的示例。仅按钮style已更改。https://www.dropbox.com/sh/os34tr8zl21uj4o/AAC_segoCWzAbJMFzCKHyZnpa?dl=0

style

1 个答案:

答案 0 :(得分:1)

我认为您正在寻找如何在代码中创建绑定。

所以这应该对你有用

Binding b = new Binding("Name");
b.Source = layer;
btn.SetBinding(Button.ContentProperty, b);

删除Content = layer.Name&amp;在btn.Click += (o, e) =>...

之前添加此代码

试一试,看看这是不是你想要的


修改

在查看您的实现后,我发现按钮直接添加到分层网格模板的部分(StackPanel)而不是图层(见下文)。所以相对来源可能没有帮助。

tree

但是,在这种情况下,您可以通过多种方式实现目标。作为一个简单的选项,您可以利用Button的Content属性。

首先将Text属性绑定到模板的Content属性

<TextBlock TextTrimming="CharacterEllipsis" FontSize="10"
           Text ="{TemplateBinding Content}"></TextBlock>

然后在代码中,如果Name不应该改变,你可以简单地使用Content = layer.Name

例如

var btn = new Button
{
    Padding = new Thickness(10, 0, 10, 0),
    Style = (Style)PART_MasterGrid.FindResource("PanelButtonStyle"),
    Content = layer.Name
};

或者,您可以将Name与Content属性绑定,以反映所需的更改。

例如

var btn = new Button
{
    Padding = new Thickness(10, 0, 10, 0),
    Style = (Style)PART_MasterGrid.FindResource("PanelButtonStyle")
};

Binding b = new Binding("Name");
b.Source = layer;
btn.SetBinding(Button.ContentProperty, b);

如果有帮助,请告诉我。