DevExpress中GridControl的使用筆記


主要參考連接:DevExpress GridControl控件使用html


Content

  • [Level 1:基本](#Level 1:基本)
  • [Level 2:列名](#Level 2:列名)
  • [Level 3:格式化顯示](#Level 3:格式化顯示)
  • [Level 4:自定義顯示](#Level 4:自定義顯示)
  • [Level 5:分組](#Level 5:分組)
  • [Level 6:彙總](#Level 6:彙總)
  • [Level 7:顯示行號](#Level 7:顯示行號)
  • [Level 8:點擊事件](#Level 8:點擊事件)
  • [Level 9:自定義繪製](#Level 9:自定義繪製)
  • [Level 10:Cell中的控](#Level 10:Cell中的控)
  • [Level 11:BandedGridView](#Level 11:BandedGridView)
  • [Level 12:Cell中的控件2](#Level 12:Cell中的控件2)
  • [Level 13:主從表(分層表)](#Level 13:主從表(分層表))

Level 1:基本

代碼:java

private void Form1_Load(object sender, EventArgs e) {
            BindDataSource(InitDt());
        }
        
        private DataTable InitDt() {
            DataTable dt = new DataTable("我的簡歷");
            dt.Columns.Add("id", typeof(int));
            dt.Columns.Add("name", typeof(string));
            dt.Columns.Add("sex", typeof(int));
            dt.Columns.Add("address", typeof(string));
            dt.Columns.Add("aihao", typeof(string));
            dt.Columns.Add("phone", typeof(string));
       
            dt.Rows.Add(new object[] { 1, "張三", 1, "東大街6號", "看書", "12345678910"});
            dt.Rows.Add(new object[] { 1, "王五", 0, "西大街2號", "上網,遊戲", "" });
            dt.Rows.Add(new object[] { 1, "李四", 1, "南大街3號", "上網,逛街", "" });
            dt.Rows.Add(new object[] { 1, "錢八", 0, "北大街5號", "上網,逛街,看書,遊戲", "" });
            dt.Rows.Add(new object[] { 1, "趙九", 1, "中大街1號", "看書,逛街,遊戲", ""});
            return dt;
        }

        private void BindDataSource(DataTable dt) {
            //綁定DataTable 
            gridControl1.DataSource = dt;
        }

效果:ide

 
1.png

Level 2:列名

設置:ui

 
2.png

效果:spa

 
3.png

Level 3:格式化顯示

代碼:.net

private DataTable InitDt() {
                DataTable dt = new DataTable("我的簡歷");
                 dt.Columns.Add("id", typeof(int));
                dt.Columns.Add("name", typeof(string));
                dt.Columns.Add("sex", typeof(int));
                dt.Columns.Add("address", typeof(string));
                dt.Columns.Add("aihao", typeof(string));
                dt.Columns.Add("phone", typeof(string));

                dt.Columns.Add("data", typeof(decimal));
                dt.Columns.Add("time", typeof(DateTime));
                dt.Columns.Add("custom", typeof(string));
           
                dt.Rows.Add(new object[] { 1, "張三", 1, "東大街6號", "看書", "12345678910",12,"2018/4/26","data"});
                dt.Rows.Add(new object[] { 1, "王五", 0, "西大街2號", "上網,遊戲", "12315", 23333, "2018/4/26", "test" });
                dt.Rows.Add(new object[] { 1, "李四", 1, "南大街3號", "上網,逛街", "", 12.345, "2018/4/26", "" });
                dt.Rows.Add(new object[] { 1, "錢八", 0, "北大街5號", "上網,逛街,看書,遊戲", "", 0.123, "2018/4/26", "" });
                dt.Rows.Add(new object[] { 1, "趙九", 1, "中大街1號", "看書,逛街,遊戲", "", 3.1415926, "2018/4/26", "" });
                return dt;
            }

設置:3d


 
5.png

 
6.png

 
7.png

效果:code


 
4.png

Tips:orm

一、gridControl的每一列原始數據是Value,可是顯示數據是 DisplayText,默認DisplayText的值便是Value經過DisplayFormat轉換以後的值。htm

二、 gridControl下的事件通常是包含表格GridView切換,點擊,更改的事件,用的很少;每個GridView下的事件包含行列處理,菜單顯示,分組排序等事件,咱們經常使用。(全部在使用事件時,必定要明確是control事件仍是view事件)

Level 4:自定義顯示

代碼:

private void gridView1_CustomColumnDisplayText(object sender, DevExpress.XtraGrid.Views.Base.CustomColumnDisplayTextEventArgs e) {
            if (e.Column.FieldName == "sex")
            {
                switch (e.Value.ToString().Trim())
                {
                    case "1":
                        e.DisplayText = "男";
                        break;
                    case "0":
                        e.DisplayText = "女";
                        break;
                    default:
                        e.DisplayText = "";
                        break;
                }}  
        }
 
8.png

效果:


 
9.png

Level 5:分組

按照性別進行分組:


 
10.png

效果:


 
11.png

Level 6:彙總

設置:

一、顯示面板

 
12.png

二、彙總項設置

 
13.png

效果:


 
14.png

Level 7:顯示行號

設置:

 
15.png

代碼:

 
16.png

效果:

 
17.png

Level 8:點擊事件

 
18.png
private void gridView1_RowCellClick(object sender, DevExpress.XtraGrid.Views.Grid.RowCellClickEventArgs e) {
            if (e.Button == MouseButtons.Left)
            {
                Console.WriteLine("Button:MouseButtons.Left");
            }

            if (e.Clicks == 2)
            {
                Console.WriteLine("Clicks:2");
            }

            if (e.Delta > 0)
            {
                Console.WriteLine("Delta > 0");
            }

            if (e.X > 0 && e.Y >0)
            {
                Console.WriteLine("Pos:({0},{1})",e.X,e.Y);
            }

            if (e.RowHandle > 0)
            {
                Console.WriteLine("Row:{0}",e.RowHandle);
            }

            if (e.CellValue != null)
            {
                Console.WriteLine("CellValue:{0}",e.CellValue);
            }

            if (e.Column != null)
            {
                Console.WriteLine("Column:{0}",e.Column.ToString());
            }

        }

Level 9:自定義繪製

代碼:

 
19.png
private void gridView1_CustomDrawCell(object sender, DevExpress.XtraGrid.Views.Base.RowCellCustomDrawEventArgs e) {
            if (e.Column.FieldName.Equals("data"))
            {
                GridCellInfo cellInfo = e.Cell as GridCellInfo;
                if (cellInfo.IsDataCell )
                {
                    if (double.Parse(cellInfo.CellValue.ToString()) < 1)
                    {
                        e.Appearance.BackColor = Color.OrangeRed;
                    }
                    else if (double.Parse(cellInfo.CellValue.ToString()) < 100)
                    {
                        e.Appearance.BackColor = Color.YellowGreen;
                    }
                    else
                    {
                        e.Appearance.BackColor = Color.Gold;}
                }
            }
        }

效果:

 
20.png

Level 10:Cell中的控件

設置:

 
21.png

點開ColumnEdit選項,設置選中時數據的類型和值,還可設置灰色和未選中狀態的數據。

 
23.png

效果:

 
22.png

Level 11:BandedGridView

轉換爲BandedGridView:

 
25.png

設置Bands:

 
26.png

效果:


 
24.png

Level 12:Cell中的控件2

A一、添加按鈕控件

一、新增一個無綁定的列

 
27.png

二、ColumnEdit選擇repositoryItemButtonEdit

 
28.png

 

三、選擇Button項


 
29.png

四、添加新項,修改Caption,並選擇Kind爲Glyph

 
30.png

五、修改TestEditStyle爲HideTextEditor

 
31.png

 

六、選擇In-place Editor Repository,找到新添加的按鈕,選擇ButtonClick事件

 
32.png

 

七、代碼

private void repositoryItemButtonEdit1_ButtonClick(object sender, DevExpress.XtraEditors.Controls.ButtonPressedEventArgs e) {
            Console.WriteLine("Row:{0},Index:{1}", gridView1.GetFocusedDataSourceRowIndex(), e.Button.Index);

            if (e.Button.Index == 0)//刪除按鈕
            {
                table.Rows.RemoveAt(gridView1.GetFocusedDataSourceRowIndex());
            }
            else//編輯按鈕
            {
                MessageBox.Show("編輯 Index:" + e.Button.Index);

            }

        }

效果:


 
33.png

A二、另外一種按鈕控件

和上一種方式同樣,主要區別爲:

* 選擇一個綁定了數據的列
  • 只添加一個按鈕
  • 並選擇TestEditStyle爲DisableTextEditor
     
    35.png

效果:


 
34.png

A三、各類彈出選項框:

參考:DEVEXPRESS GRIDVIEW 代碼添加按鈕

Level 13:主從表(分層表)

待續......

=

 

 

 

 

 

 

 

 

 

 

出處:https://www.jianshu.com/p/badc1d2f0841

相關文章
相關標籤/搜索