WPF中的自定义控件实例

Posted 逛园子$$$

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了WPF中的自定义控件实例相关的知识,希望对你有一定的参考价值。

1、前端

技术分享图片
 1 <UserControl x:Class="RayProject.Control.EMIControl"
 2              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 3              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 4              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
 5              xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
 6              xmlns:wfi="clr-namespace:System.Windows.Forms.Integration;assembly=WindowsFormsIntegration"
 7              xmlns:winForms="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"
 8              mc:Ignorable="d" 
 9              d:DesignHeight="300" d:DesignWidth="300"  
10              Height="283" Width="330"  >
11 
12 
13     <Grid>
14         <Grid  x:Name="top1" Margin="0,0,0,199.5"  >
15             <Image x:Name="形状_48"  Stretch="Fill" Source="/Skins/Images/Radar/Shape1-2.png"   Height="72.554" Margin="10,10,10,0.5"    />
16             <Image x:Name="形状_49"     Source="/Skins/Images/Radar/Shape1-1.png"  HorizontalAlignment="Left" VerticalAlignment="Top"   Margin="274,15,0,0" Height="31" Width="36"/>
17             <TextBlock x:Name="_1号干扰器" Padding="6" Foreground="#FF5D9FF7" FontSize="16" FontFamily="Microsoft YaHei"    TextAlignment="Left"   Text="1号干扰器"  HorizontalAlignment="Left" VerticalAlignment="Top" Margin="66,10,0,0" Width="86.383" Height="37.117"  />
18         </Grid>
19         <Grid x:Name="干扰1" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="120.482,57.5,10,61.5">
20             <Image x:Name="多边形_4"     Source="/Skins/Images/Radar/polygon1.png" HorizontalAlignment="Left" VerticalAlignment="Top"   />
21             <Image x:Name="形状_41"    Source="/Skins/Images/Radar/shape46.png" HorizontalAlignment="Left" VerticalAlignment="Top"    RenderTransformOrigin="0.5,0.5" Margin="13.915,12.001,0,0" Height="137" Width="156.442"/>
22             <!--<Image x:Name="waves1"   Source="/Skins/Images/Radarshapes25.png" Margin="55.667,21.335,53.185,20.5"></Image>-->
23             <WindowsFormsHost Background="Transparent" Margin="55,21,56,17">
24                 <winForms:PictureBox x:Name="WavesGif" ImageLocation="./Skins/Images/Radar/shapes25.png" SizeMode="Zoom" ></winForms:PictureBox>
25             </WindowsFormsHost>
26 
27         </Grid>
28         <Grid x:Name="旋转角度1"  HorizontalAlignment="Left" VerticalAlignment="Top" Margin="31,182.497,0,0" Width="75.329" Height="92.275">
29             <Image x:Name="椭圆_8"     Opacity="0.651" Source="/Skins/Images/Radar/ellipes53.png"  HorizontalAlignment="Left" VerticalAlignment="Top"  Height=" 60" Width="60" Margin="7.5,32.275,0,0"/>
30             <Image  Source="/Skins/Images/Radar/pointer1.png"   HorizontalAlignment="Left" VerticalAlignment="Top"  RenderTransformOrigin="0.227,0.504" Margin="34.24,57.727,0,0" Height="9.935" Width="24.049"  >
31                 <Image.RenderTransform>
32                     <RotateTransform x:Name="LevelPointer" Angle="-90" ></RotateTransform>
33                 </Image.RenderTransform>
34             </Image>
35             <TextBlock x:Name="LevelAngleTxt" Text="{Binding LevelAngle, RelativeSource={RelativeSource AncestorType=UserControl}}" TextAlignment="Right" Foreground="#FF057BF2" FontSize="14" FontFamily="Microsoft YaHei" HorizontalAlignment="Left" VerticalAlignment="Top"  Opacity="0.569" Width="32.461" Margin="20.758,8.798,0,0"  >
36                 <Run Text="°" Foreground="#FF057BF2" FontSize="14" FontFamily="Microsoft YaHei" ></Run>
37             </TextBlock>
38          </Grid>
39         <Grid x:Name="垂直旋转1" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="31,78.5,0,0" Height="98.997" Width="84.482">
40             <Path x:Name="矩形_22" Data="F1M1,1C1,1 4,1 4,1 4,1 4,65 4,65 4,65 1,65 1,65 1,65 1,1 1,1z" Fill="#FF106CF5"   Opacity="0.651"  HorizontalAlignment="Left" VerticalAlignment="Top"   
41                 Margin="8.5,20,0,0" Stretch="Fill" Width="3.168" Height="78.997"/>
42             <Path x:Name="垂直指针" Fill="#FF106CF5" Margin="9.21,57.863,0,0" Stretch="Fill" HorizontalAlignment="Left" VerticalAlignment="Top" RenderTransformOrigin="0.035,0.051"  Data="M1.5102235,2.3961067E-05 C1.7992257,0.0016530752 2.0908819,0.08649683 2.3473819,0.26162171 2.3473819,0.26162183 17.458466,10.602197 24.069564,15.1262 L24.203769,15.218037 24.384181,14.954367 C25.084826,13.93038 25.618651,13.150199 25.618651,13.150199 25.618651,13.150199 38.823771,22.184523 38.823771,22.184523 38.823771,22.184523 34.306113,28.787045 34.306113,28.787045 34.306113,28.787045 21.100991,19.752721 21.100991,19.752721 21.100991,19.752721 21.634816,18.972541 22.335461,17.948552 L22.510035,17.693415 22.375441,17.601323 C15.764075,13.077588 0.65238202,2.737622 0.65238178,2.7376225 -0.030617952,2.2696218 -0.20561802,1.3366218 0.26238179,0.65262151 0.55425704,0.22574675 1.0285538,-0.0026906729 1.5102235,2.3961067E-05 z" Width="34.532" Height="25.872" >
43                 <Path.RenderTransform>
44                     <TransformGroup>
45                         <ScaleTransform/>
46                         <SkewTransform/>
47                         <RotateTransform x:Name="VerticalPointer" Angle="-35.782"/>
48                         <TranslateTransform X="-0.106" Y="0.302"/>
49                     </TransformGroup>
50                 </Path.RenderTransform>
51             </Path>
52             <Image x:Name="椭圆_5_拷贝_3"     Source="/Skins/Images/Radar/ellipes5_21.png"  HorizontalAlignment="Left" VerticalAlignment="Top"   Margin="6.335,54.898,0,0" Height="7.999" Width="8"/>
53             <TextBlock x:Name="VerticalAngleTxt"   Text="{Binding VerticalAngle, RelativeSource={RelativeSource AncestorType=UserControl}}"  TextAlignment="Right" Foreground="#FF057BF2" FontSize="14" FontFamily="Microsoft YaHei" HorizontalAlignment="Left" VerticalAlignment="Top"  Opacity="0.569" Width="35" Height="15"  >
54                 <Run  Text="°" Foreground="#FF057BF2" FontSize="14" FontFamily="Microsoft YaHei" ></Run>
55             </TextBlock>
56         </Grid>
57 
58         <Grid x:Name="状态1" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="139.094,226.5,0,0" Height="32" Width="150">
59             <Image x:Name="bgImage" HorizontalAlignment="Left" VerticalAlignment="Top" Stretch="Fill"  Source="/Skins/Images/Radar/Rectangle7.png" Width="150"/>
60             <Label  Content="状态"  Padding="8" Foreground="White" Opacity="0.569"  FontSize="14" FontFamily="Microsoft YaHei" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="9,0,0,0" Width="50.943" Height="32" />
61             <TextBlock x:Name="statusTxt" Text="{Binding StatusText, RelativeSource={RelativeSource AncestorType=UserControl}}" Padding="20,8" Foreground="#FF0DF612" FontSize="14" FontFamily="Microsoft YaHei"  HorizontalAlignment="Left" VerticalAlignment="Top"  Margin="59.943,0,0,0" Width="80.057" Height="32"     />
62         </Grid>
63     </Grid>
64 
65 </UserControl>
View Code

 

2、后台

技术分享图片
  1 using System;
  2 using System.Collections.Generic;
  3 using System.Linq;
  4 using System.Text;
  5 using System.Threading.Tasks;
  6 using System.Windows;
  7 using System.Windows.Controls;
  8 using System.Windows.Data;
  9 using System.Windows.Documents;
 10 using System.Windows.Input;
 11 using System.Windows.Media;
 12 using System.Windows.Media.Animation;
 13 using System.Windows.Media.Imaging;
 14 using System.Windows.Navigation;
 15 using System.Windows.Shapes;
 16 using System.Windows.Threading;
 17 
 18 namespace RayProject.Control
 19 {
 20     /// <summary>
 21     /// UserControl1.xaml 的交互逻辑
 22     /// </summary>
 23     public partial class EMIControl : UserControl
 24     {
 25         public EMIControl()
 26         {
 27             InitializeComponent();
 28 
 29         }
 30 
 31 
 32 
 33 
 34         //水平角度 依赖属性
 35 
 36         public const string LevelAnglePropertyName = "LevelAngle";
 37 
 38         public double LevelAngle
 39         {
 40             get
 41             {
 42                 return (double)GetValue(LevelAngleProperty);
 43             }
 44             set
 45             {
 46                 SetValue(LevelAngleProperty, value);
 47             }
 48         }
 49 
 50         public static readonly DependencyProperty LevelAngleProperty = DependencyProperty.Register(
 51             LevelAnglePropertyName,
 52             typeof(double),
 53             typeof(EMIControl),
 54             new UIPropertyMetadata((double)0, new PropertyChangedCallback(LevelAngleChanged)));
 55 
 56         //水平角度变化事件   动画
 57         private static void LevelAngleChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
 58         {
 59             EMIControl UC = (EMIControl)d;
 60             //UC.LevelPointer.Angle += UC.LevelAngle;
 61             //创建动画
 62             DoubleAnimation da1 = new DoubleAnimation();
 63             Duration duration = new Duration(TimeSpan.FromMilliseconds(1000));
 64             da1.From = (double)e.OldValue - 90;
 65             da1.To = (double)e.NewValue - 90;
 66             da1.Duration = duration;
 67             UC.LevelPointer.BeginAnimation(RotateTransform.AngleProperty, da1);
 68 
 69         }
 70 
 71 
 72 
 73 
 74         //垂直角度 依赖属性
 75         /// <summary>
 76         /// The <see cref="MyProperty" /> dependency property‘s name.
 77         /// </summary>
 78         public const string VerticalAnglePropertyName = "VerticalAngle";
 79 
 80         /// <summary>
 81         /// Gets or sets the value of the <see cref="MyProperty" />
 82         /// property. This is a dependency property.
 83         /// </summary>
 84         public double VerticalAngle
 85         {
 86             get
 87             {
 88                 return (double)GetValue(VerticalAngleProperty);
 89             }
 90             set
 91             {
 92                 SetValue(VerticalAngleProperty, value);
 93             }
 94         }
 95 
 96         /// <summary>
 97         /// Identifies the <see cref="MyProperty" /> dependency property.
 98         /// </summary>
 99         public static readonly DependencyProperty VerticalAngleProperty = DependencyProperty.Register(
100             VerticalAnglePropertyName,
101             typeof(double),
102             typeof(EMIControl),
103             new UIPropertyMetadata(0.0, new PropertyChangedCallback(VerticalAngleChanged)));
104 
105         //垂直角度变化事件   动画
106         private static void VerticalAngleChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
107         {
108             EMIControl UC = (EMIControl)d;
109             //UC.VerticalPointer.Angle = UC.VerticalAngle;
110             //创建动画
111             DoubleAnimation da2 = new DoubleAnimation();
112             Duration duration = new Duration(TimeSpan.FromMilliseconds(1000));
113             double fromAngle, toAngle;
114             fromAngle = (double)e.OldValue;
115             da2.From = fromAngle * (-1) - 35.782;
116             ////if (fromAngle < 0)
117             ////{
118             ////    da2.From = fromAngle * -1 - 35.782;
119             ////}
120             ////else
121             ////{
122             ////    da2.From = 360 - fromAngle - 35.782;
123             ////}
124             toAngle = (double)e.NewValue;
125             da2.To = toAngle * (-1) - 35.782;
126             ////if (toAngle < 0)
127             ////{
128             ////    da2.To = toAngle * -1 - 35.782;
129             ////    if (da2.To < 0)
130             ////        da2.To += 360;
131             ////}
132             ////else
133             ////{
134             ////    da2.To = 360 - toAngle - 35.782;
135             ////    if (da2.To > 0)
136             ////        da2.To -= 360;
137             ////}
138 
139             da2.Duration = duration;
140 
141 
142             UC.VerticalPointer.BeginAnimation(RotateTransform.AngleProperty, da2);
143         }
144 
145 
146         //状态 依赖属性
147         /// <summary>
148         /// The <see cref="MyProperty" /> dependency property‘s name.
149         /// </summary>
150         public const string StatusTextPropertyName = "Status";
151 
152         /// <summary>
153         /// Gets or sets the value of the <see cref="MyProperty" />
154         /// property. This is a dependency property.
155         /// </summary>
156         public string Status
157         {
158             get
159             {
160                 return (string)GetValue(StatusTextProperty);
161             }
162             set
163             {
164                 SetValue(StatusTextProperty, value);
165             }
166         }
167 
168         /// <summary>
169         /// Identifies the <see cref="MyProperty" /> dependency property.
170         /// </summary>
171         public static readonly DependencyProperty StatusTextProperty = DependencyProperty.Register(
172             StatusTextPropertyName,
173             typeof(string),
174             typeof(EMIControl),
175             new UIPropertyMetadata("准备中", new PropertyChangedCallback(StatusChanged)));
176 
177 
178 
179 
180 
181         //状态变化事件
182         private static void StatusChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
183         {
184             EMIControl UC1 = (EMIControl)d;
185             if (UC1.Status == "Firing")
186             {
187                 UC1.bgImage.Source = new BitmapImage(new Uri(@"./Skins/Images/Radar/Rectangle8.png", UriKind.Relative));//背景图
188                 UC1.statusTxt.Text = "干扰压制中";
189                 UC1.statusTxt.Foreground = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFBF0A0F"));//字体颜色
190                 //UC1.waves1.Source = new BitmapImage(new Uri(@"/Skins/Images/Radarshapes30.gif", UriKind.Relative));
191                 UC1.WavesGif.Image = System.Drawing.Image.FromFile("./Skins/Images/Radar/shapes30.gif");
192             }
193             else
194             {
195                 UC1.bgImage.Source = new BitmapImage(new Uri(@"./Skins/Images/Radar/Rectangle7.png", UriKind.Relative));//背景图
196                 UC1.statusTxt.Text = "装备就绪";
197                 UC1.statusTxt.Foreground = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FF0DF612"));//字体颜色
198                 //C1.waves1.Source = new BitmapImage(new Uri(@"/Skins/Images/Radarshapes25.png", UriKind.Relative));
199                 UC1.WavesGif.Image = System.Drawing.Image.FromFile("./Skins/Images/Radar/shapes25.png");
200 
201             }
202         }
203 
204 
205 
206     }
207 }
View Code

 

以上是关于WPF中的自定义控件实例的主要内容,如果未能解决你的问题,请参考以下文章

您如何在 WPF 中动态(通过代码)添加在 XAML 中制作的自定义控件?

WPF 自定义模板

wpf 自定义控件的自定义属性的数据绑定问题

wpf中动态添加的自定义控件过宽,不能完全显示,怎么办

WPF中的自定义光标?

设置绑定到 WPF 用户控件内的自定义 DependencyProperty