zoukankan      html  css  js  c++  java
  • HslControls组件库 工业控件库 曲线控件 时间控件 管道控件 温度计控件 阀门控件 传送带控件 进度条控件 电池控件 数码管控件等等

    本篇博客主要对 HslControls 组件做一个大概的总览介绍,更详细的内容可以参照页面里的子链接,还有github上的源代码,然后进行相关的学习,和使用。

     
    联系作者及加群方式(激活码在群里发放):http://www.hslcommunication.cn/Cooperation 

    Prepare


    先从nuget下载到组件,然后就可以使用组件里的各种组件信息了。

    在Visual Studio 中的NuGet管理器中可以下载安装,也可以直接在NuGet控制台输入下面的指令安装:

    Install-Package HslControls
    

      

    NuGet安装教程  http://www.cnblogs.com/dathlin/p/7705014.html

    Demo


    有一个demo程序可以下载,地址为 demo.zip

    所支持的控件信息如下:

    demo

    Use


    正常安装完成后,就会在组件库出现下面的控件内容,然后可以拖动使用,如果没有出现列表,就需要把dll文件拖动到工具箱就行。

    常用控件


    先上图:

    pic1

    1. 圆角按钮,主要是有一个圆角的效果,和自带的按钮基本差不多,还带有一个 Selected 属性,用于获取或设置按钮是否处于选中状态。

    2. HslPlay 控件,有点像一个播放器,各种颜色可调,需要注意的是有个事件 OnPlayChanged  当播放状态改变的时候,就会触发(比onclick事件要好)。

    3. 开关控件,主要实现两个状态的切换,上面有个属性可以设置文本 SwitchStatusDescription = "关;开";  用分号区别即可,也有个事件OnSwitchChanged可以用来做状态的改变。

    进度条控件


     先上图

    pic2

    特性支持,属性如下:

    共有两种进度条的样式,一个是矩形的,一个是圆角的。都可以设置,背景色,前景色,是否使用动画效果。动画的速度都可以设置。也可以竖着的控件摆放样式

    信号灯控件


    先上图

    pic3

    支持纯色的信号灯,和渐变色的信号灯,当然,我们可以设置任意的颜色,根据自己的需求进行设计。

    数码管控件


    先上图

    pic4

    BackColor  就是整个LED的背景

    DisplayBackColor 就是数据吗数字的背景

    DisplayNumber  就是数码管显示的位数

    DisplayText  就是最终显示的文本

    ForeColor 就是最终显示文本的前景色

    LedNumberSize  就是数码管单个显示的粗细

    我们可以随意拖动数码管的大小,然后设置显示的数据量大小,颜色,粗细等等细节。一般所有的参数调整好后,我们使用 DisplayText  赋值就行。

    时钟控件


    先上图

    pic6

    主要的属性如下

    ClockBackColor  就是时钟控件中间的背景色。

    ForeColor  就是所有的文本的颜色

    HourColor  就是小时那根针的颜色

    IsSecondStep  设置秒针是否一秒一秒走动还是连续走动。

    MiniteColor 就是分钟的那根针的颜色

    SecondColor 就是秒针的颜色

    Text  就是在时钟上显示的额外的信息

    曲线控件


     高级的历史曲线控件的使用参照另一篇博客 https://www.cnblogs.com/dathlin/p/10291327.html,这里是实时控件。

    曲线控件比较麻烦一点,无法通过直接的配置添加曲线,需要代码来实现显示的逻辑功能,先上图

    pic7

     

    在使用前,先进行一些基本的设置信息,

    IntervalAbscissaText  指示纵向的虚线方向的分割点数,如果为100,那就是每隔100个像素点绘制一条虚线

    IsAbscissaStrech 如果设置为true,那么曲线就占满整个控件,比如强制这个曲线控件显示100个点,而无关控件的宽度。如果设置为true,那么控件显示的点数信息,将取决于控件的宽度界面。

    IsRenderDashLine 是否显示虚线的辅助线。

    IsRenderRightCoordinate 是否显示右侧的坐标轴

    StrechDataCountMax   当IsAbscissaStrech 为true的时候,曲线控件强制规定的显示数据点数。这时候和控件无关。

    TextAddFormat  获取或设置实时数据新增时文本相对应于时间的格式化字符串,默认HH:mm

    Title   曲线控件显示的标题

    ValueMaxLeft  左侧坐标轴的最大值

    ValueMinLeft 左侧坐标轴的最小值

    ValueMaxRight 右侧坐标轴的最大值

    ValueMinRight  右侧坐标轴的最小值

    ValueSegment 获取或设置图形的纵轴分段数

    使用说明,先定义一个获取随机数据的方法

            private float[] GetRandomData( int length, int max )
            {
                float[] buffer = new float[length];
                for (int i = 0; i < buffer.Length; i++)
                {
                    buffer[i] = random.Next( max );
                }
                return buffer;
            }
    

      

    简单的设置固定的曲线

    hslCurve1.SetCurveText( new string[] { "一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二" } );
    hslCurve1.SetLeftCurve( "A", GetRandomData( 12, 100 ), Color.Blue );

    曲线标注:

                hslCurve1.SetCurveText( new string[] { "一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二" } );
                hslCurve1.SetLeftCurve( "A", GetRandomData( 12, 100 ), Color.Blue );
                hslCurve1.AddMarkText( new HslControls.HslMarkText( )
                {
                    Index = 2,
                    CurveKey = "A",
                    MarkText = "很给力"
                } );
                hslCurve1.AddMarkText( new HslControls.HslMarkText( )
                {
                    Index = 5,
                    CurveKey = "A",
                    MarkText = "不太行了",
                    TextBrush = Brushes.Red
                } );

    标注的效果如下:

    如果你想要显示一个实时的曲线信息,就要分两步走,先预设定曲线的基本信息,关键字,颜色,宽度,是否平滑等等信息

                hslCurve5.SetLeftCurve( "A", null, Color.DodgerBlue, true );
                hslCurve5.SetLeftCurve( "B", null, Color.DarkOrange, true );
                hslCurve5.SetLeftCurve( "C", null, Color.LimeGreen, true );
    

    此处的例子就是设置了三条曲线,数据为空,颜色,和平滑效果

    然后你实时读取到数据后,增加进曲线就行了。

    hslCurve5.AddCurveData(
                    new string[] { "A", "B", "C" },
                    new float[]
                    {
                        random1*10 + 80,
                        random2*20+50,
                        random2*30,
                    }
                );
    

    此处需要注意的是,如果你有三条曲线,就需要三条一起新增。

    当然,本曲线控件支持双坐标,多曲线的显示情况。更多的信息,参照demo的源代码来开发。

    仪表盘控件


    上图

    pic8

     这个是旧版的仪表盘,如下:

    相关的属性点击属性标签就会在下方显示出来。

    新版的如下:

    pic9

    管道控件


    上图

    pic10

    直接拖出来的控件是横向的,如果想要拐角,需要设置属性

    左端点和右端点的属性设置

    瓶子控件


     上图

    pic11

    饼图控件


    上图

    pic13

    传送带控件


    上图

    pic14

    传送带滚筒


    pic16

    温度计控件


    如图

    pic18

    鼓风机控件


    如图:

    pic19

    阀门控件


    pic20

    电池控件


    pic22

    分类器控件


    pic23

  • 相关阅读:
    软件实施工程师是一个什么样的工作?他的具体工作内容是什么?发展前景怎样?
    做金融(基金、证券)方面的软件实施工程师有没有发展前途?职业发展空间如何。
    做软件实施工程师的一点建议
    系统实施工程师主要工作职则
    软件实施工程师
    UE编辑器编译和运行java设置
    猜数字
    猜数字
    Problem G
    Problem G
  • 原文地址:https://www.cnblogs.com/dathlin/p/10226072.html
Copyright © 2011-2022 走看看