WPF DataGrid自定义样式模板 列表头分隔线 滚动条滑块大小设定 动态数据绑定和更新

[ 效果图回去放,代码在后面 ]

WPF DataGrid自定义样式模板 列表头分隔线 滚动条滑块大小设定 动态数据绑定和更新_第1张图片

[ 用到的一些定义如果没有附代码可以随便写个看下效果,因为直接从项目中copy出来的,难免漏掉点点... ]


首先,有几点需要注意:

1.表头样式 [ DataGridColumnHeader ]  

默认带分割线,但每列表头左右分割线都占1px,也就是说假如有三列:

a.  表格最左、右边应该不需要分割线,但默认的有1px

b.  中间需要1px分割线,但默认有2px(相邻两表头分别都有1px)

==>自定义样式使用margin控制,保证表格左右边无分割线,相邻分隔线1px

2.滚动条 [ ScrollBar ]

①结构构成参看:  https://www.cnblogs.com/cody1988/p/wpf_ScrollBar.html

②这里由于项目中表格数据会很多,所以设置垂直方向滚动条的滑块固定尺寸(长30px),避免数据刷出太多导致滚动条太窄点不中,

通过这个属性设定,这样滑块尺寸就不会通过数据数目来计算确定滑块长度。

③同时,由于固定了滑块大小,界面上表格垂直滚动条可见的情况(VerticalScrollBarVisibility="Visible"),滚动条滚动不可用的时候,滑块会固定在滚动条下方,这个通过设定触发器,保证不可滚动的时候滑块隐藏不可见。



代码区域


ps:这里用到Themes主题,可以不管这个,其实真正设定到分割线的,也就只有DataGridHeaderBorder控件,
但自带的属性SeparatorVisibility没有作用,因为默认就是左右都1px宽度的线,不符合我想要的效果,

[ BorderThickness="1,0,1,1" Margin="-1,0" ] 这两个设定的显示效果1px分割,表格左右两边不需显示分割线了。

因此这个可以自己画样式,不用Themes主体。

另外的两个Thumb是用来用户手动调整列宽用的。


    


设定了多项属性,不明白的可以上msdn上查解释意思

CellStyle设置单元格样式,像文本居左还是居右显示,都该设置在这里,设置RowStyle没有作用!

DataGridColumnHeadersPresenter  表头

ScrollContentPresenter  内容显示区域

ScrollBar x:Name="PART_VerticalScrollBar"  垂直方向滚动条

ScrollBar x:Name="PART_HorizontalScrollBar"   水平方向滚动条


    
            
        
        
            
                
                    
                        
                            
                                
                                    
                                        
                                            
                                            
                                            
                                        
                                        
                                            
                                            
                                            
                                        
                                        


做出来的效果是垂直滚动条和水平滚动条按钮都是61*61尺寸的,但由于这两个滚动条在项目中有时候会单独使用,因此做了边框,为了和主体DataGrid表格显示兼容,通过margin设置布局,宽度设置为60,实际61哈,以"Grid x:Name="Bg""里的内容为准。

滚动条构成: 可参看:  https://www.cnblogs.com/cody1988/p/wpf_ScrollBar.html

                     上下按钮 RepeatButton,  中间部分 Track。

                     Track又由: 向上空白区域 Track.DecreaseRepeatButton  RepeatButton

                                         滑块 Track.Thumb  Thumb

                                         向下空白区域 Track.IncreaseRepeatButton      RepeatButton

这里滚动条滑块不采用自动计算尺寸的方式,写了最小长度,保证数据再多用户也可以拖动响应

ViewportSize="NaN"      +       MinHeight="30"

同样,不需要这样设置的,想滑块长度根据显示数据占百分比来设置,去掉上两个设定就可以


    



    

设置差不多了,交给界面使用吧

是界面动态绑定的后台数据,绑定的属性是{Binding File_ID} 对应 File_ID。

后台可以通过 dgv_No2.ItemsSource = m_screen_sort_order;实现绑定,这样界面就会自动更新为这个数据带的信息,前提是绑定元 m_screen_sort_order 带了属性 { File_ID, Lot_No, Exp_Date },如果没有也可以后台定义类( get; set; )进行类型转换赋值,这个就多看看网上的资料动态绑定啦!

补充一点:

一般对于存数据的控件,如DataGrid,后台绑定可以用 .ItemsSource,也可以用 .DataContext

一般控件要绑定数据到界面的话,可以用 .DataContext。

设定某个属性的绑定的话,可以 dgv_No2.SetBinding(DataGrid.FontSizeProperty, selected_fontsize); 这种写法

更新界面数据,比如表格增删数据

    a. 可以更新绑定元,然后 .ItemsSource / .DataContext .Clear(); //清空绑定  再重新设定绑定

    b.想要直接更新表格,比如dgv_No2.Items.RemoveAt( index );  //由于有绑定元,不能直接操作界面控件,只能更新绑定元的内容  m_screen_sort_order.RemoveAt( index ),再更新绑定(步骤a.)。


          
                   
                   
                   
          



有问题或者建议,欢迎提出来哈,写的太仓促了...

你可能感兴趣的:(WPF)