Custom cell merged

Question

I need to display data in gridview with merged rows for some columns. the original data from database like:

please help me to display gridview like:

• for column transaksi merged by tgl
• for column priority , price , creted by merged by transaksi

Using C#, how can I prepare a gridview for the format? Please help me.

Answer 1

I just picked response posted on this topic and added one line to achieve what you want.

bool IsTheSameCellValue(int column, int row)
{
    // To compare only values on 1st and 2nd column (TGL, TRANSAKSI)
    if (column > 1) return false;

    DataGridViewCell cell1 = dataGridView[column, row];
    DataGridViewCell cell2 = dataGridView[column, row - 1];
    if (cell1.Value == null || cell2.Value == null)
    {
        return false;
    }
    return cell1.Value.ToString() == cell2.Value.ToString();
}

private void dataGridView_CellPainting(object sender, DataGridViewCellPaintingEventArgs e)
{
    e.AdvancedBorderStyle.Bottom = DataGridViewAdvancedCellBorderStyle.None;
    if (e.RowIndex < 1 || e.ColumnIndex < 0)
        return;
    if (IsTheSameCellValue(e.ColumnIndex, e.RowIndex))
    {
        e.AdvancedBorderStyle.Top = DataGridViewAdvancedCellBorderStyle.None;
    }
    else
    {
        e.AdvancedBorderStyle.Top = dataGridView.AdvancedCellBorderStyle.Top;
    }
}

private void dataGridView_CellFormatting(object sender, DataGridViewCellFormattingEventArgs e)
{
    if (e.RowIndex == 0)
        return;
    if (IsTheSameCellValue(e.ColumnIndex, e.RowIndex))
    {
        e.Value = "";
        e.FormattingApplied = true;
    }
}

However it's impossible to center text vertically in merged cells with this solution because it only erases the borders and not totally redraw the component.

Answer 2

I suggest you to go through documentation - Tutorial: Cell Merging

To implement custom cell merge use the GridView.CellMerge event handler. First, check if the correct column is being processed. Then, obtain display texts for the two cells being compared. Finally, indicate that cells are to be merged if their display texts match. Set the CellMergeEventArgs.Handled parameter to true to override the grid's default processing for this column.

Example:

using DevExpress.XtraGrid.Views.Grid;
// ... 
private void gridView1_CellMerge(object sender, DevExpress.XtraGrid.Views.Grid.CellMergeEventArgs e) {
    GridView view = sender as GridView;
    if(view == null) return;
    if (e.Column == colCreatorID) {
        string text1 = view.GetRowCellDisplayText(e.RowHandle1, colCreatorID);
        string text2 = view.GetRowCellDisplayText(e.RowHandle2, colCreatorID);
        e.Merge = (text1 == text2);
        e.Handled = true;
    }
}

Use your own conditions while processing a column. for example take transaksi 005, In this case check values of row 5 and 6 then compare column created by for equality depends upon your condition set the e.Merge to true.