GroupGridView:支持分组的DataGridView

2010-06-13T16:47:00Z

离上一次写blog已经有两年多了，惭愧惭愧。。。

前段时间开发一个记账软件记账本，需要一个类似于Outlook的邮件分组显示功能。网上找了好久也没有找到称心的，于是乎就自己动手做了一个，现在做一些简单的总结。此文章同时发布于我的独立blog: http://www.zitiger.com/

这个新的控件我把他叫做GroupGridView,主要实现了下面两个功能：

把所有数据进行分组显示
在右侧显示每个组的附加信息

对于第一个需求网上很容易找到解决方案，但这些方案不能满足第二个需求，于是我就开始创建这个GroupGridView

整个控件主要包括两个类：GroupGridView 和GroupGridGroup。

我们先来看一下GroupGridView类。GroupGridView类继承自DataGridView，为了让GroupGridView看起来像Outlook的分组显示，我们要多对DataGridView进行一些改造：

// Control when edit occurs because edit mode shouldn’t start when expanding/collapsing
this.EditMode = DataGridViewEditMode.EditProgrammatically;
// This sample does not support adding or deleting rows by the user.
// From http://www.zitiger.com/
this.AllowUserToAddRows = false;
this.AllowUserToDeleteRows = false;
 
//We do not need the row header
this.RowHeadersVisible = false;
//we only need the horizontal border line like it in outlook
this.CellBorderStyle = DataGridViewCellBorderStyle.RaisedHorizontal;
//only allow the full row select
this.SelectionMode = DataGridViewSelectionMode.FullRowSelect;

接着我们要暴露一个方法CreateGroup用来创建Group

public GroupGridGroup CreateGroup(String title, String summary)
{
    //at least one column and only fire when the first group
    if (this.Columns.Count > 0 && this.Groups.Count == 0)
    {
        //Give the enought padding for each row
        // From http://www.zitiger.com/
        Padding padding = this.Columns[0].DefaultCellStyle.Padding;
        padding.Left += 4;
        this.Columns[0].DefaultCellStyle.Padding = padding;
 
        //We do not allow to sort.
        for (int i = 0; i < this.Columns.Count; i++)
        {
            this.Columns[i].SortMode = DataGridViewColumnSortMode.NotSortable;
        }
    }
 
    GroupGridGroup group = (GroupGridGroup)this.GroupTemplate.Clone();
    group.Title = title;
    group.Summary = summary;
    group.GroupGridView = this;
 
    group.CreateCells(this, new String[] { title, summary });
    //Add the group to datagridview.rows
    //so the group can be displayed in the datagridview
    this.Rows.Add(group);
    this.Groups.Add(group);
    return group;
}

接着，我们要开始处理Group的折叠展开事件了。什么时候我们要对Group进行展开/隐藏操作呢? 通过对outlook的观察，主要是下面两种情况：

当用户双击Group行
用户点击Group的+/- 符号时

对于第一种情况，我们需要重载DataGridView的OnCellDoubleClick事件，如果用户双击的是GroupGridGroup，那么需要对这个Group的行进行折叠展开操作
软件同时发布于我的blog: http://www.zitiger.com/，转载请注明出处

protected override void OnCellDoubleClick(DataGridViewCellEventArgs e)
{
    if (e.RowIndex < 0) return;
    // From http://www.zitiger.com/
    if (Rows[e.RowIndex] is GroupGridGroup)//if the clicked row is the group
    {
        GroupGridGroup group = this.Rows[e.RowIndex] as GroupGridGroup;
 
        group.Toggle();
    }
 
    base.OnCellDoubleClick(e);
}

对于第二种情况，我们需要重载OnCellMouseDown，代码和OnCellDoubleClick相似，只不过我们需要额外判断用户点击的是否是+/-符号

// the OnCellMouseDown is overriden so the control can check to see if the
// user clicked the + or - sign of the group-row
protected override void OnCellMouseDown(DataGridViewCellMouseEventArgs e)
{
    //If use does not click on a row
    if (e.RowIndex < 0) return;
 
    // From http://www.zitiger.com/
    if (Rows[e.RowIndex] is GroupGridGroup) //if the clicked row is the group
    {
        GroupGridGroup group = this.Rows[e.RowIndex] as GroupGridGroup;
        if (IsIconHit(e)) //if the user clicked the sing + or -
        {
            group.Toggle();
        }
    }
 
    base.OnCellMouseDown(e);
}

至此，整个GroupGridView的代码我们已经剖析完成了，我们接着来看看我们的主角GroupGridGroup的实现过程。GroupGridGroup继承自DataGridView，通过重载Paint函数来绘制我们的Group。

我们需要暴露CreateRow方法，让外界可以通过GroupGridGroup.CreateRow来创建属于这个Group的Row。
软件同时发布于我的blog: http://www.zitiger.com/，转载请注明出处

public DataGridViewRow CreateRow(params Object[] values)
{
    DataGridViewRow row = this.GroupGridView.RowTemplate.Clone() as DataGridViewRow;
 
    row.CreateCells(this.GroupGridView, values);
    this.GroupGridView.Rows.Add(row);
 
    // add row to childRows
    this.childRows.Add(row);
    return row;
}

接着我们来看看如何进行折叠和展开操作

//Collapse this group, we need to hide the rows belongs to this group
public void Collapse()
{
    this.IsExpanded = false;
    //Hide all rows in this group
    foreach (DataGridViewRow row in this.childRows)
    {
        row.Visible = false;
    }
}
 
//Expand this group, we need to show the rows belongs to this group
public void Expand()
{
    this.IsExpanded = true;
    //Show all rows in this group
    foreach (DataGridViewRow row in this.childRows)
    {
        row.Visible = true;
    }
}

最后，也是最重要的任务：通过重载Paint来绘制Group。我们主要需要完成以下几步：

绘制Group的背景
绘制文字
绘制Group的底边线
绘制+ – 符号

//Override the Paint, the most important part of this control
protected override void Paint(Graphics graphics, Rectangle clipBounds, Rectangle rowBounds,
    int rowIndex, DataGridViewElementStates rowState,
    bool isFirstDisplayedRow, bool isLastVisibleRow)
{
    GroupGridView grid = (GroupGridView)this.DataGridView;
 
    // From http://www.zitiger.com/
    int gridwidth = grid.Columns.GetColumnsWidth(DataGridViewElementStates.Displayed);
    Color backgroundColor;
 
    if (this.Selected) //If it is selected
        backgroundColor = grid.DefaultCellStyle.SelectionBackColor;
    else
        backgroundColor = grid.DefaultCellStyle.BackColor;
 
    //draw the background
    using (Brush backgroundBrush = new SolidBrush(backgroundColor))
    {
        graphics.FillRectangle(backgroundBrush,
            rowBounds.Left - grid.HorizontalScrollingOffset,
            rowBounds.Top, gridwidth, rowBounds.Height - 1);
    }
 
    //draw text, using the current grid font
    Font font = new Font(this.DataGridView.Font, FontStyle.Bold);
    //Draw the title
    graphics.DrawString(this.Title, font, Brushes.Black,
                        -grid.HorizontalScrollingOffset + 23, rowBounds.Bottom - 18);
 
    //mesure the string to get the height and width of the string
    SizeF stringSize = graphics.MeasureString(this.Summary, font);
    //caculate the x of position for the Summary
    float contentX = rowBounds.X + gridwidth - stringSize.Width - 8;
    //caculate the y of position for the Summary
    float contentY = rowBounds.Y + (rowBounds.Height - stringSize.Height) / 2;
    //Draw the summary string
    graphics.DrawString(this.Summary, font, Brushes.Black, contentX, contentY);
 
    //For bottom line of group
    using (Brush bottomBrush =
        new SolidBrush(Color.FromKnownColor(KnownColor.GradientActiveCaption)))
    {
        //draw bottom line of the group
        graphics.FillRectangle(bottomBrush, rowBounds.Left + grid.HorizontalScrollingOffset
                                , rowBounds.Bottom - 2, gridwidth - 1, 2);
    }
 
    //the Rectangle for the +/- symbol
    Rectangle glyphRect = new Rectangle(rowBounds.X + 5, rowBounds.Y, 5, rowBounds.Height - 1);
 
    //Draw the + or - sign on the left of the group
    // Ensure that visual styles are supported.
    if (Application.RenderWithVisualStyles)
    { 
 
        VisualStyleRenderer glyphRenderer;
        if (this.IsExpanded)
            glyphRenderer = new VisualStyleRenderer(VisualStyleElement.TreeView.Glyph.Opened);
        else
            glyphRenderer = new VisualStyleRenderer(VisualStyleElement.TreeView.Glyph.Closed);
 
        Rectangle glyphRectangle =
            new Rectangle(glyphRect.X, glyphRect.Y + (glyphRect.Height / 2) - 4, 10, 10);
 
        // Paint group +/- glyph
        glyphRenderer.DrawBackground(graphics, glyphRectangle);
 
    }
    else //e.g. for win 2000 or classic theme in win Xp
    {
        int h = 8;
        int w = 8;
        int x = glyphRect.X;
        int y = glyphRect.Y + (glyphRect.Height / 2) - 4;
        //The below two lines will draw the box of +/- symbols
        graphics.DrawRectangle(new Pen(SystemBrushes.ControlDark), x, y, w, h);
        graphics.FillRectangle(new SolidBrush(Color.White),
            x + 1, y + 1, w - 1, h - 1);
 
        //Draw the -
        graphics.DrawLine(new Pen(new SolidBrush(Color.Black)),
            x + 2, y + 4, x + w - 2, y + 4);
 
        //Draw the |
        // From http://www.zitiger.com/
        if (!this.IsExpanded)
            graphics.DrawLine(new Pen(new SolidBrush(Color.Black)),
                x + 4, y + 2, x + 4, y + h - 2);
    }
}

这个控件的缺点是不能通过datasource进行数据绑定只能手动进行。同时发布于我的blog: http://www.zitiger.com/，转载请注明出处，同时也欢迎访问我的记账本 http://www.jzben.com

本文链接

treegridview

2009-08-06T02:51:00Z

For all those getting the error:"Unable to cast object of type 'System.Windows.Forms.DataGridViewTextBoxCell' to type 'AdvancedDataGridView.TreeGridCell'."If you legitimately want to have a textbox co...

1

2009-06-03T14:42:00Z

4、点击“下一步”，出现配置检测窗口 5、检测过程中会出现“是否要发布临时日志”窗口（如下图），一般选择“No”。 6、检测完毕之后，会出现下面的窗口，点击“完成”就配置成功了。相关链接： Windows Live Writer交流小组博客客户端MetaWeblog设置帮助 Word 2007发布博客配置步骤 Live Writer排版技巧用 Windows Live Writer...

老虎Sitemap生成器 0.5.3

2008-03-28T05:21:00Z

点击此处下载Sitemap生成器0.5.3此软件需要安装.net framework 2.0本软件可以分析您的网站并生成sitemap。您可以将生成的sitemap上传到您的网站,并通知搜索引擎(例如google)。通过设置sitemap文件可以提高您的网站对搜索引擎的亲和力，让搜索引擎更快、更全面地收录与刷新您的网站，提高您的网站在搜索引擎里的收录数量。同时本软件还可以帮您检查您网站中存在的死链...

老虎Sitemap生成器 0.5.2

2008-03-19T04:19:00Z

点击此处下载Sitemap生成器0.5.2此软件需要安装.net framework 2.0本软件可以分析您的网站并生成sitemap。您可以将生成的sitemap上传到您的网站,并通知搜索引擎(例如google)。通过设置sitemap文件可以提高您的网站对搜索引擎的亲和力，让搜索引擎更快、更全面地收录与刷新您的网站，提高您的网站在搜索引擎里的收录数量。同时本软件还可以帮您检查您网站中存在的死链...

老虎Sitemap生成器 0.3

2007-07-31T04:50:00Z

点击此处下载Sitemap生成器0.3感谢您您对老虎Sitemap生成器的支持.经过无数的汗水,0.3终于和大家见面了. 这几天杭州特别的热,老婆怀了宝宝,电脑搬到了一个没有空调的房间,写起程序来真的是汗流浃背啊!感谢支持老虎和老虎软件的朋友，特别要感谢在Blog给我留言的fire2 ,WinMain和落伍者的skycity999 ，他们对程序的功能提出了很好的建议．此软件需要安装.net f...

老虎Sitemap生成器 0.2

2007-07-19T05:09:00Z

点击此处下载Sitemap生成器0.2感谢您您对老虎Sitemap生成器的支持，经过几天的努力，Sitemap 0.2 终于完成了．0.2版本较前一版本有了很多的改进，使得程序更加易用和人性化．同时下一个版本0.3已经在设计中了，相信不久后就可以完成，到时，程序的功能将更加完善．再次感谢支持老虎和老虎软件的朋友，特别要感谢在Blog给我留言的fire2 和WinMain ，他们对程序的功能提出...

诚聘ASP.NET开发人员[杭州]

2007-07-16T12:32:00Z

代朋友发，有意者请直接联系　MSN : hejan1983@163.com QQ:11354983资深ASP.NET 程序设计师1.对于工作和技术提高有热情。 2.熟悉ASP.NET开发技术，熟悉.NET Framework，具有一定的WEB开发经验3.熟悉SQLServer数据库 4.一年以上软件开发经验。符合以下条件优先： 1。具有开发套装商业软件经验 2。熟悉HTML/CSS/JavaScr...

老虎Sitemap生成器 0.1

2007-07-16T03:44:00Z

欢迎使用老虎Sitemap生成器 0.1,此软件需要安装.net framework 2.0请关注软件更新网站：http://www.linglihu.com点击下载老虎Sitemap生成器本软件可以分析您的网站的所有网页的地址，生成一个sitemap.xml。您可以将其上传到您的网站,并通知搜索引擎(例如google)。通过设置sitemap文件可以提高您的网站对搜索引擎的亲和力，让搜索引擎更...

老虎SEO助手 0.3

2007-07-12T05:34:00Z

欢迎使用老虎SEO助手,此软件需要安装.net framework 2.0点击下载老虎SEO助手V0.3改进 20070711+增加关键词查询对雅虎的支持+增加收录数量查询功能,主要包括以下搜索引擎百度谷歌搜狗中搜有道 Live 雅虎 SoSoV0.2.5改进 20070630+增加 Google Page Rank 查询+增加 Sogou Rank 查询V0.2 改进+增加关键词查询...

博客园_Just Tiger