How do i change the Background Color of the DROPDOWN portion of a RadDropDownList in UI for WinForms DropDownList

Curtis

73 posts

Member since:
Oct 2014

Posted 14 Dec 2017 Link to this post

Hi folks - I know this same question has been asked several times and each time was extremely helpful except every solution I've seen so far ONLY deals with the "Textbox" region of a RadDropDownList.

What I want to do is change the Border Color (if there is one) AND the background color (Fillcolor?) of JUST the dropdown.

You can see my "FromThis.png" and "ToThis.png" attachments to see far more clearly what I'm talking about.

Thanks again in advance everyone!

-Curtis

Dess | Tech Support Engineer, Sr.

Admin

4170 posts

Posted 15 Dec 2017 Link to this post

Hello, Curtis,

Thank you for writing.

In order to customize the popup's fill and border you can use the following code snippet:

this.radDropDownList1.ListElement.BackColor = Color.DarkGray;

this.radDropDownList1.ListElement.DrawFill = true;

this.radDropDownList1.ListElement.BorderColor = Color.Red;

this.radDropDownList1.ListElement.DrawBorder = true;

this.radDropDownList1.ListElement.BorderWidth = 2;

I hope this information helps. Should you have further questions I would be glad to help.

Regards,
Dess
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.

Curtis

73 posts

Member since:
Oct 2014

Posted 18 Dec 2017 in reply to Dess | Tech Support Engineer, Sr. Link to this post

Thank you Dess!

This was exactly what I was looking for...hopefully another few months and i'll know all of the "insides" of these controls and won't have to rely on the kindness of others - hopefully it'll be me answering a few questions :)

Kindest regards,

Curtis.

Dess | Tech Support Engineer, Sr.

Admin

4170 posts

Posted 19 Dec 2017 Link to this post

Hello, Curtis,

Thank you for writing.

I am glad that the provided code snippet was useful. Please do not hesitate to write back if you have any further questions. I will be glad to help.

Regards,
Dess
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.

james

27 posts

Member since:
Aug 2014

Posted 08 Aug 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

Hi,

How do I change the text area background color? Not the dropdown backcolor but the text area backcolor?

Thank You

drpDown.png

Dess | Tech Support Engineer, Sr.

Admin

4170 posts

Posted 09 Aug 2018 Link to this post

Hello, James,

If you need to set the back color for the editable part in RadDropDownList, it is necessary to set just the RadDropDownList.BackColor property:

this.radDropDownList1.BackColor = Color.Red;

I hope this information helps. If you have any additional questions, please let me know.

Regards,
Dess
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.

james

27 posts

Member since:
Aug 2014

Posted 09 Aug 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

Dess,

That's not working for me, perhaps the Skin(Outllook) or the page css is overriding?

James

Dess | Tech Support Engineer, Sr.

Admin

4170 posts

Posted 10 Aug 2018 Link to this post

Hello, James,

I would like to note that this forum is related to RadDropDownList form the Telerik UI for WinForms suite. However, I suppose that you are using some of our web products since you use CSS. Feel free to post your technical questions in the relevant forum: https://www.telerik.com/forums

Thank you for your understanding.

Regards,
Dess
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.

Ian

21 posts

Member since:
Dec 2015

Posted 06 Dec 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

Thanks for the reply. It helped me to get the background of my DDLB correct, but whilst trying every combination of colors to get this bit right, I now have a darker-colored border around my text (see image).

Where - in the 'Edit UI Elements' pages can I set the color of this? Setting it a runtime in the code is not a good solution for me: too many places to add the same code. And I also find your style builder VERY complicated....

Thanks

ddlb.png

Dess | Tech Support Engineer, Sr.

Admin

4170 posts

Posted 10 Dec 2018 Link to this post

Hello, Ian,

According to the provided brief description, it is not clear enough how you customize the RadDropDownList control. However, I suppose that the DropDownListElement.TextBox.ShowBorder property is set to true on your end. Make sure that it is set to false on your end. I have attached my sample project for your reference.

I hope this information helps. If you need any further assistance please don't hesitate to contact me.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.

1144986-DDLstyle.zip

Deasun

35 posts

Member since:
May 2019

Posted 31 May 2019 in reply to Dess | Tech Support Engineer, Sr. Link to this post

Good morning,

I have a very similar issue.

I am trying to set the background color of the individual items in the dropdown based on business rules.

Currently trying to use: objDDL.ListElement.BackColor = Color.FromName(strColorIs);

But it appears this sets the background for the dropdown area.

Is there a way to do each items background?

Example one could be white another Green and another Orange.

This is a winforms Telerik.WinControls.UI.RadDropDownListElement object.

Thanks

Deasun.

Deasun

35 posts

Member since:
May 2019

Posted 31 May 2019 in reply to Deasun Link to this post

I found: ddlBillingProcesses_VisualItemFormatting

And it does seem to allow me to change each items background. :)

But it seems to fire off anytime the dropdown is clicked on.

I only need to do this once or or after each databind is redone.

Dess | Tech Support Engineer, Sr.

Admin

4170 posts

Posted 03 Jun 2019 Link to this post

Hello, Deasun,

As you have already found out, items appearance in RadDropDownList can be customized by making use of the VisualListItemFormatting event. By using this event to customize the items appearance, you should always provide an else clause, where you reset the appearance settings which you have introduced. This is necessary since RadDropDownList uses data virtualization, which might lead to unpredictable appearance results when items are being reused.

Have in mind that it is absolutely normal that the VisualListItemFormatting event is fired a lot of times. Due to the UI virtualization of the visual elements, this event ensures that the proper style will be applied to the items.

I hope this information helps. If you need any further assistance please don't hesitate to contact me.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.

Deasun

35 posts

Member since:
May 2019

Posted 04 Jun 2019 in reply to Dess | Tech Support Engineer, Sr. Link to this post

Thanks.

Got it working the way I wanted at last.