WPF自由​​形式边框控件

Question

我必须开发一个wpf控件，它应该具有与众所周知的边框相同的行为。 控件的形状应该是新的部分。每个可定义的封闭路径应被用来定义控制的出现。

我需要帮助来实现这一点。 目前我不知道如何与闭路径交换矩形（??）。

任何帮助将不胜感激。

Answer 1

编辑这里直接回答你的问题。我们将编写一个ContentControl派生类，具有非常灵活的边界形式。这个想法的基础在于OpacityMask。

如果您想了解更多关于此方法的信息，请参阅Chris Cavanagh's solution的圆角示例。

步骤1。创建自定义控制FreeFormContentControl：

FreeFormContentControl.cs

using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Media; 

namespace WpfApplication5 
{ 
    public class FreeFormContentControl : ContentControl 
    { 
    public Geometry FormGeometry 
    { 
     get { return (Geometry)GetValue(FormGeometryProperty); } 
     set { SetValue(FormGeometryProperty, value); } 
    } 

    public static readonly DependencyProperty FormGeometryProperty = 
     DependencyProperty.Register("FormGeometry", typeof(Geometry), typeof(FreeFormContentControl), new UIPropertyMetadata(null)); 

    static FreeFormContentControl() 
    { 
     DefaultStyleKeyProperty.OverrideMetadata(
     typeof(FreeFormContentControl), 
     new FrameworkPropertyMetadata(typeof(FreeFormContentControl)) 
     ); 
    } 
    } 
} 

主题\ Generic.xaml上自定义控件

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
        xmlns:local="clr-namespace:WpfApplication5"> 
    <Style TargetType="{x:Type local:FreeFormContentControl}"> 
    <Setter Property="FormGeometry" 
      Value="M0,0 L1,0 1,1 0,1z" /> 
    <Setter Property="Background" 
      Value="Black" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
     <ControlTemplate TargetType="{x:Type local:FreeFormContentControl}"> 
      <Grid> 
      <Path Name="mask" 
        Data="{TemplateBinding FormGeometry}" 
        Fill="{TemplateBinding Background}" /> 
      <Grid> 
       <Grid.OpacityMask> 
       <VisualBrush Visual="{Binding ElementName=mask}" /> 
       </Grid.OpacityMask> 
       <ContentPresenter /> 
      </Grid> 
      </Grid> 
     </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
    </Style> 
</ResourceDictionary> 

更多阅读可以CodeProject找到。

步骤2。用法。现在，您可以将任何内容放置在此控件中。它的默认形状是矩形。所以，下面的代码将导致经常StackPanel的UI：

<Window x:Class="WpfApplication5.Window1" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:cc="clr-namespace:WpfApplication5" 
     Title="Window1" 
     Height="300" 
     Width="300"> 
    <Grid> 
    <cc:FreeFormContentControl> 
     <StackPanel> 
     <Button Content="Any" /> 
     <Button Content="Content" /> 
     <TextBlock Text="Goes" /> 
     <TextBox Text="Here" /> 
     </StackPanel> 
    </cc:FreeFormContentControl> 
    </Grid> 
</Window> 

但是，如果你定义自定义FormGeometry你会得到自定义形状。例如，下面的表格几何呈现内控制金刚石内：

<cc:FreeFormContentControl FormGeometry="M0,0.5 L0.5,0 1,0.5 0.5,1z"> 

要详细了解几何定义从XAML，读取对应部分上MSDN：Path Markup Syntax。

这里最后提到的一点是，您不必指定或计算FormGeomtry的具体像素值。网格使这个技巧成为可能。所以想想它的百分比。即1 ==全宽或高度。 0.5 ==可用宽度/高度的一半等等。

希望这会有所帮助。