This is a migrated thread and some comments may be shown as answers.

RadPageViewContentAreaElement

5 Answers 69 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Simon
Top achievements
Rank 1
Simon asked on 24 Jul 2018, 01:25 PM

Hi,

I'm working with a RadGridView to show dynamically some event come on my app. The RadGridView use a GridViewTemplate to show some children events and the relation is made with a GridViewRelation.
I do some tests to try to customize the display on the event ViewCellFormatting but I still have problem on the RadPageViewStripElement where like on the sample because I cannot remove the Yellow line (define on the RadPageViewContentAreaElement).

I would like know if it's possible to remove this yellow line?

 

private void GridView_ViewCellFormatting(object sender, CellFormattingEventArgs e)
        {
            GridDetailViewCellElement childCell = e.CellElement as GridDetailViewCellElement;
            GridGroupExpanderCellElement expanderCell = e.CellElement as GridGroupExpanderCellElement;
 
            if (childCell != null)
            {
                childCell.Padding = Padding.Empty;
                 
                RadPageViewStripElement stripElement = childCell.PageViewElement as RadPageViewStripElement;
                if (stripElement != null)
                {
                    stripElement.DrawBorder = false;
                    stripElement.Padding = Padding.Empty;
                     
                    RadPageViewContentAreaElement contentArea = stripElement.ContentArea as RadPageViewContentAreaElement;
                    contentArea.DrawBorder = false;
                    contentArea.BackColor = Color.Yellow;
                    contentArea.Padding = Padding.Empty;
 
                    foreach (RadPageViewItem item in stripElement.Items)
                    {
                        item.Size = new Size(0, 1);
                        item.Visibility = ElementVisibility.Hidden;
                        item.DrawBorder = false;
                    }
                }
                 
            }
          
            else if ((expanderCell != null) && (expanderCell.RowElement is GridDataRowElement))
            {
                expanderCell.Expander.Visibility = ElementVisibility.Hidden;
            }
        }

5 Answers, 1 is accepted

Sort by
0
Hristo
Telerik team
answered on 25 Jul 2018, 09:28 AM
Hi Simon,

Thank you for writing.

I see in your code snippet that you have an explicit setting of the BackColor to Yellow. If this is not intended you can delete it. I am assuming that you might need to have at one point the back color changed to yellow and for the most of the time have it with its default color. Depending on your actual scenario, please consider resetting the color this way: 
contentArea.ResetValue(LightVisualElement.BackColorProperty, ValueResetFlags.Local);

Generally speaking due to the virtualization in the grid you should always reset any customizations made in the formatting events for elements which will not need these customizations. You can refer to the following articles in our documentation for additional information: 
I hope this helps. Should you have further questions please do not hesitate to write back.

Regards,
Hristo
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Simon
Top achievements
Rank 1
answered on 25 Jul 2018, 09:37 AM

Hi Hristo,

Thanks for your reply.

But my problem is not about the color but about the space used by this line. I would like delete the space used by the yellow line.

I used the yellow color for example to highlight the line that I want delete.

Regards,

Simon

0
Hristo
Telerik team
answered on 25 Jul 2018, 10:58 AM
Hi Simon,

The content area is measured with a bigger size compared to the grid table element which is its first child. You can hide the remaining area marked in yellow in your screenshot by applying a negative bottom padding, e.g. like this: 
contentArea.Padding = new Padding(0, 0, 0, -3);

I hope this helps.

Regards,
Hristo
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Simon
Top achievements
Rank 1
answered on 26 Jul 2018, 06:39 AM

Hi Hristo,

Thanks for your help but it looks like this solution doesn't work. I'm trying it but I still have the line space.

Regards,

Simon

0
Hristo
Telerik team
answered on 26 Jul 2018, 07:33 AM
Hello Simon,

I tested a sample hierarchical grid with the setting applied in your initial code snippet. Additionally, I have also added the padding setting: 
private void RadGridView1_ViewCellFormatting(object sender, CellFormattingEventArgs e)
{
    GridDetailViewCellElement childCell = e.CellElement as GridDetailViewCellElement;
    GridGroupExpanderCellElement expanderCell = e.CellElement as GridGroupExpanderCellElement;
 
    if (childCell != null)
    {
        childCell.Padding = Padding.Empty;
 
        RadPageViewStripElement stripElement = childCell.PageViewElement as RadPageViewStripElement;
        if (stripElement != null)
        {
            stripElement.DrawBorder = false;
            stripElement.Padding = Padding.Empty;
 
            RadPageViewContentAreaElement contentArea = stripElement.ContentArea as RadPageViewContentAreaElement;
            contentArea.DrawBorder = false;
            contentArea.BackColor = Color.Yellow;
            contentArea.Padding = new Padding(0, 0, 0, -3);
 
            foreach (RadPageViewItem item in stripElement.Items)
            {
                item.Size = new Size(0, 1);
                item.Visibility = ElementVisibility.Hidden;
                item.DrawBorder = false;
            }
        }
    }
 
    if ((expanderCell != null) && (expanderCell.RowElement is GridDataRowElement))
    {
        //expanderCell.Expander.Visibility = ElementVisibility.Hidden;
    }
}

I am also attaching a screenshot showing the result on my end. Please also note that these settings might be affected by the theme in your actual project. If you would like us to look into it, you can open a support ticket and send it over.

Regards,
Hristo
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
GridView
Asked by
Simon
Top achievements
Rank 1
Answers by
Hristo
Telerik team
Simon
Top achievements
Rank 1
Share this question
or