WPF开发经验-实现一种通用阀门控件

一 引入

在设计设备界面时，经常会有一种需求，展示一个阀门，阀门有通断两种状态：
 
二 CommonValveControl

考虑实现一个自定义控件，CommonValveControl。
使用自定义控件比用户控件更灵活，更具扩展性，可以使用不同的样式和模板。
CommonValveControl定义两个依赖属性，Orientation表示安装展示的方向，Status表示阀门的通断状态。

1. public class CommonValveControl : Control
2. {
3.     static CommonValveControl()
4.     {
5.         DefaultStyleKeyProperty.OverrideMetadata(typeof(CommonValveControl), new FrameworkPropertyMetadata(typeof(CommonValveControl)));
6.     }
7.    
8.     public bool Status
9.     {
10.         get => (bool)GetValue(StatusProperty);
11.         set => SetValue(StatusProperty, value);
12.     }
13.     public static readonly DependencyProperty StatusProperty = DependencyProperty.Register(
14.        "Status",
15.        typeof(bool),
16.        typeof(CommonValveControl));
17.    
18.     public Orientation ValveOrientation
19.     {
20.         get => (Orientation)GetValue(CommonValveOrientationProperty);
21.         set => SetValue(CommonValveOrientationProperty, value);
22.     }
23.     public static readonly DependencyProperty CommonValveOrientationProperty = DependencyProperty.Register(
24.         "ValveOrientation",
25.         typeof(Orientation),
26.         typeof(CommonValveControl));
27. }

复制代码

设计CommonValveControl的样式模板，可通过设计不同的模板，以呈现出不同的效果。
通过ValveOrientation属性触发切换阀门的竖直状态和水平状态。

1. [/code][size=5]三 效果演示[/size]
3. Xaml代码：
4. [code]<Canvas>
5.     <local:PipeControl Width="106" Height="14" Canvas.Left="26" Canvas.Top="53"/>
6.     <local:PipeControl Width="14" Height="80" Canvas.Left="185" Canvas.Top="22" Orientation="Vertical"/>
7.     <local:CommonValveControl x:Name="valve1" Status="False" ValveOrientation="Horizontal" Width="40" Height="40" Canvas.Left="60" Canvas.Top="41"/>
8.     <local:CommonValveControl x:Name="valve2" Status="False" ValveOrientation="Vertical" Width="40" Height="40" Canvas.Left="172" Canvas.Top="41"/>
9.     <Button Content="Open" Click="OpenButton_Click" Canvas.Left="272" Canvas.Top="15" Width="66" Height="35"/>
10.     <Button Content="Close" Click="CloseButton_Click" Canvas.Left="272" Canvas.Top="71" Width="66" Height="35"/>
11. </Canvas>

复制代码

 后台代码：

1. public partial class MainWindow : Window
2. {
3.     public MainWindow()
4.     {
5.         InitializeComponent();
6.     }
8.     private void OpenButton_Click(object sender, RoutedEventArgs e)
9.     {
10.         valve1.Status = true;
11.         valve2.Status = true;
12.     }
14.     private void CloseButton_Click(object sender, RoutedEventArgs e)
15.     {
16.         valve1.Status = false;
17.         valve2.Status = false;
18.     }
19. }

复制代码

 
<Canvas>
    <local:PipeControl Width="106" Height="14" Canvas.Left="26" Canvas.Top="53"/>
    <local:PipeControl Width="14" Height="80" Canvas.Left="185" Canvas.Top="22" Orientation="Vertical"/>
    <local:CommonValveControl x:Name="valve1" Status="False" ValveOrientation="Horizontal" Width="40" Height="40" Canvas.Left="60" Canvas.Top="41"/>
    <local:CommonValveControl x:Name="valve2" Status="False" ValveOrientation="Vertical" Width="40" Height="40" Canvas.Left="172" Canvas.Top="41"/>
    <Button Content="Open" Click="OpenButton_Click" Canvas.Left="272" Canvas.Top="15" Width="66" Height="35"/>
    <Button Content="Close" Click="CloseButton_Click" Canvas.Left="272" Canvas.Top="71" Width="66" Height="35"/>
</Canvas>             本文作者： 一团静火
                 本文链接： https://www.cnblogs.com/wwwen/p/16992344.html
                 关于博主： 水平有限，不足或错误之处，请批评指正。如果文章对您有帮助，可以点击文章右下角【推荐】一下。
                 版权声明： 本博客所有文章除特别声明外，系原创文章，均采用 BY-NC-SA 许可协议。转载请注明出处！并保留此段内容。
            
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！