WPF开发冷风机组态及应用

最新推荐文章于 2024-03-02 17:37:16 发布

inet_ygssoftware

最新推荐文章于 2024-03-02 17:37:16 发布

阅读量760

点赞数

文章标签： wpf c# 开发语言

本文链接：https://blog.csdn.net/inet_ygssoftware/article/details/125021088

版权

冷风机组件开发和应用

VS2022

.NET6框架

冷风机组件开发演示

在这里插入图片描述

WPF主界面设计

WPF主界面托板设计

<Window x:Class="WpfConsolePannel.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfConsolePannel"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="1260">
    <Grid Background="Black">
        <Canvas Background="Transparent"
                MouseWheel="Canvas_MouseWheel"
                MouseLeftButtonDown="Canvas_MouseLeftButtonDown"
                MouseLeftButtonUp="Canvas_MouseLeftButtonUp"
                MouseMove="Canvas_MouseMove">
            <Viewbox Canvas.Left="30" Canvas.Top="120" Name="mainView">
                <Grid>
                    <Polygon VerticalAlignment="Center" 
                             Fill="LightGray" 
                             Points="0,200 150,0 1000,0 1200 200 0,200"
                             Stroke="LightGray"
                             StrokeThickness="2"/>
                    
                </Grid>
            </Viewbox>
        </Canvas>
    </Grid>
</Window>

WPF托板拖动实现

/// <summary>
/// 视图缩放
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void Canvas_MouseWheel(object sender, MouseWheelEventArgs e)
{
    // 获取实际渲染的高度和宽度
    var w = this.mainView.ActualWidth + e.Delta;
    var h = this.mainView.ActualHeight + e.Delta;
    if (w <100) w = 500;
    if (h <100) h = 100;
    this.mainView.Height = h;
    this.mainView.Width = w;
    // 设置画板缩放的左边位置
    this.mainView.SetValue(Canvas.LeftProperty, (this.RenderSize.Width - this.mainView.Width) / 2);
}

bool _isMoving = false;
Point _point = new Point(0, 0);
double _left =0, _top = 0;

private void Canvas_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
    _isMoving = true;
    _point = e.GetPosition(sender as Canvas);
    _left = double.Parse(this.mainView.GetValue(Canvas.LeftProperty).ToString()!);
    _top = double.Parse(this.mainView.GetValue(Canvas.TopProperty).ToString()!);
}

private void Canvas_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
    _isMoving = false;
}

private void Canvas_MouseMove(object sender, MouseEventArgs e)
{
    if (_isMoving)
    {
        Point currentPoint = e.GetPosition(sender as Canvas);
        this.mainView.SetValue(LeftProperty, _left + (currentPoint.X - _point.X));
        this.mainView.SetValue(TopProperty, _top+(currentPoint.Y - _point.Y));
    }
}

冷风机自定义控件

初始化代码

<Border BorderThickness="1" Name="frame">
    <Viewbox VerticalAlignment="Center" HorizontalAlignment="Center">
        <Canvas Width="205" Height="245" Margin="5">
           
        </Canvas>
    </Viewbox>
</Border>

画风扇托板

<Polygon Points="0,70 40,10 205,10 180,70" Fill="#FFF" />

画风扇上座弧形

<Path Canvas.Left="50" Canvas.Top="20" Data="M0 0A60 15 0 0 0 120 0L120 25A60 15 0 0 1 0 25">
    <Path.Fill>
        <LinearGradientBrush EndPoint="1,0" StartPoint="0,0">
            <GradientStop Color="#FFD6D6D6" Offset="0" />
            <GradientStop Color="#FFFFFF" Offset="0.5" />
            <GradientStop Color="#FFD6D6D6" Offset="1" />
        </LinearGradientBrush>
    </Path.Fill>
</Path>
<Ellipse Width="120" Height="30" Fill="#CCC" Canvas.Top="10" Canvas.Left="50" />

通过Path画风扇

<Border Canvas.Left="54" Canvas.Top="-30" >
    <Viewbox Width="110" Height="110" RenderTransformOrigin="0.5,0.5">
        <Viewbox.RenderTransform>
            <TransformGroup>
                <RotateTransform Angle="0" x:Name="rt" />
                <ScaleTransform ScaleY="0.25" />
            </TransformGroup>
        </Viewbox.RenderTransform>
        <Path Fill="White" Data="M240.16436182 107.8387919c-64.76383717 88.95385497-39.00023321 207.2195934 60.99957411 287.22561045 41.74629367 33.41554783 139.52456881 68.55895483 127.98494279 96.5132357-52.94651971 81.57960187-156.4946072 17.15516602-220.88818912-41.00578317-84.01711628-75.80978886-156.21691576-56.74163671-186.48529261 51.09524212C-10.71451204 617.03250262 48.74233051 765.65918238 143.5585623 806.54154713c97.59314685 42.05484037 202.8073843-5.33784855 283.36878357-128.54032568 20.48746395-31.40999788 29.68213938-91.08282334 81.3019111-61.30811948 38.50655955 22.21532312 28.4171006 72.53919947 5.52297551 110.61379388-18.29678704 30.39179594-36.68613723 61.3698287-59.30256954 88.55274511-78.77183221 94.56939496-53.77959402 163.86885964 69.20690087 187.44178602C645.74827583 1026.59666126 777.09637117 968.06545617 807.88927696 868.96043369c39.37048913-126.50392112-28.54051901-207.80583155-128.046652-271.21206545-32.11965444-20.45661001-92.37871738-31.16316105-60.38248135-83.02976894 21.50566722-34.77315109 71.15074161-22.83241521 111.81712478-4.75161041 34.06349519 15.11876146 60.99957344 36.25417276 88.02821618 60.69102741 85.34386493 77.32166513 152.4526527 57.11189197 183.18384861-53.16250194 32.27392681-115.82822468-30.42265054-264.8560143-126.93588558-301.81984297-108.85508144-41.71543973-239.2466847 3.45571702-303.3317199 145.35609104-15.36559829 22.15361392-16.10610946 68.0652805-47.73208892 56.30967159-30.23752292-11.29278919-32.67503733-45.69568436-28.20111769-70.65706794 10.55227868-58.50034983 37.79690298-106.29414861 87.5345425-146.5902752 61.80179382-50.07704018 57.54385709-108.33055316-11.13851617-155.84665985-89.57094706-61.86350302-265.53481626-28.38624599-332.5201856 63.52965167z m304.56590408 376.82741277a41.84597906 41.84597906 0 1 1-59.17915112 59.17915112 41.84597906 41.84597906 0 0 1 59.17915112-59.17915112z" />
    </Viewbox>
</Border>

画外壳

<Grid Width="180" Height="180" Background="LightGray" Canvas.Top="70">
    <Border VerticalAlignment="Top" Height="140" BorderThickness="10">
        <Border.Background>
            <DrawingBrush TileMode="Tile" ViewportUnits="Absolute" Viewport="1 0 25 1">
                <DrawingBrush.Drawing>
                    <GeometryDrawing>
                        <GeometryDrawing.Pen>
                            <Pen Brush="#EEE" />
                        </GeometryDrawing.Pen>
                        <GeometryDrawing.Geometry>
                            <PathGeometry>
                                <PathFigure>
                                    <LineSegment Point="10,0" />
                                    <LineSegment Point="10,10" />
                                </PathFigure>
                            </PathGeometry>
                        </GeometryDrawing.Geometry>
                    </GeometryDrawing>
                </DrawingBrush.Drawing>
            </DrawingBrush>
        </Border.Background>
    </Border>
    <Grid VerticalAlignment="Bottom" Height="45" Margin="5">
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Border Background="#AAA" Margin="2" />
        <Border Background="#AAA" Margin="2" Grid.Column="1" />
    </Grid>
</Grid>
<Grid Width="180" Height="180" Background="LightGray" Canvas.Top="70" Canvas.Left="180">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="29*"/>
        <ColumnDefinition Width="7*"/>
    </Grid.ColumnDefinitions>
    <Grid.RenderTransform>
        <TransformGroup>
            <ScaleTransform ScaleX="0.139" />
            <SkewTransform AngleY="-67.4" />
        </TransformGroup>
    </Grid.RenderTransform>
    <Border VerticalAlignment="Top" Height="140" BorderThickness="10" Grid.ColumnSpan="2">
        <Border.Background>
            <DrawingBrush TileMode="Tile" ViewportUnits="Absolute" Viewport="1 0 25 1">
                <DrawingBrush.Drawing>
                    <GeometryDrawing>
                        <GeometryDrawing.Pen>
                            <Pen Brush="#EEE" />
                        </GeometryDrawing.Pen>
                        <GeometryDrawing.Geometry>
                            <PathGeometry>
                                <PathFigure>
                                    <LineSegment Point="10,0" />
                                    <LineSegment Point="10,10" />
                                </PathFigure>
                            </PathGeometry>
                        </GeometryDrawing.Geometry>
                    </GeometryDrawing>
                </DrawingBrush.Drawing>
            </DrawingBrush>
        </Border.Background>
    </Border>
    <Grid VerticalAlignment="Bottom" Height="45" Margin="5,0,5,5" Grid.ColumnSpan="2">
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Border Background="#AAA" Margin="2" />
        <Border Background="#AAA" Margin="2" Grid.Column="1" />
    </Grid>
</Grid>

画指示灯

<Border Width="18" Height="18" CornerRadius="10" Canvas.Left="155" Canvas.Top="85">
    <Border.Background>
        <RadialGradientBrush>
            <GradientStop Color="gray" Offset="0.5" x:Name="gsGreen" />
            <GradientStop Color="White" />
        </RadialGradientBrush>
    </Border.Background>
</Border>
<Border Width="18" Height="18" CornerRadius="10" Canvas.Left="155" Canvas.Top="110">
    <Border.Background>
        <RadialGradientBrush>
            <GradientStop Color="gray" Offset="0.5" x:Name="gsRed" />
            <GradientStop Color="White" />
        </RadialGradientBrush>
    </Border.Background>
</Border>

VisualStateManager设置运行状态

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup>
        <VisualState Name="RunState">
            <Storyboard>
                <!--添加风扇旋转动画-->
                <DoubleAnimation Duration="0:0:0.1" From="0" To="-360" 
                                 RepeatBehavior="Forever"
                                 Storyboard.TargetName="rt"
                                 Storyboard.TargetProperty="Angle"/>
                <ColorAnimationUsingKeyFrames Storyboard.TargetName="gsGreen"
                                              Storyboard.TargetProperty="Color">
                    <DiscreteColorKeyFrame Value="Green" KeyTime="0" />
                </ColorAnimationUsingKeyFrames>
            </Storyboard>
        </VisualState>
        <VisualState Name="StopState" />
    </VisualStateGroup>
    <VisualStateGroup>
        <VisualState Name="FaultState">
            <Storyboard>
                <!--错误指示灯-->
                <ColorAnimationUsingKeyFrames Storyboard.TargetName="gsRed"
                                              Storyboard.TargetProperty="Color"
                                              RepeatBehavior="Forever">
                    <DiscreteColorKeyFrame Value="Red" KeyTime="0:0:0.5" />
                    <DiscreteColorKeyFrame Value="Gray" KeyTime="0:0:1" />
                </ColorAnimationUsingKeyFrames>
            </Storyboard>
        </VisualState>
        <VisualState Name="NormalState" />
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

添加依赖属性

public bool IsRunning
{
    get { return (bool)GetValue(IsRunningProperty); }
    set { SetValue(IsRunningProperty, value); }
}

// Using a DependencyProperty as the backing store for IsRunning.  This enables animation, styling, binding, etc...
public static readonly DependencyProperty IsRunningProperty =
    DependencyProperty.Register("IsRunning", typeof(bool), typeof(CoolingTower), new PropertyMetadata(default(bool),new PropertyChangedCallback(OnRunStateChanged))); 

private static void OnRunStateChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
    bool state = (bool)e.NewValue;
    VisualStateManager.GoToState(d as CoolingTower, state ? "RunState" : "StopState", false);
}

public bool IsFault
{
    get { return (bool)GetValue(IsFaultProperty); }
    set { SetValue(IsFaultProperty, value); }
}

// Using a DependencyProperty as the backing store for IsRunning.  This enables animation, styling, binding, etc...
public static readonly DependencyProperty IsFaultProperty =
    DependencyProperty.Register("IsFault", typeof(bool), typeof(CoolingTower), new PropertyMetadata(default(bool), new PropertyChangedCallback(OnFaultStateChanged)));

private static void OnFaultStateChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
    bool state = (bool)e.NewValue;
    VisualStateManager.GoToState(d as CoolingTower, state ? "FaultState" : "NormalState", false);
}

自定义流动管道控件

窗口布局

<UserControl x:Class="WpfComponent.Controls.Pipeline"
             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" 
             xmlns:local="clr-namespace:WpfComponent.Controls"
             mc:Ignorable="d" 
             d:DesignHeight="30" d:DesignWidth="500">
    <Grid>
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup>
                <VisualState Name="WEFlowState">
                    <Storyboard RepeatBehavior="Forever">
                        <DoubleAnimation Duration="0:0:1" From="0" To="5"
                                         Storyboard.TargetName="flowLine"
                                         Storyboard.TargetProperty="StrokeDashOffset"
                                         />
                    </Storyboard>
                </VisualState>
                <VisualState Name="EEFlowState">
                    <Storyboard RepeatBehavior="Forever">
                        <DoubleAnimation Duration="0:0:1" From="0" To="-5"
                                         Storyboard.TargetName="flowLine"
                                         Storyboard.TargetProperty="StrokeDashOffset"
                                         />
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <Border CornerRadius="{Binding CapRadius, RelativeSource={RelativeSource AncestorType=UserControl,Mode=FindAncestor}}">
            <Border.Background>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FFCBCBCB" Offset="0.9"/>
                    <GradientStop Color="#FFFFFFFF" Offset="0.5"/>
                    <GradientStop Color="#FFCBCBCB" Offset="0.0"/>
                </LinearGradientBrush>
            </Border.Background>
            <Border Margin="2" Name="border">
                <Line X1="0" Y1="0" X2="{Binding RelativeSource={RelativeSource Self},Path=ActualWidth}"
                      Y2="0" 
                      Stroke="{Binding LiquidColor,RelativeSource={RelativeSource AncestorType=UserControl,Mode=FindAncestor}}"
                      StrokeThickness="{Binding ElementName=border,Path=ActualHeight}"
                      StrokeDashArray="2,3"
                      VerticalAlignment="Center"
                      Stretch="Fill"
                      StrokeDashCap="Round"
                      StrokeEndLineCap="Round"
                      StrokeStartLineCap="Round"
                      Name="flowLine" Opacity="0.3"
                      />
            </Border>
        </Border>      
    </Grid>
</UserControl>

自定义依赖属性

public int Direction
{
    get { return (int)GetValue(DirectionProperty); }
    set { SetValue(DirectionProperty, value); }
}

// Using a DependencyProperty as the backing store for Direction.  This enables animation, styling, binding, etc...
public static readonly DependencyProperty DirectionProperty =
    DependencyProperty.Register("Direction", typeof(int), typeof(Pipeline), new PropertyMetadata(default(int),new PropertyChangedCallback(OnDirectionChanged)));

/// <summary>
/// 设置状态
/// </summary>
/// <param name="d"></param>
/// <param name="e"></param>
/// <exception cref="NotImplementedException"></exception>
private static void OnDirectionChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
    int value = int.Parse(e.NewValue.ToString()!);
    VisualStateManager.GoToState(d as Pipeline, value == 1 ? "WEFlowState" : "EEFlowState",false);
}


/// <summary>
/// 设置液体颜色
/// </summary>
public Brush LiquidColor
{
    get { return (Brush)GetValue(LiquidColorProperty); }
    set { SetValue(LiquidColorProperty, value); }
}

// Using a DependencyProperty as the backing store for LiquidColor.  This enables animation, styling, binding, etc...
public static readonly DependencyProperty LiquidColorProperty =
    DependencyProperty.Register("LiquidColor", typeof(Brush), typeof(Pipeline), new PropertyMetadata(Brushes.Red));



public int CapRadius
{
    get { return (int)GetValue(CapRadiusProperty); }
    set { SetValue(CapRadiusProperty, value); }
}

// Using a DependencyProperty as the backing store for CapRadius.  This enables animation, styling, binding, etc...
public static readonly DependencyProperty CapRadiusProperty =
    DependencyProperty.Register("CapRadius", typeof(int), typeof(Pipeline), new PropertyMetadata(0));

界面组装组态应用

<component:CoolingTower Width="90" Height="110" HorizontalAlignment="Left" VerticalAlignment="Bottom"
                        Margin="125 0 0 100"
                        IsRunning="False"
                        IsFault="False" />
<component:CoolingTower Width="90" Height="110" HorizontalAlignment="Left" VerticalAlignment="Bottom"
                        Margin="100 0 0 60"
                        IsRunning="False"
                        IsFault="False" />
<component:CoolingTower Width="90" Height="110" HorizontalAlignment="Left" VerticalAlignment="Bottom"
                        Margin="75 0 0 10"
                        IsRunning="False"
                        IsFault="False" />

<component:Pipeline Height="10" 
                    LiquidColor="Green"
                    Direction="1"
                    CapRadius="2"
                    Width="200"
                    VerticalAlignment="Top" Margin="207,53,805,0"/>
<component:Pipeline Height="10" 
                    LiquidColor="Red"
                    Direction="1"
                    CapRadius="2"
                    Width="200"
                    VerticalAlignment="Top" Margin="180,97,832,0"/>
<component:Pipeline Height="10" 
                    LiquidColor="Orange"
                    Direction="1"
                    CapRadius="2"
                    Width="210"
                    VerticalAlignment="Top" Margin="150,146,852,0"/>
<component:Pipeline Height="10" 
                    LiquidColor="Orange"
                    Direction="1"
                    CapRadius="2"
                    Width="150"
                    VerticalAlignment="Top" Margin="352,149,710,0">
    <component:Pipeline.RenderTransform>
        <RotateTransform Angle="-60" />
    </component:Pipeline.RenderTransform>
</component:Pipeline>
<component:Pipeline Height="10" 
                    LiquidColor="Orange"
                    Direction="1"
                    CapRadius="2"
                    Width="210"
                    VerticalAlignment="Top" Margin="429,20,573,0"/>
<component:Pipeline Height="10" 
                    LiquidColor="Orange"
                    Direction="-1"
                    CapRadius="2"
                    Width="150"
                    VerticalAlignment="Top" Margin="556,151,506,0">
    <component:Pipeline.RenderTransform>
        <RotateTransform Angle="-60" />
    </component:Pipeline.RenderTransform>
</component:Pipeline>

inet_ygssoftware

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
WPF开发冷风机组态及应用

冷风机组件开发和应用VS2022.NET6框架冷风机组件开发演示WPF主界面设计WPF主界面托板设计<Window x:Class="WpfConsolePannel.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xml
复制链接

扫一扫