DevExpress:范围选择控件RangeControl使用

DevExpress:范围选择控件RangeControl使用

    • 一、控件样式
    • 二、常用操作
      • 1.数据绑定
      • 2.外观属性
        • Selection Type
        • ShowLabels
        • ShowZoomScrollBar
      • 3.控件方向
      • 4.最小间隔
    • 三、使用效果

在图表类软件开发时,会遇到折线图显示范围过长的情况。RangeControl控件可以轻松地对图形显示区域进行范围选择,可以更加直观地对图线趋势、细节进行显示。

此篇为项目开发中的使用总结,DevExpress的版本为15.1,RangeControl控件绑定在了ChartControl曲线图控件上。

一、控件样式

将RangeControl控件拖入到窗体内,会出现一个新的的RangeControl控件。RangeControl控件的样式会随着绑定的控件进行显示。
在这里插入图片描述
项目中,将RangeControl(下)控件绑定在了ChartControl(上)曲线图控件上。DevExpress:范围选择控件RangeControl使用_第1张图片
DevExpress的官方说明页,将RangeControl(上)控件绑定在了SchedulerControl(下)控件上。
DevExpress:范围选择控件RangeControl使用_第2张图片

二、常用操作

1.数据绑定

单击选中RangeControl控件,在属性中找到Client,绑定ChartControl控件。项目中ChartControl的name属性为chartControl,可根据自己的开发需求绑定对应的控件。
DevExpress:范围选择控件RangeControl使用_第3张图片

2.外观属性

属性 设置
Selection Type Thumb/Flag/ThumbAndFlag
ShowLabels True/False
ShowZoomScrollBar True/False

Selection Type

使用SelectionType属性,可以指定最终用户使用鼠标选择数据范围以及是否显示指示绑定值的标志的模式。
DevExpress:范围选择控件RangeControl使用_第4张图片

ShowLabels

使用ShowLabels属性可隐藏刻度和标签,默认情况下可见。
DevExpress:范围选择控件RangeControl使用_第5张图片

ShowZoomScrollBar

用户使用鼠标滚动和缩放RangeControl的可见范围。
DevExpress:范围选择控件RangeControl使用_第6张图片

3.控件方向

通过选择Orientation的属性Vertical/Horizontal,设置RangeControl的方向为竖直还是水平。
DevExpress:范围选择控件RangeControl使用_第7张图片

4.最小间隔

默认拖入的控件存在最小的可视范围,无法继续缩小范围。DevExpress:范围选择控件RangeControl使用_第8张图片
可通过设置ChartControl中XYDiagram中的属性,将其更改为ChartGrid可以调节任意大小。注意选中的是ChartControl内圈中的XYDiagram,并非ChartControl。
DevExpress:范围选择控件RangeControl使用_第9张图片
更改后的效果:
DevExpress:范围选择控件RangeControl使用_第10张图片

三、使用效果

你可能感兴趣的:(C#开发笔记,c#,devexpress,数据可视化,视图设计)