DevExpress WPF控件记录

时间：2021-12-11 20:22:47

以下是博主用到DevExpress WPF控件时的一些记录笔记:

1、Canvas控件：Canvas控件的背景色一定要设置(background="Transparent"),不然用代码在画布上画图会看不到效果

2、ScrollViewer控件：滚动条控件，当某个控件没有HorizontalScrollbarVisibility和VerticalScrollbarVisibility属性
来显示滚动条的时候，把该控件放在ScrollViewer控件中，只要该控件的高度超过ScrollViewer控件的高度就会自动出现
滚动条，例如：
<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" Name="scroll">
   <Canvas Name="cvFlow1" Background="Transparent"/>
</ScrollViewer>

3、ChartControl控件：图表控件，用该控件可以画折线、点状、饼状、柱状的2D和3D图。
示例：折线图
<dxc:ChartControl Name="chartControl1" Height="200">
                <dxc:ChartControl.Titles>
                    <dxc:Title Content="CPU" />
                </dxc:ChartControl.Titles>
                <dxc:XYDiagram2D>
                        <dxc:XYDiagram2D.AxisX>
                            <dxc:AxisX2D  GridLinesVisible="True" DateTimeMeasureUnit="Second" DateTimeGridAlignment="Second" x:Name="cpuAxisX"
                                                          GridSpacing="10">
                                <dxc:AxisX2D.DateTimeOptions>
                                    <dxc:DateTimeOptions Format="Custom" FormatString="HH:mm:ss" />
                                </dxc:AxisX2D.DateTimeOptions>
                            </dxc:AxisX2D>
                        </dxc:XYDiagram2D.AxisX>
                        <dxc:XYDiagram2D.AxisY>
                            <dxc:AxisY2D GridLinesVisible="True">
                                <dxc:AxisY2D.Range>
                                    <dxc:AxisRange MinValue="0" MaxValue="20" Name="cpuRange"/>
                                </dxc:AxisY2D.Range>
                            </dxc:AxisY2D>
                        </dxc:XYDiagram2D.AxisY>
                        <dxc:LineStackedSeries2D  DisplayName="Series 1" Name="cpuView">
                    </dxc:LineStackedSeries2D>
                </dxc:XYDiagram2D>
            </dxc:ChartControl>
在上面的示例中X轴的坐标点显示的时间，单位是秒，每10秒一个坐标点，Y轴坐标点的范围在0-20之间

4、CheckBoX控件值的双向绑定有两种方式：

第一种：通过触发事件

前台界面代码: <CheckBox Margin="5" IsChecked="{Binding Path=IsChecked,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>

后台代码如下:

 public class DeployComponent:INotifyPropertyChanged

 {

        public bool IsChecked

        {

            get { return isChecked; }

            set {

                isChecked = value;

                OnPropertyChanged("IsChecked");

            }

        }

        public event PropertyChangedEventHandler PropertyChanged;

        private void OnPropertyChanged(string name)

        {

            PropertyChangedEventHandler handler = PropertyChanged;

            if(handler!=null)

            {

                handler(this, new PropertyChangedEventArgs(name));

            }

        }

 }

第二种： <CheckBox Margin="0,2,2,2" IsChecked="{Binding Path=Data.IsChecked,Mode=TwoWay}"></CheckBox>

　　　　  CheckBox控件所在的父控件通过设置ItemsSource绑定列表或者值

5、ProgressBarEdit：进度条控件

示例：<dxe:ProgressBarEdit ContentDisplayMode="Value" DisplayFormatString="{}{0}%"  Value="{Binding Path=Data.StepProgress,Mode=TwoWay}"></dxe:ProgressBarEdit>
上面的示例显示的进度条，该进度值后面会有一个%，并且进度值显示在进度条的正中间

6、GridControl：列表控件，DevExpress中的列表控件都会有自动排序，拖拽删除的功能，在有些项目中这些是禁止的，需要在GridControl.View里面设置属性，例如:

dxg:GridControl HorizontalAlignment="Left" Name="gridControl1" VerticalAlignment="Top"

                                             Height="" Margin="5,5,5,5" MouseDoubleClick="gridControl1_MouseDoubleClick">

                                        <dxg:GridControl.Columns>

                                            <dxg:GridColumn FieldName="Name" Header="容器名称"/>

                                            <dxg:GridColumn FieldName="CList" Header="组件列表" />

                                        </dxg:GridControl.Columns>

                                        <dxg:GridControl.View>

                                            <dxg:CardView Name="tableView1" CardTemplate="{StaticResource lbeTemplate}" ShowGroupPanel="False"

                                                          IsColumnMenuEnabled="False" AllowColumnFiltering="False" AllowColumnMoving="False">

                                                <dxg:CardView.CardHeaderTemplate>

                                                    <DataTemplate>

                                                        <StackPanel Orientation="Horizontal">

                                                            <CheckBox Margin="0,2,2,2" IsChecked="{Binding Path=Data.IsChecked,Mode=TwoWay}"></CheckBox>

                                                            <Label Content="{Binding Path=Data.Name}" HorizontalAlignment="Center"/>

                                                        </StackPanel>

                                                    </DataTemplate>

                                                </dxg:CardView.CardHeaderTemplate>

                                            </dxg:CardView>

                                        </dxg:GridControl.View>

</dxg:GridControl>

上面示例中的IsColumnMenuEnabled="False"表示在列标头不显示右键菜单，AllowColumnFiltering="False"：不允许排序，AllowColumnMoving="False"：不能拖拽列表控件

相关文章