How to set background Color in a DropDownButton

[Shaun]

Hi,

How can I set the dropdownbutton background color to transparent?
I can get the main part of the button to be transparent, but when I hit the dropdown the backgound color is not changing.

I have tried to edit the fill primitive via the Edit IU elements but with no luck.

Cheers

Shaun

[Dess | Tech Support Engineer, Principal]

Hello Shaun,

Thank you for contacting Telerik Support.

In order to make RadDropDownButton transparent, please have a look at the following code snippet:

//action button
radDropDownButton1.DropDownButtonElement.ActionButton.ButtonFillElement.BackColor =
    Color.Transparent;
radDropDownButton1.DropDownButtonElement.ActionButton.ButtonFillElement.GradientStyle =
    Telerik.WinControls.GradientStyles.Solid;

//arrow button
radDropDownButton1.DropDownButtonElement.ArrowButton.Fill.BackColor =
    Color.Transparent;
radDropDownButton1.DropDownButtonElement.ArrowButton.Fill.GradientStyle =
    Telerik.WinControls.GradientStyles.Solid;

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

Regards,
Desislava
Telerik

[Shaun]

Hi,

Thanks for that but can I make the background of the dropdown menu items transparent too.
So in other works when you hit the dropdown button a menu list appears, its this area I want to make transparent, the area that only appear when the button is clicked.

Cheers

Shaun.

[Dess | Tech Support Engineer, Principal]

Hello Shaun,

Thank you for writing back.

In order to obtain transparent drop down menu, please have a look at the following code snippet:

//drop down menu
radDropDownButton1.DropDownButtonElement.DropDownMenu.BackColor = Color.Transparent;
RadDropDownMenuElement ddme = (RadDropDownMenuElement)radDropDownButton1.DropDownButtonElement.DropDownMenu.PopupElement;
ddme.Fill.BackColor = Color.Transparent;
ddme.LeftColumnFill.BackColor = Color.Transparent;

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

Regards,
Desislava
Telerik

[Oliver]

Hello all,

Shaun`s statement helped me to make the background of the Item-menu white:

RadDropDownMenuElement ddmeD3E = (RadDropDownMenuElement)btn_main_Strukturauswahl_Speichern.DropDownButtonElement.DropDownMenu.PopupElement;
            ddmeD3E.Fill.BackColor = Color.White;
            ddmeD3E.Fill.GradientStyle = Telerik.WinControls.GradientStyles.Solid;
            ddmeD3E.LeftColumnFill.BackColor = Color.White;
            ddmeD3E.LeftColumnFill.GradientStyle = Telerik.WinControls.GradientStyles.Solid;

Only a few detail is missing to made my solution perfekt.

Our Customer wants  to habe a black background with white text,  when he hover over an Item of the DropDownButton.
Else he wants a white background with black test.

Can you, or anyone else, help me at this task?

I can`t find a method like "Item-Mouse-Hover".

Thank`s a lot.

Kind regards
Oliver

 

[Oliver]

Hello,

 i`m closer.

I added the Item-MouseHover and Item-MouseLeave Events in the form-designer.

Now, i can react to the Hover:

    private void radMenuItem9_MouseHover(object sender, EventArgs e)

        {
            radMenuItem9.BackColor = Color.Black;
            radMenuItem9.ForeColor = Color.White;
        }
        private void radMenuItem9_MouseLeave(object sender, EventArgs e)
        {
            radMenuItem9.BackColor = Color.White;
            radMenuItem9.ForeColor = Color.Black;
        }

But the backcolor didn`t change.

I only see white text over white background.

Maybe the Hovercolor overlays the backcolor.

Die Fillcolor for the whole Itemlist is definded as white, too,

Can anyone help.

Thanks.

[Oliver]

Hi,

it`s me again.

My solution is:

Add the Mousemove and MouseLeave events manually to the form designer.

Then use:

 private void  btn_Dokument_Speichern_MouseHover(object sender, EventArgs e)
        {
            btn_Dokument_Speichern.FillPrimitive.BackColor = Color.Black;
            btn_Dokument_Speichern.ForeColor = Color.White;
        }
    
        private void btn_Dokument_Speichern_MouseLeave(object sender, EventArgs e)
        {
            btn_Dokument_Speichern.FillPrimitive.BackColor = Color.White;
            btn_Dokument_Speichern.ForeColor = Color.Black;
        }

Though the color changes lethargic.

It need a second to change the color.

If someone had a better solution don`t hesitate to post your way.

Thanks.
Oliver

 

[Dess | Tech Support Engineer, Principal]

Hello Oliver,

Thank you for writing.

It is suitable to use the MouseEnter and MouseLeave events in order to achieve the desired style. Here is a sample code snippet which result is illustrated on the attached gif file:

public Form1()
{
    InitializeComponent();

    foreach (RadMenuItem item in this.radMenuItem1.Items)
    {
        item.MouseEnter+=item_MouseEnter;
        item.MouseLeave+=item_MouseLeave;
    }
}

private void item_MouseLeave(object sender, EventArgs e)
{
    RadMenuItem item = sender as RadMenuItem;
    item.FillPrimitive.ResetValue(LightVisualElement.BackColorProperty, ValueResetFlags.Local);
    item.ResetValue(LightVisualElement.ForeColorProperty, ValueResetFlags.Local);
}

private void item_MouseEnter(object sender, EventArgs e)
{
    RadMenuItem item = sender as RadMenuItem;
    item.FillPrimitive.BackColor = Color.Black;
    item.ForeColor = Color.White;
}

Note that this thread is related to RadDropDownButton. However, it seems that your question is regarding RadMenu. I would kindly ask you to open a separate thread with the appropriate Product (RadMenu for WinForms) and to avoid mixing different subjects in the same thread in future. This will also give you the opportunity to track the different cases easily. Thank you for your understanding.

 

Regards,
Dess
Telerik

[Oliver]

Thank you Dess for the nice sample.

I`ll pimp up my sources.

Thanks a lot.

Olli