Grouping column headers

9 posts, 0 answers
  1. Jason Maronge
    Jason Maronge avatar
    322 posts
    Member since:
    Jan 2005

    Posted 31 Mar 2010 Link to this post

    I need to create a time sheet and was wondering if the RadGridView supported a header like I have in the attached file.   Implementing the actual data part of the grid is easy to do,  what I need help with is creating the day headers.


    Thanks,

    Jason
  2. Jason Maronge
    Jason Maronge avatar
    322 posts
    Member since:
    Jan 2005

    Posted 31 Mar 2010 Link to this post

    I have found a way to do this in the windows grid view, but I am not sure how or even if it can be changed to work on the RadGridView.  All needs to be done is a project created with a form and a data grid view.  Here is the link if anyone wants to check it out.

    http://social.msdn.microsoft.com/Forums/en-US/winformsdatacontrols/thread/87004d70-482a-4b86-ba18-371670254b6a/

    namespace Sample5 
        public partial class DgvColumnHeaderMerge : Form 
        { 
            public DgvColumnHeaderMerge() 
            { 
                InitializeComponent(); 
            } 
     
            private void DgvColumnHeaderMerge_Load(object sender, EventArgs e) 
            { 
                this.dataGridView1.Columns.Add("JanWin""Win"); 
                this.dataGridView1.Columns.Add("JanLoss""Loss"); 
                this.dataGridView1.Columns.Add("FebWin""Win"); 
                this.dataGridView1.Columns.Add("FebLoss""Loss"); 
                this.dataGridView1.Columns.Add("MarWin""Win"); 
                this.dataGridView1.Columns.Add("MarLoss""Loss"); 
                this.dataGridView1.Columns.Add("AprWin""Win"); 
                this.dataGridView1.Columns.Add("AprLoss""Loss"); 
                this.dataGridView1.Columns.Add("MayWin""Win"); 
                this.dataGridView1.Columns.Add("MayLoss""Loss"); 
     
                for (int j = 0; j < this.dataGridView1.ColumnCount; j++) 
                { 
                    this.dataGridView1.Columns[j].Width = 45; 
                } 
     
                this.dataGridView1.ColumnHeadersHeightSizeMode = DataGridViewColumnHeadersHeightSizeMode.EnableResizing; 
     
                this.dataGridView1.ColumnHeadersHeight = this.dataGridView1.ColumnHeadersHeight * 2; 
     
                this.dataGridView1.ColumnHeadersDefaultCellStyle.Alignment = DataGridViewContentAlignment.BottomCenter; 
     
                this.dataGridView1.CellPainting += new DataGridViewCellPaintingEventHandler(dataGridView1_CellPainting); 
     
                this.dataGridView1.Paint += new PaintEventHandler(dataGridView1_Paint); 
     
                 this.dataGridView1.Scroll += new ScrollEventHandler(dataGridView1_Scroll); 
     
                this.dataGridView1.ColumnWidthChanged += new DataGridViewColumnEventHandler(dataGridView1_ColumnWidthChanged); 
     
            } 
     
            void dataGridView1_ColumnWidthChanged(object sender, DataGridViewColumnEventArgs e) 
            { 
                Rectangle rtHeader = this.dataGridView1.DisplayRectangle; 
                rtHeader.Height = this.dataGridView1.ColumnHeadersHeight / 2; 
                this.dataGridView1.Invalidate(rtHeader); 
            } 
     
            void dataGridView1_Scroll(object sender, ScrollEventArgs e) 
            { 
                Rectangle rtHeader = this.dataGridView1.DisplayRectangle; 
                rtHeader.Height = this.dataGridView1.ColumnHeadersHeight / 2; 
                this.dataGridView1.Invalidate(rtHeader); 
            } 
     
            void dataGridView1_Paint(object sender, PaintEventArgs e) 
            { 
     
                string[] monthes = { "January""February""March","April" ,"May"}; 
                for (int j = 0; j < 10;) 
                { 
                    Rectangle r1 = this.dataGridView1.GetCellDisplayRectangle(j, -1,true); 
                    int w2 = this.dataGridView1.GetCellDisplayRectangle(j + 1, -1, true).Width; 
                    r1.X += 1; 
                    r1.Y += 1; 
                    r1.Width = r1.Width + w2 - 2; 
                    r1.Height = r1.Height / 2 - 2; 
                    e.Graphics.FillRectangle(new SolidBrush(this.dataGridView1.ColumnHeadersDefaultCellStyle.BackColor), r1); 
     
                    StringFormat format = new StringFormat(); 
                    format.Alignment = StringAlignment.Center; 
                    format.LineAlignment = StringAlignment.Center; 
                    e.Graphics.DrawString(monthes[j/2], 
                        this.dataGridView1.ColumnHeadersDefaultCellStyle.Font, 
                        new SolidBrush(this.dataGridView1.ColumnHeadersDefaultCellStyle.ForeColor), 
                        r1, 
                        format); 
     
                    j += 2; 
                } 
            } 
     
            void dataGridView1_CellPainting(object sender, DataGridViewCellPaintingEventArgs e) 
            { 
                if (e.RowIndex == -1 && e.ColumnIndex > -1) 
                { 
                    Rectangle r2 = e.CellBounds; 
                    r2.Y += e.CellBounds.Height / 2; 
                    r2.Height = e.CellBounds.Height / 2; 
                    e.PaintBackground(r2, true);              
                    e.PaintContent(r2); 
                    e.Handled = true
                } 
     
            } 
     
        } 
     

  3. Svett
    Admin
    Svett avatar
    728 posts

    Posted 07 Apr 2010 Link to this post

    Hello Jason Maronge,

    Thank you for supplied code snippet.

    You can use View Definitions feature of the grid and especially Column Groups View. You can read more about it in this documentation article. Also you can see Grid Views sample in the supplied examples. You can find it under Columns menu of the grid example.

    Do not hesitate to write us back if you need assistance.

    Greetings,
    Svett
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  4. Jason Maronge
    Jason Maronge avatar
    322 posts
    Member since:
    Jan 2005

    Posted 12 Apr 2010 Link to this post

    I have gotten the grid to look right, but by doing this it stops all the GridViewDateTimeColumns editing from working.  Does this only support GridViewDataColumn's?

    Jason
  5. Jason Maronge
    Jason Maronge avatar
    322 posts
    Member since:
    Jan 2005

    Posted 12 Apr 2010 Link to this post

    I figured it out.  Had one of those special moments :)

    Jason
  6. David Simmonds
    David Simmonds avatar
    56 posts
    Member since:
    Mar 2010

    Posted 16 Feb 2012 Link to this post

    I have done as the documentation article suggested but the text is not wrapping. The WrapText property is set to true but still it is flat. Everything works fine if I do not set the ViewDefinition. That is, I do not use column grouping. Please advise.

    ViewInfo[] views = new ViewInfo[] 
        new ViewInfo("", new String[] { "CONTROL_TYPE", "TAGNUMBER", "SUPPLYVOLTAGE"
                                        "PHASES", "TOTALAMPS" }),
        new ViewInfo("Power Coordinates", new String[] { "EAST", "NORTH", "ELEVATION" }),
        new ViewInfo("", new String[] { "AREA", "BUILDING", "SKID_TAG", "WRAPPER"
                                        "HEAT_TRACE_CONTROLLER_NO", "SKID_TYPE", "ZONENUMBER"
                                        "PHASE", "CIRCUIT_BREAKER", "DISTANCE" }),
    };
    ColumnGroupsViewDefinition view = new ColumnGroupsViewDefinition();
    int nGroup = 0;
    foreach (ViewInfo vi in views)
    {
        view.ColumnGroups.Add(new GridViewColumnGroup(vi.GroupHeader));
        view.ColumnGroups[nGroup].Rows.Add(new GridViewColumnGroupRow());
        foreach (String strColumnHeader in vi.ColumnHeaders)
        {
            GridViewDataColumn column = this.radGridView1.Columns[strColumnHeader];
            view.ColumnGroups[nGroup].Rows[0].Columns.Add(column);
        }
        nGroup++;
    }
    radGridView1.ViewDefinition = view;
  7. Svett
    Admin
    Svett avatar
    728 posts

    Posted 21 Feb 2012 Link to this post

    Hi David,

    We know about this limitation. It will be addressed in one of the next releases. In the meantime, I cannot offer you any alternative due to complexity of the layout when this view definition is used.

    All the best,
    Svett
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  8. Doug
    Doug avatar
    10 posts
    Member since:
    Dec 2011

    Posted 10 Apr 2012 Link to this post

    I am having the same problem. The WrapText in combination with the AutoSizeRows property works perfectly when the grid is not using a ViewDefinition to group columns. However, once a view definition is applied, these properties seem to be ignored.

    I am using v.2012.1.12.215. Are there any estimates on when a resolution for this will be released?
  9. Svett
    Admin
    Svett avatar
    728 posts

    Posted 11 Apr 2012 Link to this post

    Hello Doug, 

    I am not able to give you an exact time frame for this case. If many customers require it, we will increase its priority in our task list. You can vote for this feature here.

    All the best,
    Svett
    the Telerik team
    RadControls for WinForms Q1'12 release is now live! Check out what's new or download a free trial >>
Back to Top