WPF菱形形状自定义控件

WPF菱形形状自定义控件,wpf,controls,custom-controls,shapes,Wpf,Controls,Custom Controls,Shapes,我有一个自定义控件,看起来像这样 <UserControl BorderBrush="#A9C2DE" HorizontalAlignment="Left" x:Class="Block" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Height="86" Width="151" To

我有一个自定义控件,看起来像这样

<UserControl BorderBrush="#A9C2DE" HorizontalAlignment="Left" x:Class="Block"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Height="86" Width="151"  ToolTip="{DynamicResource BasicTooltip}">
<UserControl.Resources>
    <ResourceDictionary Source="TextBoxStyles.xaml"/>
</UserControl.Resources>
<DockPanel LastChildFill="True" Style="{StaticResource PanelStyle}">
    <Label DockPanel.Dock="Top" Content="{Binding Path=_Code}" HorizontalAlignment="Stretch"  Name="label1" Height="25" VerticalAlignment="Top" Style="{StaticResource LabelStyle}" ></Label>
    <TextBox  Name="txtBox"  Style="{StaticResource DefaultStyle}" >
        <TextBox.Text>
            <Binding Path="_Name">

            </Binding>
        </TextBox.Text>
    </TextBox>

</DockPanel>
正如您所看到的,这个控件由一个DockPanel组成,我在其中放置了标签和文本框。在代码中,我在上面提到的标签和文本框操作中添加了一些事件。此控件的基本形状为矩形。然而今天我发现这个控件的形状最好是菱形或比普通矩形更复杂的形状。 是否可以给我的控件赋予不同的形状,保留我在代码文件中编写的所有事件的所有功能,并保持内容文本框和标签不变

我尝试了一下这个代码

 <Style TargetType="{x:Type UserControl}" x:Key="BlockStyle" >
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate>

                    <Ellipse  
                            x:Name="Border"  
                            Stroke="#FF393785"  
                            StrokeThickness="2" 
                            Fill="Transparent"
                            >

                    </Ellipse>
            </ControlTemplate>
            </Setter.Value>

        </Setter>
</Style>

但是,当我在控件中使用此样式时,所有元素textbox和label等都会被此样式覆盖。

使用Border insted并在模板TextBlock等中添加所需内容

<ControlTemplate TargetType="UserControl">                           
    <Border x:Name="border" BorderThickness="2" CornerRadius="15" BorderBrush="#FF211c19" RenderTransformOrigin="0.5,0.5">
             <!--I use binding to show content of control as a text in TextBlock-->
        <TextBlock TextWrapping="Wrap" Text="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="10,5"/>
    </Border>
</ControlTemplate>

这实际上比您想象的要简单,不需要控制模板:

将用户控件的Background属性设置为{x:Null},这将使背景对鼠标透明。鼠标事件将由用户控件下面的任何对象处理

创建定义控件形状的元素,为其提供非空背景透明即可

如果可以将控件内容放在元素中(例如,如果控件内容是边框),请执行此操作,否则请将形状和内容放在单个单元格网格中,并使用边距将内容移动到形状中

因此,椭圆的用户控件变为:

<UserControl HorizontalAlignment="Left" x:Class="Block"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Height="86" Width="151"  ToolTip="{DynamicResource BasicTooltip}"
    Background="{x:Null}">                          <-- set background to null
    <UserControl.Resources>
        <ResourceDictionary Source="TextBoxStyles.xaml"/>
    </UserControl.Resources>
    <Grid>                                          <-- the container grid
        <Ellipse                                    <-- the control shape
            x:Name="Border"  
            Stroke="#FF393785"  
            StrokeThickness="2" 
            Fill="Transparent"/>                    <-- with a non-null background

        <DockPanel                                  <-- actual content
            LastChildFill="True" 
            Style="{StaticResource PanelStyle}" 
            Margin="10 18 10 23">                   <-- pushed inside the ellipse

            ...

        </DockPanel>
    </Grid>
</UserControl>

在我看来,它似乎不起作用。如果我把我的文本框等转移到这段代码中,我会在c代码编译器中得到错误,我在代码中没有看到我提到的文本框等。我希望有一个ResourceDictionary可以将上面的代码放到资源字典中,在那里我可以保留样式,这些样式将负责控制的形状。控件的内容永远不会更改,我只需要将控件边框形状更改为菱形。它看起来很棒,但我尝试使用多边形类创建菱形,但它不像elipse那样延伸到网格容器。那我该怎么办?