Visual Style Builder & Grid

1 Answer 89 Views
GridView
Jure
Top achievements
Rank 2
Iron
Iron
Iron
Jure asked on 13 Oct 2022, 08:19 AM

Hi.

Is it possible to hide the "Add new row" row from the grid in Visual Style Builder? Or turn on/off other properties as well or hide some columns? It's distracting to see all possible columns when you want to see the clean, basic version of the grid. 

For example, this is the applied theme in the app (header and filter row):

and this in the VSB:

And particularly, for example, right now I'm trying to figure out how to increase the space/border/thin line (or change color) between the header and filter row. I can see it's white and about 1px in the app but no matter which "border" setting I change I can't seem to affect the final result.

Jure

 

1 Answer, 1 is accepted

Sort by
0
Accepted
Dess | Tech Support Engineer, Principal
Telerik team
answered on 13 Oct 2022, 01:48 PM
Hello, Jure,  


The AllowAddNewRow  property controls whether the grid will show the new row:
https://docs.telerik.com/devtools/winforms/controls/gridview/rows/new-row

In Visual Style Builder you may access the RadGridView's properties by using the RadControlSpy tool like this:

Thus, you can disable the EnableFiltering property or any other property that controls the visibility of the system rows.

As to the question about the thin border, I am not sure which border exactly you need to customize. Could you please provide a screenshot with the marked zone you need to customize? Thus, we would get better understanding of the precise case and provide further assistance. Thank you in advance.

I am looking forward to your reply.

Regards,
Dess | Tech Support Engineer, Principal
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Jure
Top achievements
Rank 2
Iron
Iron
Iron
commented on 13 Oct 2022, 02:01 PM

Thanks, that was helpful.

I'm referring to this line:

Dess | Tech Support Engineer, Principal
Telerik team
commented on 14 Oct 2022, 09:01 AM

Thank you for the provided screenshot. I am not sure whether this is a custom theme or some of the default themes, but the white line is expected to be a style defined for the header row element. This is how the Fluent theme is styled:

Jure
Top achievements
Rank 2
Iron
Iron
Iron
commented on 14 Oct 2022, 12:55 PM

OK, thank you. I'd prefer if I could set the bottom margin (which doesn't seem to have any effect) because the border "eats" into the element - here I set the width to 23 to be more obvious:

Is it possible?

Also, is there a difference when I apply the change via Control Spy vs. if I select the element from the control tree on the left?

Dess | Tech Support Engineer, Principal
Telerik team
commented on 14 Oct 2022, 01:59 PM

Jure, the spy tool allows you to have a quick preview of any style changes. If you want to customize the theme, it is necessary to apply the settings in Visual Style Builder by selecting the desired element on the left tree structure. It is possible to apply bottom Padding to the header cell element:

Jure
Top achievements
Rank 2
Iron
Iron
Iron
commented on 14 Oct 2022, 03:39 PM

No, the padding doesn't do it. I want to have a space between the HeaderRow and FilterRow, without touching the padding and border of those two. But anyway, I'll go with BottomBorder of the HeaderRow for now. Thanks for helping!
Dess | Tech Support Engineer, Principal
Telerik team
commented on 17 Oct 2022, 04:49 AM

Hi, Jure, If the Padding doesn't achieve the required result on your end, I would recommend you to submit a support ticket and provide the .tssp file of the custom theme you have. Thus, we would be able to have a look at the applied settings and provide further assistance with achieving the desired spacing between the header and filter wo. 
Jure
Top achievements
Rank 2
Iron
Iron
Iron
commented on 17 Oct 2022, 12:10 PM

Dess, the border is fine for now. But here's another mystery: GridDataRowElement.HotTracking. I just want to change the text color. I've copied the MarkerForeColor repository item to MarkerForeColor2 and changed it to white, yet the text remains black when I go over a row. I'm using my own custom theme but here's a screenshot of modifying the original Fluent theme:

Dess | Tech Support Engineer, Principal
Telerik team
commented on 18 Oct 2022, 01:47 PM

Jure, the ForeColor is usually defined at cell level. Since it may be very tricky to achieve it in VisualStyleBuilder, I would suggest you a better solution with just a few lines of code.

The attached gif file illustrates the result:

    Private Sub RadGridView1_CellFormatting(sender As Object, e As Telerik.WinControls.UI.CellFormattingEventArgs) Handles RadGridView1.CellFormatting
        e.CellElement.SetThemeValueOverride(LightVisualElement.ForeColorProperty, Color.Red, "HotTracking")  
    End Sub

 

Jure
Top achievements
Rank 2
Iron
Iron
Iron
commented on 19 Oct 2022, 09:51 AM

OK, this works, thanks...
Tags
GridView
Asked by
Jure
Top achievements
Rank 2
Iron
Iron
Iron
Answers by
Dess | Tech Support Engineer, Principal
Telerik team
Share this question
or