Category / Section
How to set the MouseOverBackgroundColor for SfRadialMenuItem?
1 min read
The SfRadialMenuItem MouseOver background color can be set using MenuMouseOverBackgroundColor property. To enable the SfRadialMenuItem MouseOver background color, ShowMouseOverStyle property should set to True. The same has been explained in the following code example:
XAML:
<Page x:Class="WinRT_KB_Application.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:WinRT_KB_Application" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:navigation="using:Syncfusion.UI.Xaml.Controls.Navigation" mc:Ignorable="d"> <Grid x:Name="Grid1" Background="White"> <navigation:SfRadialMenu RimBackground="Purple"> <navigation:SfRadialMenuItem Header="Menu1" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="Red"/> <navigation:SfRadialMenuItem Header="Menu2" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="Blue"/> <navigation:SfRadialMenuItem Header="Menu3" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="Green"/> <navigation:SfRadialMenuItem Header="Menu4" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="Green"/> <navigation:SfRadialMenuItem Header="Menu6" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="Green"/> <navigation:SfRadialMenuItem Header="Menu7" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="Green"/> <navigation:SfRadialMenuItem Header="Menu8" ShowMouseOverStyle="True" MenuMouseOverBackgroundColor="Green"/> </navigation:SfRadialMenu> </Grid> </Page>
C#:
using Syncfusion.UI.Xaml.Controls; using Windows.UI; // The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238 namespace WinRT_KB_Application { /// <summary> /// An empty page that can be used on its own or navigated to within a Frame. /// </summary> public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); SfRadialMenu _RadialMenu = new SfRadialMenu(); _RadialMenu.RimBackground = new SolidColorBrush() { Color = Colors.Purple }; SfRadialMenuItem Item1 = new SfRadialMenuItem(); Item1.Header = "Menu1"; Item1.MenuMouseOverBackgroundColor = new SolidColorBrush() { Color = Colors.Brown }; Item1.ShowMouseOverStyle = true; SfRadialMenuItem Item2 = new SfRadialMenuItem(); Item2.Header = "Menu2"; Item2.MenuMouseOverBackgroundColor = new SolidColorBrush() { Color = Colors.Red }; Item2.ShowMouseOverStyle = true; SfRadialMenuItem Item3 = new SfRadialMenuItem(); Item3.Header = "Menu3"; Item3.MenuMouseOverBackgroundColor = new SolidColorBrush() { Color = Colors.Blue }; Item3.ShowMouseOverStyle = true; SfRadialMenuItem Item4 = new SfRadialMenuItem(); Item4.Header = "Menu4"; Item4.MenuMouseOverBackgroundColor = new SolidColorBrush() { Color = Colors.Pink }; Item4.ShowMouseOverStyle = true; SfRadialMenuItem Item5 = new SfRadialMenuItem(); Item5.Header = "Menu5"; Item5.MenuMouseOverBackgroundColor = new SolidColorBrush() { Color = Colors.Orange }; Item5.ShowMouseOverStyle = true; SfRadialMenuItem Item6 = new SfRadialMenuItem(); Item6.Header = "Menu6"; Item6.MenuMouseOverBackgroundColor = new SolidColorBrush() { Color = Colors.DarkBlue }; Item6.ShowMouseOverStyle = true; SfRadialMenuItem Item7 = new SfRadialMenuItem(); Item7.Header = "Menu7"; Item7.MenuMouseOverBackgroundColor = new SolidColorBrush() { Color = Colors.Violet }; Item7.ShowMouseOverStyle = true; SfRadialMenuItem Item8 = new SfRadialMenuItem(); Item8.Header = "Menu8"; Item8.MenuMouseOverBackgroundColor = new SolidColorBrush() { Color = Colors.Green }; Item8.ShowMouseOverStyle = true; _RadialMenu.Items.Add(Item1); _RadialMenu.Items.Add(Item2); _RadialMenu.Items.Add(Item3); _RadialMenu.Items.Add(Item4); _RadialMenu.Items.Add(Item5); _RadialMenu.Items.Add(Item6); _RadialMenu.Items.Add(Item7); _RadialMenu.Items.Add(Item8); Grid1.Children.Add(_RadialMenu); } /// <summary> /// Invoked when this page is about to be displayed in a Frame. /// </summary> /// <param name="e">Event data that describes how this page was reached. The Parameter /// property is typically used to configure the page.</param> protected override void OnNavigatedTo(NavigationEventArgs e) { } } }