2X faster development
The ultimate WPF UI toolkit to boost your development speed.
|
MouseOverBackground color of SfRadialMenuItem can be changed by MenuMouseOverBackground property. To enable the background color, ShowMouseOverStyle property of SfRadialMenuItem need to set to True. The same has been explained in the following code example: XAML:<Window x:Class="SfRadialMenuItem_New.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:navigation="clr-namespace:Syncfusion.Windows.Controls.Navigation;assembly=Syncfusion.SfRadialMenu.Wpf" Title="MainWindow" Height="350" Width="525"> <Grid x:Name="Grid1"> <navigation:SfRadialMenu x:Name="_Radialmenu"> <navigation:SfRadialMenuItem Header="MenuItem1" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="Red" /> <navigation:SfRadialMenuItem Header="MenuItem2" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="Yellow" /> <navigation:SfRadialMenuItem Header="MenuItem3" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="Green" /> <navigation:SfRadialMenuItem Header="MenuItem4" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="Brown"/> <navigation:SfRadialMenuItem Header="MenuItem5" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="BlueViolet" /> </navigation:SfRadialMenu> </Grid> </Window>
C#:namespace SfRadialMenuItem_New
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
SfRadialMenu _Radialmenu = new SfRadialMenu();
SfRadialMenuItem Item1 = new SfRadialMenuItem();
Item1.Header = "MenuItem1";
Item1.ShowMouseOverStyle = true;
Item1.MenuMouseOverBackgroundColor = Brushes.Red;
SfRadialMenuItem Item2 = new SfRadialMenuItem();
Item2.Header = "MenuItem2";
Item2.ShowMouseOverStyle = true;
Item2.MenuMouseOverBackgroundColor = Brushes.Yellow;
SfRadialMenuItem Item3 = new SfRadialMenuItem();
Item3.Header = "MenuItem3";
Item3.ShowMouseOverStyle = true;
Item3.MenuMouseOverBackgroundColor = Brushes.Green;
SfRadialMenuItem Item4 = new SfRadialMenuItem();
Item4.Header = "MenuItem4";
Item4.ShowMouseOverStyle = true;
Item4.MenuMouseOverBackgroundColor = Brushes.Brown;
SfRadialMenuItem Item5 = new SfRadialMenuItem();
Item5.Header = "MenuItem5";
Item5.ShowMouseOverStyle = true;
Item5.MenuMouseOverBackgroundColor = Brushes.BlueViolet;
_Radialmenu.Items.Add(Item1);
_Radialmenu.Items.Add(Item2);
_Radialmenu.Items.Add(Item3);
_Radialmenu.Items.Add(Item4);
_Radialmenu.Items.Add(Item5);
Grid1.Children.Add(_Radialmenu);
}
}
}
Output: |
2X faster development
The ultimate WPF UI toolkit to boost your development speed.
This page will automatically be redirected to the sign-in page in 10 seconds.
You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.
How to set MouseOverBackgroundColor for the SfRadialMenuItem by using data binding (e.g: ItemsSource="{Binding Options}")
It has been achieved by keeping the collection of SfRadialMenuItem through ViewModel with setting each radial menu item color as per in below code snippet
Code Snippet:
XAML:
C#: public class ViewModel { private ObservableCollection collection;
public ObservableCollection Collection
{
get { return collection; }
set { collection = value; }
}
public ViewModel()
{
collection = new ObservableCollection();
collection.Add(new SfRadialMenuItem() { MenuMouseOverBackgroundColor = Brushes.Brown, ShowMouseOverStyle=true,Header= "Item 1" });
collection.Add(new SfRadialMenuItem() { MenuMouseOverBackgroundColor = Brushes.Red, ShowMouseOverStyle=true,Header= "Item 2" });
collection.Add(new SfRadialMenuItem() { MenuMouseOverBackgroundColor = Brushes.Blue, ShowMouseOverStyle=true,Header= "Item 3" });
collection.Add(new SfRadialMenuItem() { MenuMouseOverBackgroundColor = Brushes.Yellow, ShowMouseOverStyle=true,Header= "Item 4" });
collection.Add(new SfRadialMenuItem() { MenuMouseOverBackgroundColor = Brushes.Violet, ShowMouseOverStyle=true,Header= "Item 5" });
} }
Sample Link:
https://www.syncfusion.com/downloads/support/directtrac/general/ze/RadialMenu_Sample1731828336
It seems to work only if the mouse is over the header-label? Is there a way to make it work for the whole menu-item?