zoukankan      html  css  js  c++  java
  • wpf研究之道——datagrid控件及样式

        一、datagrid继承体系

        “想要说些什么 又不知从何说起”,每当想要写一些关于wpf的文章,总是沉思良久,怕自己写不好。今天我想要说的是wpf中datagrid控件。我们先来看看它在整个类的层次结构:

                                                                       

                                          图1  wpf                                                                                                                    图1.1  winform

      wpf和winform顺便作个比较,看看Control之上的结构:

                                                                               

         

                                       图2  wpf                                                                                                                      图2.2  winform

            从以上四幅图中,可以看出wpf的继承层次深一些。wpf中的DispatcherObject,用于控制UI界面的修改,在多线程场景下,如果其它线程需要修改界面,就需要调用它。如:

      this.Dispatcher.BeginInvoke(DispatcherPriority.Normal,委托)

          1、 每个wpf对象都可以调用到Dispatcher对象,从继承图上可以出看出来。Dispatcher对象把委托加入到内部的执行队列中,然后根据优先级,在不同的时间内,由UI线程执行。通过查阅相关资料,一个Dispatcher对象关联了一个UI线程,相反一个UI线程可能拥有多个Dispatcher对象。

          2、winform中的MarshalByRefObject,它允许Control对象跨进程被调用。

     二、datagrid样式

     <!--dataGrid通用样式-->
        <Style TargetType="DataGrid">
            <!--网格线颜色-->
            <Setter Property="CanUserResizeColumns" Value="True"/>
            <Setter Property="Background" Value="#edf2f8" />
            <Setter Property="AlternationCount" Value="2" />
    
            <Setter Property="BorderBrush" Value="#d8e6f3" />
    
            <Setter Property="HorizontalGridLinesBrush">
                <Setter.Value>
                    <SolidColorBrush Color="#d8e6f3"/>
                </Setter.Value>
            </Setter>
    
            <Setter Property="VerticalGridLinesBrush" Value="{x:Null}"/>
        </Style>
    dataGrid通用样式
       <Style TargetType="DataGridColumnHeader" x:Key="ColumnBaseStyle">
    
            <Setter Property="SnapsToDevicePixels" Value="True" />
            <Setter Property="MinHeight" Value="40" />
            <Setter Property="Foreground" Value="#323433" />
            <Setter Property="FontSize" Value="13" />
            <Setter Property="FontWeight" Value="Bold" />
            <Setter Property="Cursor" Value="Hand" />
            <Setter Property="Height" Value="40"/>
    
            <Setter Property="HorizontalContentAlignment" Value="Left" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
    
            <Setter Property="IsTabStop" Value="False" />
            <Setter Property="BorderBrush" Value="#d9e5f3"/>
            <Setter Property="BorderThickness" Value="0 0 1 0"/>
            <Setter Property="Padding" Value="5 0"/>
    
        </Style>
    DatagridColumnHeader样式
     <!--标题栏样式-->
        <Style TargetType="DataGridColumnHeader" BasedOn="{StaticResource ColumnBaseStyle}">
        </Style>
    标题栏样式
     <!--行样式触发-->
        <Style  TargetType="DataGridRow">
            <Setter Property="Background" Value="White" />
            <Setter Property="Height" Value="40"/>
            <Setter Property="Foreground" Value="Black" />
    
    
            <Style.Triggers>
                <!--隔行变色-->
                <Trigger Property="ItemsControl.AlternationIndex"
                             Value="0">
                    <Setter Property="Background" Value="#edf2f8" />
                </Trigger>
                <Trigger Property="ItemsControl.AlternationIndex"
                             Value="1">
                    <Setter Property="Background" Value="White" />
                </Trigger>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="#cde7ff"/>
                </Trigger>
    
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Foreground" Value="Black"/>
                    <Setter Property="Background" Value="#cde7ff"/>
                </Trigger>
    
            </Style.Triggers>
        </Style>
    DataGridRow样式
        <Style TargetType="DataGridCell" x:Key="CellBaseStyle">
            <Setter Property="Padding" Value="5 0"/>
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Foreground" Value="Black"/>
                    <Setter Property="Background" Value="#cde7ff"/>
                </Trigger>
            </Style.Triggers>
        </Style>
        <!--单元格样式触发-->
        <Style TargetType="DataGridCell" BasedOn="{StaticResource CellBaseStyle}">
    
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="DataGridCell">
                        <Border Background="{TemplateBinding Background}" SnapsToDevicePixels="True" BorderThickness="0" Height="{TemplateBinding Tag}">
                            <TextBlock
                    ToolTip="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Content.Text}"
                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                    HorizontalAlignment="Left"
                    VerticalAlignment="Center"
                    Margin="{TemplateBinding Padding}"
                    Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Content.Text}"
                    TextTrimming="CharacterEllipsis"
                    />
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    
        <ControlTemplate x:Key="DataGridCheckboxCellControlTemplate1" TargetType="{x:Type DataGridCell}">
            <Border
                      BorderBrush="{TemplateBinding BorderBrush}"
                      BorderThickness="{TemplateBinding BorderThickness}"
                      Background="{TemplateBinding Background}"
                      SnapsToDevicePixels="True">
                <ContentPresenter 
                          ContentTemplate="{TemplateBinding ContentTemplate}"
                          Content="{TemplateBinding Content}"
                          ContentStringFormat="{TemplateBinding ContentStringFormat}"
                          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
            </Border>
        </ControlTemplate>
    DataGridCell样式
        <Style TargetType="DataGridColumnHeader" x:Key="documentColumnHead" BasedOn="{StaticResource ColumnBaseStyle}">
            <Setter Property="HorizontalContentAlignment" Value="Left" />
        </Style>
    
        <Style TargetType="DataGridCell" x:Key="documentCellStyle" BasedOn="{StaticResource CellBaseStyle}">
    
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="DataGridCell">
                        <Border Background="{TemplateBinding Background}" SnapsToDevicePixels="True" BorderThickness="0" Height="{TemplateBinding Tag}">
                            <TextBlock
                    ToolTip="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Content.Text}"
                    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                    HorizontalAlignment="Left"
                    VerticalAlignment="Center"
                    Margin="{TemplateBinding Padding}"
                    
                    Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Content.Text}"
                    TextTrimming="CharacterEllipsis"
                    />
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
    
        </Style>
    
    
        <Style TargetType="DataGridCell" x:Key="resultCellStyle" BasedOn="{StaticResource CellBaseStyle}">
    
            <Setter Property="BorderThickness" Value="0"/>
        </Style>
    
    
    
        <Style TargetType="DataGridCell" x:Key="OperCellStyle" BasedOn="{StaticResource CellBaseStyle}">
    
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="DataGridCell">
    
                        <ContentPresenter HorizontalAlignment="Left" VerticalAlignment="Center"/>
    
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
    
        </Style>
    
    
        <!--checkbox列头样式和列单元格样式-->
        <Style x:Key="DataGridCheckboxCellStyle1" TargetType="{x:Type DataGridCell}">
            <Setter Property="ContentTemplate" Value="{DynamicResource CheckboxDataTemplate1}"/>
            <Setter Property="Template" Value="{DynamicResource DataGridCheckboxCellControlTemplate1}"/>
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Background" Value="{x:Null}"/>
                    <Setter Property="BorderBrush" Value="{x:Null}"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    
        <Style x:Key="DataGridCheckboxColumnHeaderStyle1" TargetType="{x:Type DataGridColumnHeader}">
            <Setter Property="Padding" Value="13 0 0 0"/>
            <Setter Property="Background" Value="White"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="ContentTemplate" Value="{DynamicResource CheckboxDataTemplate1}"/>
            <Setter Property="HorizontalAlignment" Value="Stretch"/>
            <Setter Property="VerticalAlignment" Value="Stretch"/>
        </Style>
    特殊列头和单元格样式
     <DataTemplate x:Key="CheckboxDataTemplate1">
                <Grid>
    
                    <CheckBox x:Name="chkSelected"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            VerticalContentAlignment="Center"
                            Click="chkSelected_OnClick"
                            IsThreeState="False"
                            IsChecked="{Binding IsSelected, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                            />
    
                </Grid>
            </DataTemplate>
    CheckboxDataTemplate

    从datagrid、DataGridColumnHeader、DataGridRow、DataGridCell到特殊的列,如Checkbox列样式是层层递进,越来越精细,一个样式可以采用BaseOn继承父样式。

    1、ControlTemplate

         通过ControlTemplate控制控件的外观,比如我可以让一个button长成这样:        通过设置Template的值,而设定ControlTemplate。wpf  UI中有两棵树,一个是visualTree(可视树),另一个是logicTree(逻辑树)。如果你在vs中,快速监视某一个控件的话,就可以显示出它的可视树。ControlTemplate所描述的控件内部结构正是属于可视树的范畴。那什么是逻辑树呢?就是你在代码中看到的控件组成的一棵树。显然,可视树包含了逻

    辑树。你可以认为可视树是对一个控件的精细描述。比如,我们说,一个人是由眼睛、鼻子、耳朵等等构成,这种描述就是属于逻辑树,至于对眼睛、鼻子、耳朵的内部构造描述,这属于可视树。

    2、DataTemplate

    数据模板,它用来控制对象在控件上的绑定。

    这是一个checkbox列头的数据绑定,绑定了对象的IsSelected属性。

     3、触发器

         当一个单元格被选中的时候,它的前景色和背景色的变化。隔行变色的实现。下面是按钮的触发器,当鼠标经过和按下的时候,样式变化。

  • 相关阅读:
    两种代理模式(JDK和Cglib)实例
    打印1到最大的n位数
    二叉树的构建以及先中后序遍历
    二维数组的查找
    斐波那契递归和非递归俩种算法实例
    淘宝tairKV分布式
    OSI七层模型详解
    Spring事务配置的五种方式
    linux中cat、more、less、tail、head命令的区别
    跨域的理解与实现
  • 原文地址:https://www.cnblogs.com/wangqiang3311/p/8677803.html
Copyright © 2011-2022 走看看