創建WPF用戶控件

 

 

 

wpf用戶自定義控件和winform創建方法類似，這里先糾正一個誤區，就是有很多人也是添加，然后新建，然后是新建用戶控件庫，但是為什么編譯好生成后Debug目錄下還是只有exe文件而沒有dll文件呢？這里大家要注意一下，新建要在解決方案處右鍵新建-新建項目，而不是在項目下新建，因為一個項目只產生一個exe的程序文件，要生成dll文件必須新建一個項目。如圖：

 

下面我用一個Tooltip舉例新建一個用戶控件：

先新建一個wpf程序，我這里命名為：“Wpf自定義控件”。然后再新建一個項目，即："wpf用戶控件"（WPF User Control Library），我這里命名為：“WpfControlLibrary1”.

之后在新建的項目“WpfControlLibrary1”的xaml文件里面添加如下代碼：

 

<UserControl x:Class="WpfControlLibrary1.UserControl1"
             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" 
             mc:Ignorable="d" RenderTransformOrigin="0,0" HorizontalAlignment="Left" 
             VerticalAlignment="Top" 
             d:DesignHeight="300" d:DesignWidth="300" 
             Name="用戶自定義控件">
 
    <UserControl.RenderTransform>
        <TransformGroup>
            <ScaleTransform ScaleX="1" ScaleY="1"/>
            <SkewTransform AngleX="0" AngleY="0"/>
            <RotateTransform Angle="0"/>
            <TranslateTransform x:Name="UserControlToolTipXY" X="0" Y="0"/>
        </TransformGroup>
    </UserControl.RenderTransform>
 
    <Grid HorizontalAlignment="Center" VerticalAlignment="Center" 
    MinWidth="200" MinHeight="120">
        <Grid.RowDefinitions>
            <RowDefinition Height="0.333*"/>
            <RowDefinition Height="0.667*"/>
        </Grid.RowDefinitions>
        <Rectangle Fill="#FFFBFBFB" Stroke="#FF000000" RadiusX="10" RadiusY="10"
             RenderTransformOrigin="0.139,0.012" StrokeThickness="1" Grid.RowSpan="2">
            <Rectangle.BitmapEffect>
                <DropShadowBitmapEffect Opacity="0.8"/>
            </Rectangle.BitmapEffect>
        </Rectangle>
        <Rectangle RadiusX="10" RadiusY="10" RenderTransformOrigin="0.139,0.012" 
            StrokeThickness="10" Stroke="{x:Null}" 
    Margin="1,1,1,1" Grid.Row="0" Grid.RowSpan="2">
            <Rectangle.Fill>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0.725">
                    <GradientStop Color="#00E6D9AA" Offset="0.487"/>
                    <GradientStop Color="#FF001EFF" Offset="0.996"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>
        <Rectangle RadiusX="10" RadiusY="10" RenderTransformOrigin="0.493,0.485" 
            StrokeThickness="10" Stroke="{x:Null}" Grid.RowSpan="2" Margin="1,1,1,1">
            <Rectangle.Fill>
                <LinearGradientBrush EndPoint="0.014,0.5" StartPoint="0.211,0.5">
                    <GradientStop Color="#00E6D9AA" Offset="0.513"/>
                    <GradientStop Color="#FF001EFF" Offset="0.996"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>
        <Rectangle RadiusX="10" RadiusY="10" RenderTransformOrigin="0.493,0.485" 
            StrokeThickness="10" Stroke="{x:Null}" Grid.RowSpan="2" Margin="1,1,1,1">
            <Rectangle.Fill>
                <LinearGradientBrush EndPoint="0.493,0.002" StartPoint="0.493,0.33">
                    <GradientStop Color="#00E6D9AA" Offset="0.513"/>
                    <GradientStop Color="#FF001EFF" Offset="0.996"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>
        <Rectangle RadiusX="10" RadiusY="10" RenderTransformOrigin="0.493,0.485" 
            StrokeThickness="10" Stroke="{x:Null}" Grid.RowSpan="2" Margin="1,1,1,1">
            <Rectangle.Fill>
                <LinearGradientBrush EndPoint="0.99,0.441" StartPoint="0.794,0.441">
                    <GradientStop Color="#00E6D9AA" Offset="0.513"/>
                    <GradientStop Color="#FF001EFF" Offset="0.996"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>
        <TextBlock Text="Hello！" TextWrapping="Wrap" x:Name="TextBlockToolTip" 
            RenderTransformOrigin="0.5,0.5" Grid.Row="1" HorizontalAlignment="Left" 
                VerticalAlignment="Center" Margin="20,0,0,20" />
        <TextBlock Name="ToolTipTitle" HorizontalAlignment="Stretch" Margin="15,16,15,6.1" 
            FontSize="14" Text="用戶自定義控件" d:LayoutOverrides="Height" />
    </Grid>
</UserControl>

　　

效果如圖：

 

下面我們在cs文件中添加如下代碼進行控制：

public double UserControlToolTipX
        {
            get { return this.UserControlToolTipXY.X; }
            set { this.UserControlToolTipXY.X = value; }
        }
 
        public double UserControlToolTipY
        {
            get { return this.UserControlToolTipXY.Y; }
            set { this.UserControlToolTipXY.Y = value; }
        }
 
        public string UserControlTextBlockToolTip
        {
            get { return TextBlockToolTip.Text; }
            set { TextBlockToolTip.Text = value; }
        }
 
        public string UserControlToolTipTitle
        {
            get { return ToolTipTitle.Text; }
            set { ToolTipTitle.Text = value; }
        }

　　完成后我們可以看到左側的工具箱里面已經有我們剛才添加的自定義控件了，如圖：

 

 

之后我們點擊生成里面的生成用戶控件，或者快捷鍵shift+F6，如圖：

最后在我們的debug目錄下就有剛才創建的dll文件了。