Bug in WPF user control

Bug in WPF user control - c#

I created a user control with a menu in WPF. It was working just fine and now I'm seeing a format issue with the MenuItem.Header. Basically if I add a header where the name has a "_" character it deletes it. For instance, if I add this to the header: "Test_Header_Name," it shows as: "TestHeader_Name." So basically it formats/manipulates the string and deletes the first "_" character. I know things don't just happened out of the blue. I am sure, I must have done something at some point to change the format... but I cannot figure out what it was.
Here is the C# to test the menu:
public partial class MenuControl : UserControl
{
public MenuControl()
{
InitializeComponent();
MenuItem main = new MenuItem();
main.Header = "Sum(Test_Header_Name)";
for (int i = 0; i < 10; i++)
{
main.Items.Add("Test_" + i);
}
main.Items.Add(new Separator());
main.Items.Add("Remove");
this.PrincipalMenu.Items.Add(main);
}
}
And this is the XAML (which is where I think it is happening):
<UserControl x:Class="WindowsFormsApplication1.MenuControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="41" d:DesignWidth="380">
<UserControl.Resources>
<!--**************************
* STYLE: MenuItem
************************** -->
<SolidColorBrush x:Key="HighlightedBackgroundBrush" Color="#FFDEDEDE" />
<SolidColorBrush x:Key="MenuBackgroundBrush" Color="White" />
<SolidColorBrush x:Key="NormalBorderBrush" Color="#FFE5DFDF" />
<SolidColorBrush x:Key="SolidMenuFontBrush" Color="Black" />
<SolidColorBrush x:Key="HighlightedText" Color="White" />
<SolidColorBrush x:Key="menuItemBrush" Color="#FFB7B7B7" />
<SolidColorBrush x:Key="WindowBackgroundBrush" Color="#FFF" />
<SolidColorBrush x:Key="SolidBorderBrush" Color="#888" />
<Style x:Key="{x:Type Menu}" TargetType="{x:Type Menu}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="Height" Value="25"/>
<Setter Property="Foreground" Value="{StaticResource SolidMenuFontBrush}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Menu}">
<Border
Background="{StaticResource MenuBackgroundBrush}"
BorderBrush="{StaticResource MenuBackgroundBrush}"
BorderThickness="1">
<StackPanel ClipToBounds="True" Orientation="Horizontal" IsItemsHost="True"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Type MenuItem}" TargetType="{x:Type MenuItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type MenuItem}">
<Border x:Name="Border" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="0">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="Col0" MinWidth="17" Width="Auto" SharedSizeGroup="MenuItemIconColumnGroup"/>
<ColumnDefinition Width="Auto" SharedSizeGroup="MenuTextColumnGroup"/>
<ColumnDefinition Width="Auto" SharedSizeGroup="MenuItemIGTColumnGroup"/>
<ColumnDefinition x:Name="Col3" Width="14"/>
</Grid.ColumnDefinitions>
<!-- ContentPresenter to show an Icon if needed -->
<ContentPresenter Grid.Column="0" Margin="4,0,6,0" x:Name="Icon" VerticalAlignment="Center" ContentSource="Icon"/>
<!-- Glyph is a checkmark if needed for a checkable menu -->
<Grid Grid.Column="0" Visibility="Hidden" Margin="4,0,6,0" x:Name="GlyphPanel" VerticalAlignment="Center">
<Path x:Name="GlyphPanelpath" VerticalAlignment="Center" Fill="{TemplateBinding Foreground}" Data="M0,2 L0,4.8 L2.5,7.4 L7.1,2.8 L7.1,0 L2.5,4.6 z" FlowDirection="LeftToRight"/>
</Grid>
<!-- Content for the menu text etc -->
<ContentPresenter Grid.Column="1" Margin="{TemplateBinding Padding}" x:Name="HeaderHost" RecognizesAccessKey="True" ContentSource="Header"/>
<!-- Content for the menu IGT -->
<ContentPresenter Grid.Column="2" Margin="8,1,8,1" x:Name="IGTHost" ContentSource="InputGestureText" VerticalAlignment="Center"/>
<!-- Arrow drawn path which points to the next level of the menu -->
<Grid Grid.Column="3" Margin="4,0,6,0" x:Name="ArrowPanel" VerticalAlignment="Center">
<Path x:Name="ArrowPanelPath" HorizontalAlignment="Right" VerticalAlignment="Center" Fill="{TemplateBinding Foreground}" Data="M0,0 L0,8 L4,4 z"/>
</Grid>
<!--IsOpen="{Binding Path=IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}"
PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}"
-->
<!-- The Popup is the body of the menu which expands down or across depending on the level of the item -->
<Popup Placement="Right" IsOpen="{TemplateBinding IsSubmenuOpen}" x:Name="SubMenuPopup" Focusable="false" PopupAnimation="Fade">
<Border x:Name="SubMenuBorder" SnapsToDevicePixels="True" Background="{StaticResource WindowBackgroundBrush}" BorderBrush="{StaticResource SolidBorderBrush}" BorderThickness="1" Padding="2,2,2,2">
<Grid x:Name="SubMenu" Grid.IsSharedSizeScope="True">
<!--StackPanel holds children of the menu. This is set by IsItemsHost=True-->
<StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Cycle"/>
<!--<ScrollViewer CanContentScroll="True">
<StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Cycle" />
</ScrollViewer>-->
</Grid>
</Border>
</Popup>
</Grid>
</Border>
<!-- These triggers re-configure the four arrangements of MenuItem to show different levels of menu via Role -->
<ControlTemplate.Triggers>
<!-- Role = TopLevelHeader : this is the root menu item in a menu; the Popup expands down
2/6/2013 Luis Garcia
-->
<!--<Trigger Property="Role" Value="TopLevelHeader">
<Setter Property="Padding" Value="6,1,6,1"/>
<Setter Property="Placement" Value="Bottom" TargetName="SubMenuPopup"/>
<Setter Property="MinWidth" Value="0" TargetName="Col0"/>
<Setter Property="Width" Value="Auto" TargetName="Col3"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="GlyphPanel"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="IGTHost"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>
</Trigger>-->
<!-- Role = TopLevelItem : this is a child menu item from the top level without any child items-->
<Trigger Property="Role" Value="TopLevelItem">
<Setter Property="Padding" Value="6,1,6,1"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>
</Trigger>
<!-- Role = SubMenuHeader : this is a child menu item which does not have children -->
<Trigger Property="Role" Value="SubmenuHeader">
<Setter Property="DockPanel.Dock" Value="Top"/>
<Setter Property="Padding" Value="0,2,0,2"/>
</Trigger>
<!-- Role = SubMenuItem : this is a child menu item which has children-->
<Trigger Property="Role" Value="SubmenuItem">
<Setter Property="DockPanel.Dock" Value="Top"/>
<Setter Property="Padding" Value="0,2,0,2"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>
</Trigger>
<Trigger Property="IsSuspendingPopupAnimation" Value="true">
<Setter Property="PopupAnimation" Value="None" TargetName="SubMenuPopup"/>
</Trigger>
<!-- If no Icon is present the we collapse the Icon Content -->
<Trigger Property="Icon" Value="{x:Null}">
<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>
</Trigger>
<!-- The GlyphPanel contains the CheckMark -->
<Trigger Property="IsChecked" Value="true">
<Setter Property="Visibility" Value="Visible" TargetName="GlyphPanel"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>
</Trigger>
<!-- Using the system colors for the Menu Highlight and IsEnabled-->
<Trigger Property="IsHighlighted" Value="true">
<Setter Property="Background" Value="{StaticResource HighlightedBackgroundBrush}" TargetName="Border"/>
<Setter Property="Foreground" Value="{StaticResource HighlightedText}"/>
<Setter Property="BorderBrush" Value="{StaticResource NormalBorderBrush}" TargetName="Border"/>
</Trigger>
<Trigger Property="IsHighlighted" Value="false">
<Setter Property="Background" Value="{StaticResource MenuBackgroundBrush}" TargetName="Border"/>
<Setter Property="Foreground" Value="{StaticResource SolidMenuFontBrush}"/>
<Setter Property="BorderBrush" Value="{StaticResource MenuBackgroundBrush}" TargetName="Border"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="LightGray"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Resources>
<UserControl.Foreground>
<SolidColorBrush />
</UserControl.Foreground>
<Grid Height="24" Width="250" HorizontalAlignment="Left">
<Grid.Background>
<SolidColorBrush />
</Grid.Background>
<Menu Name="PrincipalMenu" Margin="0,0,-100,0">
</Menu>
</Grid>
Any help is greatly appreciated!

Underscores are used in WPF Content controls as accelerator keys.
So adding "E_dit" to a content control causes the "d" to be underlined at runtime.
The user can press ALT-D to move focus to the control.
In your case "Test_Header_Name" it's the "H" is prefixed by the underscore, so it is the accelerator key.
The solution is to use two underscores "__" to stop the accelerator key addition.

My guess is that the first underscore is being turned into an AccessKey for the MenuItem since you are using it in the Header. So in the example above, you probably have an AccessKey of 'h' for your MenuItem. See this answer for more on the subject.
I'm not sure if there's a way to override the behavior, perhaps if you use the ascii code for the underscore or something.

Related

How to remove ContextMenu highlight effect?

I have the following context menu attached to a rectangle:
<Rectangle x:Name="criteria1" IsHitTestVisible="True">
<Rectangle.ContextMenu>
<ContextMenu>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height=".5*"/>
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width=".5*"/>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Grid.Row="0" Content="Amplitude percentage"/>
<TextBox Grid.Column="1" Grid.Row="0" mah:TextBoxHelper.ClearTextButton="True" mah:ControlsHelper.FocusBorderBrush="{DynamicResource AccentColorBrush}" Width="70" >
<TextBox.Text>
<Binding Path="Criteria1AmplitudePercentage" TargetNullValue="{x:Static sys:String.Empty}" UpdateSourceTrigger="LostFocus" ValidatesOnDataErrors="True" />
</TextBox.Text>
</TextBox>
<Label Grid.Column="0" Grid.Row="1" Content="Bandwidth percentage}" />
<TextBox Grid.Column="1" Grid.Row="1" mah:TextBoxHelper.ClearTextButton="True" mah:ControlsHelper.FocusBorderBrush="{DynamicResource AccentColorBrush}" Width="70" >
<TextBox.Text>
<Binding Path="Criteria1BandwidthPercentage" TargetNullValue="{x:Static sys:String.Empty}" UpdateSourceTrigger="LostFocus" ValidatesOnDataErrors="True" />
</TextBox.Text>
</TextBox>
</Grid>
</ContextMenu>
</Rectangle.ContextMenu>
On mouse hover I get this highlighting effect where the background turns dark grey:
How can I remove this highlighting effect?
UPDATE
The context menu appears only via right click. When setting ContextMenu Background="Red" and Grid Background="Red", the menu looks like this:
When the mouse enters or is inside the menu or even if I click inside the text boxes, it looks like this:
EDIT: This is the default ContextMenu style:
<Style x:Key="ContextMenuDefaultStyle" TargetType="{x:Type ContextMenu}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="Background" Value="{DynamicResource MenuPopupBackgroundBrush}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="BorderBrush" Value="{DynamicResource MenuPopupBorderBrush}"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Padding" Value="2"/>
<Setter Property="Grid.IsSharedSizeScope" Value="True"/>
<Setter Property="HasDropShadow" Value="{DynamicResource {x:Static SystemParameters.DropShadowKey}}"/>
<Setter Property="ScrollViewer.PanningMode" Value="Both"/>
<Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
<Setter Property="FontFamily" Value="{DynamicResource {x:Static SystemFonts.MessageFontFamilyKey}}"/>
<Setter Property="FontSize" Value="{DynamicResource {x:Static SystemFonts.MessageFontSizeKey}}"/>
<Setter Property="FontWeight" Value="{DynamicResource {x:Static SystemFonts.MessageFontWeightKey}}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ContextMenu}">
<Border Uid="Border_93">
<Border.Style>
<Style TargetType="{x:Type Border}">
<Setter Property="Tag" Value="{DynamicResource {x:Static SystemParameters.DropShadowKey}}"/>
<Style.Triggers>
<DataTrigger Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" Value="True">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="Padding" Value="0,0,5,5"/>
<Setter Property="Effect">
<Setter.Value>
<DropShadowEffect BlurRadius="4" Opacity="0.8" ShadowDepth="1"/>
</Setter.Value>
</Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</Border.Style>
<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Uid="Border_50">
<ScrollViewer CanContentScroll="True" Style="{DynamicResource {ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly={x:Type FrameworkElement}}}" Uid="ScrollViewer_9">
<ItemsPresenter KeyboardNavigation.DirectionalNavigation="Cycle" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Uid="ItemsPresenter_5"/>
</ScrollViewer>
</Border>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

<ContextMenu Background="Transparent">
Isn't that all you need?

Make WPF TextBox begin at a certain location in the box

I can't seem to find the answer online when I search around, I don't know if this is because there is an easier way that I don't know about.
I want my text box text to begin after the line on the picture below:
Is there something that I can set in the XAML or in he C# code.
Also, if there is a solution, the data that the user enters it getting stored in a database so I don't want there to be space before there data if you get me.
Any idea's please let me know, Thanks.
<Label Content="Firstname:" HorizontalAlignment="Left" Margin="84,177,0,0" VerticalAlignment="Top" Foreground="#FFACACAC" FontSize="13"/>
<TextBox x:Name="txtFirstname" HorizontalAlignment="Left" Height="43" Margin="59,166,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="433" PreviewTextInput="TextOnlyValidation" VerticalContentAlignment="Center" FontSize="16" />
<GridSplitter HorizontalAlignment="Left" Height="34" Margin="190,171,0,0" VerticalAlignment="Top" Width="1" Background="#FFACACAC"/>

You need to create a new style for your TextBox, and change the layout inside it :
<Window.Resources>
<Style x:Key="FocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<SolidColorBrush x:Key="Button.Static.Background" Color="#FFDDDDDD"/>
<SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/>
<SolidColorBrush x:Key="Button.MouseOver.Background" Color="#FFBEE6FD"/>
<SolidColorBrush x:Key="Button.MouseOver.Border" Color="#FF3C7FB1"/>
<SolidColorBrush x:Key="Button.Pressed.Background" Color="#FFC4E5F6"/>
<SolidColorBrush x:Key="Button.Pressed.Border" Color="#FF2C628B"/>
<SolidColorBrush x:Key="Button.Disabled.Background" Color="#FFF4F4F4"/>
<SolidColorBrush x:Key="Button.Disabled.Border" Color="#FFADB2B5"/>
<SolidColorBrush x:Key="Button.Disabled.Foreground" Color="#FF838383"/>
<Style x:Key="ButtonStyle1" TargetType="{x:Type Button}">
<Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
<Setter Property="Background" Value="{StaticResource Button.Static.Background}"/>
<Setter Property="BorderBrush" Value="{StaticResource Button.Static.Border}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="HorizontalContentAlignment" Value="Center"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Padding" Value="1"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
<ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsDefaulted" Value="true">
<Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.MouseOver.Background}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.MouseOver.Border}"/>
</Trigger>
<Trigger Property="IsPressed" Value="true">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.Pressed.Background}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Pressed.Border}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.Disabled.Background}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Disabled.Border}"/>
<Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="{StaticResource Button.Disabled.Foreground}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<SolidColorBrush x:Key="TextBox.Static.Border" Color="#FFABAdB3"/>
<SolidColorBrush x:Key="TextBox.MouseOver.Border" Color="#FF7EB4EA"/>
<SolidColorBrush x:Key="TextBox.Focus.Border" Color="#FF569DE5"/>
<Style x:Key="TextBoxStyle1" TargetType="{x:Type TextBox}">
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
<Setter Property="BorderBrush" Value="{StaticResource TextBox.Static.Border}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="KeyboardNavigation.TabNavigation" Value="None"/>
<Setter Property="HorizontalContentAlignment" Value="Left"/>
<Setter Property="FocusVisualStyle" Value="{x:Null}"/>
<Setter Property="AllowDrop" Value="true"/>
<Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst"/>
<Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<ScrollViewer x:Name="PART_ContentHost" Focusable="false" HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Hidden" Margin="0" Grid.Column="2" VerticalContentAlignment="Center" VerticalAlignment="Center" Padding="-2,0,0,0"/>
<GridSplitter HorizontalAlignment="Center" Height="21" VerticalAlignment="Center" Width="2" Grid.Column="1"/>
<Label Content="Firstname :" VerticalAlignment="Center" FontSize="9.333"/>
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" TargetName="border" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource TextBox.MouseOver.Border}"/>
</Trigger>
<Trigger Property="IsKeyboardFocused" Value="true">
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource TextBox.Focus.Border}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsInactiveSelectionHighlightEnabled" Value="true"/>
<Condition Property="IsSelectionActive" Value="false"/>
</MultiTrigger.Conditions>
<Setter Property="SelectionBrush" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightBrushKey}}"/>
</MultiTrigger>
</Style.Triggers>
</Style>
</Window.Resources>
<Grid>
<TextBox HorizontalAlignment="Left" Height="23" TextWrapping="Wrap" Text="Your text here" VerticalAlignment="Top" Width="158.333" Margin="124.594,107.556,0,0" Style="{DynamicResource TextBoxStyle1}"/>
</Grid>
Hope this helps.

You mentioned a couple of problems.
(1) Want text to appear after that line
Solution is to set padding, so that there is a large dead-space on the left of the textbox. How much? However wide your label is, or whatever it takes to get to the line.
Use something like Padding="15,0,0,0" to just set the left padding.
(2) Adding padding won't let you click in TextBox
Click where? Over the label, or to the right of the line? You can set IsHitTestVisible="False" on the label to ensure it doesn't get in the way of your clicking.
But finally, this is not a great design. You've got absolute positions for Margin whereas you want to try and create a layout that flows and adapts to the space given. A Grid will help with this. You're also trying to overlay two UI elements, and then work around problems introduced by doing this. This is a clear sign you're doing things wrong! The best solution, if a control doesn't do what you want, is to create your own control derived from those that are closest to what you want. You would be better off creating your own TextBox-with-inbuilt-label component and using that.

You could make a grid with 2 columns around the label and textbox.
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Content="Firstname:" HorizontalAlignment="Left" Margin="84,177,0,0" VerticalAlignment="Top" Foreground="#FFACACAC" FontSize="13"/>
<TextBox Grid.Column="1" x:Name="txtFirstname" HorizontalAlignment="Left" Height="43" Margin="59,166,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="433" PreviewTextInput="TextOnlyValidation" VerticalContentAlignment="Center" FontSize="16" />
</Grid>

Just set the correct amount of padding:
<Grid VerticalAlignment="Center">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="Firstname" VerticalAlignment="Center" Margin="5" />
<TextBox Grid.Column="1" Padding="10,0,0,0" BorderThickness="0" VerticalAlignment="Center" />
</Grid>

To avoid spaces in your value you can use :
string firstname = txtFirstname.text.Trim()
Info : Trim

"System.Windows.Data Error: 4" in a dynamic MenuItem

I have a WPF MenuControl to which I add several menu items at run-time. If you are interested in knowing, the reason is that we read the data from a database and need to create the MenuItems based on the data returned. We have what I'd say is a complex menu style (at least complex to read :) ). Now, when I add my menu items I keep getting this error in the Debug window of Visual Studio:
System.Windows.Data Error: 4 : Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='System.Windows.Controls.ItemsControl', AncestorLevel='1''. BindingExpression:Path=HorizontalContentAlignment; DataItem=null; target element is 'MenuItem' (Name=''); target property is 'HorizontalContentAlignment' (type 'HorizontalAlignment')
System.Windows.Data Error: 4 : Cannot find source for binding with reference 'RelativeSource FindAncestor, AncestorType='System.Windows.Controls.ItemsControl', AncestorLevel='1''. BindingExpression:Path=VerticalContentAlignment; DataItem=null; target element is 'MenuItem' (Name=''); target property is 'VerticalContentAlignment' (type 'VerticalAlignment')
Those two repeat several times I guess based on the number of MenuItems added. The other odd behavior I have noticed is that, after these errors come up in the debug window, the MenuControl drops down (opens) on its own, just by moving the mouse over it (not clicking on it as normally done). So, I guess one has to do with the other.
Any ideas what is going on?? The MenuControlCode is rather long but if needed, I can post it as well.
Here is the XAML code of the MenuControl. After that, in the code I just use the "PrincipalMenu" and add MenuItems to it as needed:
<UserControl x:Class="EOGMapControl.MainPropertyGUI.MenuControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="41" d:DesignWidth="380">
<UserControl.Resources>
<SolidColorBrush x:Key="HighlightedBackgroundBrush" Color="#FFDEDEDE" />
<SolidColorBrush x:Key="MenuBackgroundBrush" Color="White" />
<SolidColorBrush x:Key="NormalBorderBrush" Color="#FFE5DFDF" />
<SolidColorBrush x:Key="SolidMenuFontBrush" Color="Black" />
<SolidColorBrush x:Key="HighlightedText" Color="White" />
<SolidColorBrush x:Key="menuItemBrush" Color="#FFB7B7B7" />
<SolidColorBrush x:Key="WindowBackgroundBrush" Color="#FFF" />
<SolidColorBrush x:Key="SolidBorderBrush" Color="#888" />
<Style x:Key="{x:Type Menu}" TargetType="{x:Type Menu}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="Height" Value="25"/>
<Setter Property="Foreground" Value="{StaticResource SolidMenuFontBrush}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Menu}">
<Border
Background="{StaticResource MenuBackgroundBrush}"
BorderBrush="{StaticResource MenuBackgroundBrush}"
BorderThickness="1">
<StackPanel ClipToBounds="True" Orientation="Horizontal" IsItemsHost="True"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Type MenuItem}" TargetType="{x:Type MenuItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type MenuItem}">
<Border x:Name="Border"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="0">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="Col0" MinWidth="17" Width="Auto" SharedSizeGroup="MenuItemIconColumnGroup"/>
<ColumnDefinition Width="Auto" SharedSizeGroup="MenuTextColumnGroup"/>
<ColumnDefinition Width="Auto" SharedSizeGroup="MenuItemIGTColumnGroup"/>
<ColumnDefinition x:Name="Col3" Width="14"/>
</Grid.ColumnDefinitions>
<!-- ContentPresenter to show an Icon if needed -->
<ContentPresenter Grid.Column="0" Margin="4,0,6,0" x:Name="Icon" VerticalAlignment="Center" ContentSource="Icon"/>
<!-- Glyph is a checkmark if needed for a checkable menu -->
<Grid Grid.Column="0" Visibility="Hidden" Margin="4,0,6,0" x:Name="GlyphPanel" VerticalAlignment="Center">
<Path x:Name="GlyphPanelpath" VerticalAlignment="Center" Fill="{TemplateBinding Foreground}" Data="M0,2 L0,4.8 L2.5,7.4 L7.1,2.8 L7.1,0 L2.5,4.6 z" FlowDirection="LeftToRight"/>
</Grid>
<!-- Content for the menu text etc -->
<ContentPresenter Grid.Column="1"
Margin="{TemplateBinding Padding}"
x:Name="HeaderHost"
RecognizesAccessKey="True"
ContentSource="Header"/>
<!-- Content for the menu IGT -->
<ContentPresenter Grid.Column="2"
Margin="8,1,8,1"
x:Name="IGTHost"
ContentSource="InputGestureText"
VerticalAlignment="Center"/>
<!-- Arrow drawn path which points to the next level of the menu -->
<Grid Grid.Column="3" Margin="4,0,6,0" x:Name="ArrowPanel" VerticalAlignment="Center">
<Path x:Name="ArrowPanelPath" HorizontalAlignment="Right" VerticalAlignment="Center" Fill="{TemplateBinding Foreground}" Data="M0,0 L0,8 L4,4 z"/>
</Grid>
<!--IsOpen="{Binding Path=IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}"
PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}"
-->
<!-- The Popup is the body of the menu which expands down or across depending on the level of the item -->
<Popup Placement="Right" IsOpen="{TemplateBinding IsSubmenuOpen}" x:Name="SubMenuPopup" Focusable="false" PopupAnimation="Fade">
<Border x:Name="SubMenuBorder" SnapsToDevicePixels="True" Background="{StaticResource WindowBackgroundBrush}" BorderBrush="{StaticResource SolidBorderBrush}" BorderThickness="1" Padding="2,2,2,2">
<Grid x:Name="SubMenu" Grid.IsSharedSizeScope="True">
<!--StackPanel holds children of the menu. This is set by IsItemsHost=True-->
<StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Cycle"/>
<!--<ScrollViewer CanContentScroll="True">
<StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Cycle" />
</ScrollViewer>-->
</Grid>
</Border>
</Popup>
</Grid>
</Border>
<!-- These triggers re-configure the four arrangements of MenuItem to show different levels of menu via Role -->
<ControlTemplate.Triggers>
<!-- Role = TopLevelItem : this is a child menu item from the top level without any child items-->
<Trigger Property="Role" Value="TopLevelItem">
<Setter Property="Padding" Value="6,1,6,1"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>
</Trigger>
<!-- Role = SubMenuHeader : this is a child menu item which does not have children -->
<Trigger Property="Role" Value="SubmenuHeader">
<Setter Property="DockPanel.Dock" Value="Top"/>
<Setter Property="Padding" Value="0,2,0,2"/>
</Trigger>
<!-- Role = SubMenuItem : this is a child menu item which has children-->
<Trigger Property="Role" Value="SubmenuItem">
<Setter Property="DockPanel.Dock" Value="Top"/>
<Setter Property="Padding" Value="0,2,0,2"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>
</Trigger>
<Trigger Property="IsSuspendingPopupAnimation" Value="true">
<Setter Property="PopupAnimation" Value="None" TargetName="SubMenuPopup"/>
</Trigger>
<!-- If no Icon is present the we collapse the Icon Content -->
<Trigger Property="Icon" Value="{x:Null}">
<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>
</Trigger>
<!-- The GlyphPanel contains the CheckMark -->
<Trigger Property="IsChecked" Value="true">
<Setter Property="Visibility" Value="Visible" TargetName="GlyphPanel"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>
</Trigger>
<!-- Using the system colors for the Menu Highlight and IsEnabled-->
<Trigger Property="IsHighlighted" Value="true">
<Setter Property="Background" Value="{StaticResource HighlightedBackgroundBrush}" TargetName="Border"/>
<Setter Property="Foreground" Value="{StaticResource HighlightedText}"/>
<Setter Property="BorderBrush" Value="{StaticResource NormalBorderBrush}" TargetName="Border"/>
</Trigger>
<Trigger Property="IsHighlighted" Value="false">
<Setter Property="Background" Value="{StaticResource MenuBackgroundBrush}" TargetName="Border"/>
<Setter Property="Foreground" Value="{StaticResource SolidMenuFontBrush}"/>
<Setter Property="BorderBrush" Value="{StaticResource MenuBackgroundBrush}" TargetName="Border"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="LightGray"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Resources>
<UserControl.Foreground>
<SolidColorBrush />
</UserControl.Foreground>
<Grid Height="24" Width="250" HorizontalAlignment="Left">
<Grid.Background>
<SolidColorBrush />
</Grid.Background>
<Menu Name="PrincipalMenu" Margin="0,0,-100,0">
</Menu>
</Grid>

Kindly refer the below link:
http://www.codeproject.com/Tips/124556/How-to-suppress-the-System-Windows-Data-Error-warn
The solution is, set data binding source switch level as critical in constructor of the class.
public TestSample() //constructor of the class
{
InitializeComponent();
System.Diagnostics.PresentationTraceSources.DataBindingSource.Switch.Level = System.Diagnostics.SourceLevels.Critical;
}

Removing thin border around the menuitems

I based a custom menu on some code I once received. It looks OK, but I'm going crazy over how to remove the thin black border around the entire section of menuitems?! Where is this border/padding defined?
Thanks to any WPF guru that might help me with this :)
Valid XHTML http://img843.imageshack.us/img843/8813/testn.png
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<SolidColorBrush x:Key="HighlightedBackgroundBrush" Color="#003466" />
<SolidColorBrush x:Key="MenuBackgroundBrush" Color="#003466" />
<SolidColorBrush x:Key="NormalBorderBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="SolidMenuFontBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="HighlightedText" Color="#FFFFFFFF" />
<Style x:Key="{x:Type Menu}" TargetType="{x:Type Menu}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="Height" Value="25"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Menu}">
<Border Background="{DynamicResource AppBackground}"
BorderBrush="{DynamicResource AppBackground}"
BorderThickness="1">
<StackPanel ClipToBounds="True" Orientation="Vertical" IsItemsHost="True"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Type MenuItem}" TargetType="{x:Type MenuItem}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type MenuItem}">
<Border x:Name="Border" BorderThickness="1">
<Grid Background="{DynamicResource AppBackground}">
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="Col0" MinWidth="17" Width="Auto" SharedSizeGroup="MenuItemIconColumnGroup"/>
<ColumnDefinition Width="Auto" SharedSizeGroup="MenuTextColumnGroup"/>
<ColumnDefinition Width="Auto" SharedSizeGroup="MenuItemIGTColumnGroup"/>
<ColumnDefinition x:Name="Col3" />
</Grid.ColumnDefinitions>
<!-- ContentPresenter to show an Icon if needed -->
<ContentPresenter Grid.Column="0" Margin="4,0,6,0" x:Name="Icon" VerticalAlignment="Center" ContentSource="Icon"/>
<!-- Glyph is a checkmark if needed for a checkable menu -->
<Grid Grid.Column="0" Visibility="Hidden" Margin="4,0,6,0" x:Name="GlyphPanel" VerticalAlignment="Center">
<Path x:Name="GlyphPanelpath" VerticalAlignment="Center" Fill="{TemplateBinding Foreground}" Data="M0,2 L0,4.8 L2.5,7.4 L7.1,2.8 L7.1,0 L2.5,4.6 z" FlowDirection="LeftToRight"/>
</Grid>
<!-- Content for the menu text etc -->
<ContentPresenter Grid.Column="1"
Margin="{TemplateBinding Padding}"
x:Name="HeaderHost"
RecognizesAccessKey="True"
ContentSource="Header"/>
<!-- Content for the menu IGT -->
<ContentPresenter Grid.Column="2"
Margin="8,1,8,1"
x:Name="IGTHost"
ContentSource="InputGestureText"
VerticalAlignment="Center"/>
<!-- Arrow drawn path which points to the next level of the menu -->
<Grid Grid.Column="3" Margin="4,0,6,0" x:Name="ArrowPanel" VerticalAlignment="Center">
<Path x:Name="ArrowPanelPath" HorizontalAlignment="Right" VerticalAlignment="Center" Fill="{TemplateBinding Foreground}" Data="M0,0 L0,8 L4,4 z"/>
</Grid>
<!-- The Popup is the body of the menu which expands down or across depending on the level of the item -->
<Popup IsOpen="{Binding Path=IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}" Placement="Right" x:Name="SubMenuPopup" Focusable="false" PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}">
<Border x:Name="SubMenuBorder" BorderBrush="{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType={x:Type Menu}}}" BorderThickness="1" Padding="2,2,2,2">
<Grid x:Name="SubMenu" Grid.IsSharedSizeScope="True">
<!-- StackPanel holds children of the menu. This is set by IsItemsHost=True -->
<StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Cycle"/>
</Grid>
</Border>
</Popup>
</Grid>
</Border>
<!-- These triggers re-configure the four arrangements of MenuItem to show different levels of menu via Role -->
<ControlTemplate.Triggers>
<!-- Role = TopLevelHeader : this is the root menu item in a menu; the Popup expands down -->
<Trigger Property="Role" Value="TopLevelHeader">
<Setter Property="Padding" Value="6,1,6,1"/>
<Setter Property="Placement" Value="Bottom" TargetName="SubMenuPopup"/>
<Setter Property="MinWidth" Value="2" TargetName="Col0"/>
<Setter Property="Width" Value="Auto" TargetName="Col3"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="GlyphPanel"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="IGTHost"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>
</Trigger>
<!-- Role = TopLevelItem : this is a child menu item from the top level without any child items-->
<Trigger Property="Role" Value="TopLevelItem">
<Setter Property="Padding" Value="6,1,6,1"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>
</Trigger>
<!-- Role = SubMenuHeader : this is a child menu item which does not have children -->
<Trigger Property="Role" Value="SubmenuHeader">
<Setter Property="DockPanel.Dock" Value="Top"/>
<Setter Property="Padding" Value="0,2,0,2"/>
</Trigger>
<!-- Role = SubMenuItem : this is a child menu item which has children-->
<Trigger Property="Role" Value="SubmenuItem">
<Setter Property="DockPanel.Dock" Value="Top"/>
<Setter Property="Padding" Value="0,2,0,2"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>
</Trigger>
<Trigger Property="IsSuspendingPopupAnimation" Value="true">
<Setter Property="PopupAnimation" Value="None" TargetName="SubMenuPopup"/>
</Trigger>
<!-- If no Icon is present the we collapse the Icon Content -->
<Trigger Property="Icon" Value="{x:Null}">
<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>
</Trigger>
<!-- The GlyphPanel contains the CheckMark -->
<Trigger Property="IsChecked" Value="true">
<Setter Property="Visibility" Value="Visible" TargetName="GlyphPanel"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>
</Trigger>
<!-- Using the system colors for the Menu Highlight and IsEnabled-->
<Trigger Property="IsHighlighted" Value="true">
<Setter Property="Background" Value="{DynamicResource HighlightedBackgroundBrush}" TargetName="Border"/>
<Setter Property="Foreground" Value="{DynamicResource HighlightedText}"/>
<Setter Property="BorderBrush" Value="{DynamicResource NormalBorderBrush}" TargetName="Border"/>
</Trigger>
<Trigger Property="IsHighlighted" Value="false">
<Setter Property="Background" Value="{DynamicResource AppBackground}" TargetName="Border"/>
<Setter Property="Foreground" Value="{DynamicResource SolidMenuFontBrush}"/>
<Setter Property="BorderBrush" Value="{DynamicResource AppBackground}" TargetName="Border"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="LightGray"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>

...
<!-- The Popup is the body of the menu which expands down or across depending on the level of the item -->
<Popup ...>
<Border x:Name="SubMenuBorder" ... Padding="0">...</Border>...</Popup>

WPF C# - Change the brush of a menu's background

Does anyone know how to change the brush for a menu's background? This sounds simple, but I don't see any obvious way to do this. You'd think that the Background property would change it, but it doesn't.
Here's what my menu looks like (notice the default white background):
Example Code:
<Window x:Class="WpfApplication1.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Window.Resources>
<SolidColorBrush x:Key="menuItemBrush"
Color="#FF505050" />
</Window.Resources>
<Grid x:Name="mainGrid"
Background="#FF252525">
<Menu x:Name="mainMenu"
Background="{DynamicResource menuItemBrush}"
Grid.ColumnSpan="2"
VerticalAlignment="Top">
<MenuItem x:Name="fileMenu"
Background="{DynamicResource menuItemBrush}"
Foreground="White"
Header="File">
<MenuItem x:Name="fileOpenMenuItem"
Background="{DynamicResource menuItemBrush}"
Foreground="White"
Header="Open..." />
<MenuItem x:Name="fileSaveMenuItem"
Background="{DynamicResource menuItemBrush}"
Foreground="White"
Header="Save" />
<MenuItem x:Name="fileSaveAsMenuItem"
Background="{DynamicResource menuItemBrush}"
Foreground="White"
Header="Save As..." />
<Separator Style="{DynamicResource menuItemSeperator}" />
<MenuItem x:Name="fileExitMenuItem"
Background="{DynamicResource menuItemBrush}"
Foreground="White"
Header="Exit" />
</MenuItem>
</Menu>
</Grid>

I'd suggest using a tool called kaxaml for writing styles. It includes several code snippets, a color picker and a nice way to instantly see what changes in the xaml code does. Here is a full menu style for what you are trying to do. Just change the brush colors at the top to suit to your needs.
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Page.Resources>
<!--**************************
* STYLE: MenuItem
************************** -->
<SolidColorBrush x:Key="HighlightedBackgroundBrush" Color="#FF797878" />
<SolidColorBrush x:Key="MenuBackgroundBrush" Color="#FF505050" />
<SolidColorBrush x:Key="NormalBorderBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="SolidMenuFontBrush" Color="#FFFFFFFF" />
<SolidColorBrush x:Key="HighlightedText" Color="#FFFFFFFF" />
<Style x:Key="{x:Type Menu}" TargetType="{x:Type Menu}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="Height" Value="25"/>
<Setter Property="Foreground" Value="{StaticResource SolidMenuFontBrush}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Menu}">
<Border
Background="{StaticResource MenuBackgroundBrush}"
BorderBrush="{StaticResource MenuBackgroundBrush}"
BorderThickness="1">
<StackPanel ClipToBounds="True" Orientation="Horizontal" IsItemsHost="True"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Type MenuItem}" TargetType="{x:Type MenuItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type MenuItem}">
<Border x:Name="Border"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="1">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="Col0" MinWidth="17" Width="Auto" SharedSizeGroup="MenuItemIconColumnGroup"/>
<ColumnDefinition Width="Auto" SharedSizeGroup="MenuTextColumnGroup"/>
<ColumnDefinition Width="Auto" SharedSizeGroup="MenuItemIGTColumnGroup"/>
<ColumnDefinition x:Name="Col3" Width="14"/>
</Grid.ColumnDefinitions>
<!-- ContentPresenter to show an Icon if needed -->
<ContentPresenter Grid.Column="0" Margin="4,0,6,0" x:Name="Icon" VerticalAlignment="Center" ContentSource="Icon"/>
<!-- Glyph is a checkmark if needed for a checkable menu -->
<Grid Grid.Column="0" Visibility="Hidden" Margin="4,0,6,0" x:Name="GlyphPanel" VerticalAlignment="Center">
<Path x:Name="GlyphPanelpath" VerticalAlignment="Center" Fill="{TemplateBinding Foreground}" Data="M0,2 L0,4.8 L2.5,7.4 L7.1,2.8 L7.1,0 L2.5,4.6 z" FlowDirection="LeftToRight"/>
</Grid>
<!-- Content for the menu text etc -->
<ContentPresenter Grid.Column="1"
Margin="{TemplateBinding Padding}"
x:Name="HeaderHost"
RecognizesAccessKey="True"
ContentSource="Header"/>
<!-- Content for the menu IGT -->
<ContentPresenter Grid.Column="2"
Margin="8,1,8,1"
x:Name="IGTHost"
ContentSource="InputGestureText"
VerticalAlignment="Center"/>
<!-- Arrow drawn path which points to the next level of the menu -->
<Grid Grid.Column="3" Margin="4,0,6,0" x:Name="ArrowPanel" VerticalAlignment="Center">
<Path x:Name="ArrowPanelPath" HorizontalAlignment="Right" VerticalAlignment="Center" Fill="{TemplateBinding Foreground}" Data="M0,0 L0,8 L4,4 z"/>
</Grid>
<!-- The Popup is the body of the menu which expands down or across depending on the level of the item -->
<Popup IsOpen="{Binding Path=IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}" Placement="Right" x:Name="SubMenuPopup" Focusable="false" PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}">
<Border x:Name="SubMenuBorder" BorderBrush="{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType={x:Type Menu}}}" BorderThickness="1" Padding="2,2,2,2">
<Grid x:Name="SubMenu" Grid.IsSharedSizeScope="True">
<!-- StackPanel holds children of the menu. This is set by IsItemsHost=True -->
<StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Cycle"/>
</Grid>
</Border>
</Popup>
</Grid>
</Border>
<!-- These triggers re-configure the four arrangements of MenuItem to show different levels of menu via Role -->
<ControlTemplate.Triggers>
<!-- Role = TopLevelHeader : this is the root menu item in a menu; the Popup expands down -->
<Trigger Property="Role" Value="TopLevelHeader">
<Setter Property="Padding" Value="6,1,6,1"/>
<Setter Property="Placement" Value="Bottom" TargetName="SubMenuPopup"/>
<Setter Property="MinWidth" Value="0" TargetName="Col0"/>
<Setter Property="Width" Value="Auto" TargetName="Col3"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="GlyphPanel"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="IGTHost"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>
</Trigger>
<!-- Role = TopLevelItem : this is a child menu item from the top level without any child items-->
<Trigger Property="Role" Value="TopLevelItem">
<Setter Property="Padding" Value="6,1,6,1"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>
</Trigger>
<!-- Role = SubMenuHeader : this is a child menu item which does not have children -->
<Trigger Property="Role" Value="SubmenuHeader">
<Setter Property="DockPanel.Dock" Value="Top"/>
<Setter Property="Padding" Value="0,2,0,2"/>
</Trigger>
<!-- Role = SubMenuItem : this is a child menu item which has children-->
<Trigger Property="Role" Value="SubmenuItem">
<Setter Property="DockPanel.Dock" Value="Top"/>
<Setter Property="Padding" Value="0,2,0,2"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="ArrowPanel"/>
</Trigger>
<Trigger Property="IsSuspendingPopupAnimation" Value="true">
<Setter Property="PopupAnimation" Value="None" TargetName="SubMenuPopup"/>
</Trigger>
<!-- If no Icon is present the we collapse the Icon Content -->
<Trigger Property="Icon" Value="{x:Null}">
<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>
</Trigger>
<!-- The GlyphPanel contains the CheckMark -->
<Trigger Property="IsChecked" Value="true">
<Setter Property="Visibility" Value="Visible" TargetName="GlyphPanel"/>
<Setter Property="Visibility" Value="Collapsed" TargetName="Icon"/>
</Trigger>
<!-- Using the system colors for the Menu Highlight and IsEnabled-->
<Trigger Property="IsHighlighted" Value="true">
<Setter Property="Background" Value="{StaticResource HighlightedBackgroundBrush}" TargetName="Border"/>
<Setter Property="Foreground" Value="{StaticResource HighlightedText}"/>
<Setter Property="BorderBrush" Value="{StaticResource NormalBorderBrush}" TargetName="Border"/>
</Trigger>
<Trigger Property="IsHighlighted" Value="false">
<Setter Property="Background" Value="{StaticResource MenuBackgroundBrush}" TargetName="Border"/>
<Setter Property="Foreground" Value="{StaticResource SolidMenuFontBrush}"/>
<Setter Property="BorderBrush" Value="{StaticResource MenuBackgroundBrush}" TargetName="Border"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="LightGray"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
<Grid x:Name="mainGrid"
Background="#FF252525">
<Menu x:Name="mainMenu"
Grid.ColumnSpan="2"
VerticalAlignment="Top">
<MenuItem x:Name="fileMenu"
Header="File">
<MenuItem x:Name="fileOpenMenuItem"
Header="Open..." />
<MenuItem x:Name="fileSaveMenuItem"
Header="Save" />
<MenuItem x:Name="fileSaveAsMenuItem"
Background="{DynamicResource menuItemBrush}"
Header="Save As..." />
</MenuItem>
</Menu>
</Grid>
</Page>

You can't do it without overriding the template for the menu item. Deep inside the template is a control called "Part_Popup". You need to change it's background color.

Develop Reference

C# (C-Sharp) is a programming language developed by Microsoft that runs on the .NET Framework.

Bug in WPF user control - c#

Related

How to remove ContextMenu highlight effect?

Make WPF TextBox begin at a certain location in the box

"System.Windows.Data Error: 4" in a dynamic MenuItem

Removing thin border around the menuitems

WPF C# - Change the brush of a menu's background

Categories

Resources