Problem icon WPF XAML - icons are not displayed - wpf

I have a problem with icons.
In the edit mode, they are displayed and you cannot see them after starting the program.
I put in a different colored icon and it actually worked.
I don't know why this is happening with white icons.
I've been working on it for several hours and I don't know, will anyone help?
enter image description here
enter image description here
<Window x:Class="Projekt.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Projekt"
mc:Ignorable="d"
Title="Kadry i płace Sputnik 2021" Height="450" Width="800">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="9*"/>
<ColumnDefinition Width="11*"/>
</Grid.ColumnDefinitions>
<DockPanel Grid.ColumnSpan="2">
<Menu DockPanel.Dock="Top" Height="20">
<Menu.Background>
<SolidColorBrush>#457b9d</SolidColorBrush>
</Menu.Background>
<MenuItem Header="_Opcje" Foreground="#f1faee">
<MenuItem Header="Kadry" Foreground="Black"/>
<MenuItem Header="Płace" Foreground="Black"/>
<MenuItem Header="Właściciele" Foreground="Black"/>
<Separator/>
<MenuItem Header="Przelew do ZUS"/>
<Separator/>
<MenuItem Header="Przypomnij"/>
</MenuItem>
<MenuItem Header="_Inne" Foreground="#f1faee">
<MenuItem Header="Przelogowanie"/>
<MenuItem Header="Ustawienie"/>
<MenuItem Header="Kalkulator"/>
<MenuItem Header="Wygląd"/>
<MenuItem Header="Pobranie Podręcznika"/>
</MenuItem>
<MenuItem Header="_Pomoc" Foreground="#f1faee">
<MenuItem Header="Pomoc na temat"/>
<MenuItem Header="Co nowego"/>
<MenuItem Header="Kalkulator"/>
<Separator/>
<MenuItem Header="Powiadomienia"/>
<Separator/>
<MenuItem Header="O programie"/>
</MenuItem>
</Menu>
<StackPanel DockPanel.Dock ="Left" Width="130" Background="#457b9d">
<Grid Height="1" Background="White"></Grid>
<Grid Height="19"></Grid>
<ListView BorderBrush="Transparent" Background="#457b9d">
<ListViewItem Height="30">
<StackPanel Orientation="Horizontal">
<Image Source="/Source/Icons/List_View_place.png"/>
<TextBlock Text="Kadry" Margin="15 0 0 0" FontFamily="Candara" Foreground="White" VerticalAlignment="Center"/>
</StackPanel>
</ListViewItem>
<ListViewItem Height="30">
<StackPanel Orientation="Horizontal">
<Image Source="/Source/Icons/List_View_Kadry.png"/>
<TextBlock Text="Płace" Margin="15 0 0 0" FontFamily="Candara" Foreground="White" VerticalAlignment="Center"/>
</StackPanel>
</ListViewItem>
<ListViewItem Height="30">
<StackPanel Orientation="Horizontal">
<Image Source="/Source/Icons/List_View_wlasciciele.png"/>
<TextBlock Text="Właściciele" Margin="15 0 0 0" FontFamily="Candara" Foreground="White" VerticalAlignment="Center"/>
</StackPanel>
</ListViewItem>
<ListViewItem Height="30">
<StackPanel Orientation="Horizontal">
<Image Source="/Source/Icons/List_View_zus.png"/>
<TextBlock Text="Przedlew ZUS" Margin="15 0 0 0" FontFamily="Candara" Foreground="White" VerticalAlignment="Center"/>
</StackPanel>
</ListViewItem>
</ListView>
<Grid Height="140"></Grid>
<ListView BorderBrush="Transparent" Background="#457b9d">
<ListViewItem>
<StackPanel Orientation="Horizontal">
<Image Source="/Source/Icons/List_View_użytkownik.png" />
<TextBlock Text="Firma" Margin="15 0 0 0" FontFamily="Candara" Foreground="White" VerticalAlignment="Center"/>
</StackPanel>
</ListViewItem>
<ListViewItem>
<StackPanel Orientation="Horizontal">
<Image Source="/Source/Icons/List_View_administrator.png" />
<TextBlock Text="Administrator" Margin="15 0 0 0" FontFamily="Candara" Foreground="White" VerticalAlignment="Center"/>
</StackPanel>
</ListViewItem>
<ListViewItem>
<StackPanel Orientation="Horizontal">
<Image Source="/Source/Icons/List_View_kalendarz.png" />
<TextBlock Text="Kalendarz" Margin="15 0 0 0" FontFamily="Candara" Foreground="White" VerticalAlignment="Center"/>
</StackPanel>
</ListViewItem>
</ListView>
<Grid Height="1" Background="white"></Grid>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="0 5 0 0">
<ListView BorderBrush="Transparent" Background="#457b9d">
<ListViewItem Margin="0 0 10 0">
<Image Source="/Source/Icons/List_View_ustawienia.png" Height="25" />
</ListViewItem>
</ListView>
<ListView BorderBrush="Transparent" Background="#457b9d">
<ListViewItem>
<Image Source="/Source/Icons/List_View_wyjscie.png" Height="25" />
</ListViewItem>
</ListView>
</StackPanel>
</StackPanel>
<StackPanel>
</StackPanel>
</DockPanel>
</Grid>

In the properties panel of your image in VisualStudio, you need to change the Build Action property to Resource.
Example image link

Related

Border does not show for expander in popup

Not sure what I'm doing wrong: but for some reason I cannot make the Expander control show its border even though I have specified it in the XAML.
Can someone help me get the border to show up.
Here is the XAML:
<Popup x:Name="PopLink" StaysOpen="True" Placement="Mouse" PopupAnimation="Fade" AllowsTransparency="True" MaxWidth="300">
<Popup.Style>
<Style TargetType="Popup">
<EventSetter Event="MouseLeave" Handler="OnPopupMouseLeave"></EventSetter>
</Style>
</Popup.Style>
<Border BorderBrush="{DynamicResource Esri_BorderBrush}" BorderThickness="2" Background="{DynamicResource Esri_ControlBackgroundBrush}">
<StackPanel>
<DockPanel>
<TextBlock Margin="10 10 5 0" Text="{Binding PopupDesc}" FontWeight="Bold" HorizontalAlignment="Left"></TextBlock>
<Button BorderThickness="0" Margin="0 -1 0 0 " x:Name="ButtonClosePopup" Click="ButtonClosePopup_OnClick" Width="15" Height="20" HorizontalAlignment="Right" Content="X"></Button>
</DockPanel>
<Separator Margin="10 10 10 5"/>
<TextBlock Margin="10 3 10 5" TextWrapping="Wrap" FontWeight="Bold" FontSize="14" Text="{Binding PopupTitle}"></TextBlock>
<TextBlock Margin="10 3 10 5" TextWrapping="Wrap" FontStyle="Italic" Text="{Binding PopupAuthors}"></TextBlock>
<TextBlock Margin="10 5 10 0" TextWrapping="Wrap" Text="{Binding PopupText}"></TextBlock>
<Expander BorderBrush="DarkGray" BorderThickness="1" Visibility="{Binding IsPopupAbstractVisible}" Header="Abstract" Margin="10 5" >
<TextBlock Height="100" TextWrapping="Wrap">
<TextBox TextWrapping="Wrap" MaxHeight="150" Margin="5" Text="{Binding Path=PopupAbstract}" VerticalScrollBarVisibility="Visible" BorderThickness="0"></TextBox>
</TextBlock>
</Expander>
<TextBlock Margin="10 0 10 10" TextWrapping="Wrap" Text="{Binding PopupKeywords}" FontStyle="Italic"></TextBlock>
</StackPanel>
</Border>
</Popup>

Command on WPF Button with ControlTemplate doesn't work on the entire area

I'm binding the ICommand nammed GoToSheet to a Button with ControlTemplate.
<Button Margin="10 10 10 10" Command="{Binding GoToSheet}">
<Button.Template>
<ControlTemplate>
<DockPanel Width="840">
<Border DockPanel.Dock="Left" BorderBrush="Black" BorderThickness="5"></Border>
<Border DockPanel.Dock="Top" BorderBrush="Black" BorderThickness="2"></Border>
<Border DockPanel.Dock="Right" BorderBrush="Black" BorderThickness="2"></Border>
<Border DockPanel.Dock="Bottom" BorderBrush="Black" BorderThickness="2"></Border>
<DockPanel DockPanel.Dock="Left">
<StackPanel Orientation="Vertical" Margin="20 10 0 10">
<StackPanel Orientation="Horizontal">
<StackPanel Orientation="Vertical" Margin="0 0 0 10">
<TextBlock Text="{Binding Client}" FontSize="30" FontWeight="Bold" MaxWidth="480"></TextBlock>
<TextBlock Text="{Binding Lieu}" FontSize="22" MaxWidth="480"></TextBlock>
</StackPanel>
<Image Height="35" Width="45" Margin="7 3 0 0" VerticalAlignment="Top" Source="/Resource/Image/CHC.png"></Image>
</StackPanel>
<StackPanel Orientation="Vertical" VerticalAlignment="Bottom" Margin="20 0 0 0">
<TextBlock Text="{Binding MarqueEngin}" FontSize="26" FontWeight="Bold"></TextBlock>
<TextBlock Text="{Binding ModeleEngin}" FontSize="19" FontWeight="Bold"></TextBlock>
</StackPanel>
</StackPanel>
</DockPanel>
<DockPanel DockPanel.Dock="Right" Margin="0 10 20 10">
<TextBlock DockPanel.Dock="Top" Text="{Binding DateIntervention, StringFormat=dd/MM/yyyy}" FontSize="30" HorizontalAlignment="Right"></TextBlock>
<TextBlock DockPanel.Dock="Bottom" Text="{Binding NumeroEngin}" VerticalAlignment="Bottom" FontSize="30" FontWeight="Bold" HorizontalAlignment="Right"></TextBlock>
</DockPanel>
</DockPanel>
</ControlTemplate>
</Button.Template>
</Button>
Why the command only works on the successes areas (see image) ?
Is there a solution for the command works on the entire button area ?
it is caused by lack of background ( button background is NULL).
Please set background for some color, for example:
<Button Margin="10 10 10 10" Background="Transparent" Command="{Binding GoToSheet}">
Here is the solution for similar problem:
Mouse event on transparent background
It should help.
The transparent background must be on the DockPanel in place of Button.
<Button Margin="10 10 10 10" Command="{Binding GoToSheet}">
<Button.Template>
<ControlTemplate>
<DockPanel Width="840" Background="Transparent">
Thanks to macieqqq.

Adding Scrollbar to ItemsControl

I have a long list coming from my Business logic which I need to display on the UI. As the list is long, I tried adding Scrollviewer but I am unable to scroll.
please find the XAML code below
<Grid Margin="0,32,0,0">
<TextBlock Text="{Binding IDC_WiFi, Source={StaticResource Resources}}" FontFamily="Segoe UI" FontSize="20" Foreground="#4cb5ab" HorizontalAlignment="Left" />
<Button Command="{Binding HardwareWifiAccordionCommand}" BorderThickness="0" Width="16" HorizontalAlignment="Right" Height="16" >
<Button.Background>
<ImageBrush ImageSource="{Binding AccordionImageHardwareWifi}" />
</Button.Background>
</Button>
</Grid>
<TextBlock Text="Klein's, Anil's" FontFamily="Segoe UI" FontSize="15" Foreground="#8fa3ad"/>
<StackPanel Height="200" Visibility="{Binding IsAccordionHardwareWifi, Converter={StaticResource Bool2Visible}}">
<ScrollViewer VerticalScrollBarVisibility="Auto">
<ItemsControl ItemsSource="{Binding WifiList,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,32,0,0">
<Grid>
<Image Source="/Images/Assets/da_wifi1_16x16.png" Height="16" Width="16" HorizontalAlignment="Left" />
<TextBlock Margin="25,0,0,0" Text="{Binding NetworkName}" FontSize="15" Foreground="#FFFFFF" />
<TextBlock Text="" FontSize="15" Foreground="#8fa3ad" HorizontalAlignment="Right" />
</Grid>
<TextBlock Text="" FontSize="15" Foreground="#8fa3ad" HorizontalAlignment="Left" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>
</StackPanel>
Put it into a ScrollViewer.
<ScrollViewer>
<StackPanel >
</StackPanel>
</ScrollViewer>
As #StepUp points out you can just wrap it with a ScrollViewer but I believe this breaks virtualization. That's outside the scope of this question of course but it's something to keep in mind. If performance is likely to become an issue then I'd suggest implementing this as shown in the answer to this question.
The scrollviewer needed a Height to be set
<Grid Margin="0,32,0,0">
<TextBlock Text="{Binding IDC_WiFi, Source={StaticResource Resources}}" FontFamily="Segoe UI" FontSize="20" Foreground="#4cb5ab" HorizontalAlignment="Left" />
<Button Command="{Binding HardwareWifiAccordionCommand}" BorderThickness="0" Width="16" HorizontalAlignment="Right" Height="16" >
<Button.Background>
<ImageBrush ImageSource="{Binding AccordionImageHardwareWifi}" />
</Button.Background>
</Button>
</Grid>
<TextBlock Text="Klein's, Anil's" FontFamily="Segoe UI" FontSize="15" Foreground="#8fa3ad"/>
<StackPanel Height="200" Visibility="{Binding IsAccordionHardwareWifi, Converter={StaticResource Bool2Visible}}">
<ScrollViewer VerticalScrollBarVisibility="Auto" Height="350">
<ItemsControl ItemsSource="{Binding WifiList,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" >
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,32,0,0">
<Grid>
<Image Source="/Images/Assets/da_wifi1_16x16.png" Height="16" Width="16" HorizontalAlignment="Left" />
<TextBlock Margin="25,0,0,0" Text="{Binding NetworkName}" FontSize="15" Foreground="#FFFFFF" />
<TextBlock Text="" FontSize="15" Foreground="#8fa3ad" HorizontalAlignment="Right" />
</Grid>
<TextBlock Text="" FontSize="15" Foreground="#8fa3ad" HorizontalAlignment="Left" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>
</StackPanel>

How to fix the canvas and Tool bar while scrolling

I do not have an idea of how to make the menu bar, tool bar, and canvas fix their positions. While scrolling they shouldn't move.
I have a WPF window where I have a menu bar and a tool bar and two canvases.
Canvas 1 is in XAML and canvas 2 is dynamic through vb.net
Now I want to fix the first three.
Menu bar
Tool bar
Canvas 1
Here is my XAML:
<ScrollViewer HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible" >
<DockPanel>
<Grid ScrollViewer.HorizontalScrollBarVisibility="Visible" >
<Grid.RowDefinitions>
<RowDefinition Height="25" />
<RowDefinition Height="25" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="350"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Menu x:Name="menu1" BorderBrush="AliceBlue" VerticalAlignment="Top" FontFamily="Comic Sans MS" >
<MenuItem Header="_File" Width="92" FontSize="16" FontWeight="Normal" FontFamily="Century Gothic" >
<MenuItem Header="Location" FontSize="16">
<MenuItem Header="01" />
<MenuItem Header="02"/>
<MenuItem Header="03"/>
<MenuItem Header="04"/>
<MenuItem Header="05"/>
<MenuItem Header="06"/>
<MenuItem Header="07"/>
<MenuItem Header="08"/>
<MenuItem Header="09"/>
<MenuItem Header="10"/>
<MenuItem Header="11"/>
<MenuItem Header="12"/>
<MenuItem Header="13"/>
<MenuItem Header="14"/>
</MenuItem>
<MenuItem Header="_Print"/>
<MenuItem Header="_Print Preview"/>
<MenuItem Header="_Exit"/>
</MenuItem>
</Menu>
<ToolBar Grid.Row="1" x:Name="toolBar1" BorderBrush="Red" BorderThickness="3" Margin="0,0,0,900" Grid.RowSpan="2" Height="30" VerticalAlignment="Top" >
<Button x:Name="Zoomin" Click="menuItemZoomin_Click" HorizontalAlignment="Left" Margin="1" Width="90" FontSize="16" FontWeight="SemiBold" Height="55" RenderTransformOrigin ="0.917,0.587" IsHitTestVisible="True" IsEnabled="True" FontFamily="Century Gothic" Content="Zoom In" />
<Button x:Name="Zoomout" Click="menuItemZoomout_Click" HorizontalAlignment="Left" Margin="1" Width="90" FontSize="16" FontWeight="SemiBold" RenderTransformOrigin="0.917,0.587" Height="55" FontFamily="Century Gothic" Content="Zoom Out"/>
<Button x:Name="Print" Click="PrintBtn_Click" HorizontalAlignment="Left" Margin="1" Width="90" FontSize="16" FontWeight="SemiBold" RenderTransformOrigin="0.917,0.587" Height="55" FontFamily="Century Gothic" Content="Print"/>
</ToolBar>
<DockPanel>
<Canvas x:Name="cvsZoneColor" DockPanel.Dock="Top" >
<Rectangle Width="25" Height="25" Margin="60 60 60 950" >
<Rectangle.Fill>
<SolidColorBrush>
<SolidColorBrush.Color>
<Color A="219" R="219" G="249" B="217" />
</SolidColorBrush.Color>
</SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<TextBlock Text="A" Margin="60 80 60 950" Width="20" Height="20" ></TextBlock>
<Rectangle Width="25" Height="25" Margin="90 60 70 990" >
<Rectangle.Fill>
<SolidColorBrush>
<SolidColorBrush.Color>
<Color A="219" R="255" G="238" B="204" />
</SolidColorBrush.Color>
</SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<TextBlock Text="B" Margin="90 80 70 950" Width="20" Height="20" ></TextBlock>
<Rectangle Width="25" Height="25" Margin="120 60 70 990" >
<Rectangle.Fill>
<SolidColorBrush>
<SolidColorBrush.Color>
<Color A="219" R="204" G="238" B="255" />
</SolidColorBrush.Color>
</SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<TextBlock Text="C" Margin="120 80 70 950" Width="20" Height="20" ></TextBlock>
<Rectangle Width="25" Height="25" Margin="150 60 70 990" >
<Rectangle.Fill>
<SolidColorBrush>
<SolidColorBrush.Color>
<Color A="219" R="204" G="238" B="221" />
</SolidColorBrush.Color>
</SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<TextBlock Text="D" Margin="150 80 70 950" Width="20" Height="20" ></TextBlock>
<Rectangle Width="25" Height="25" Margin="180 60 70 990" >
<Rectangle.Fill>
<SolidColorBrush>
<SolidColorBrush.Color>
<Color A="219" R="255" G="221" B="238" />
</SolidColorBrush.Color>
</SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<TextBlock Text="E" Margin="180 80 70 950" Width="20" Height="20" ></TextBlock>
<Rectangle Width="25" Height="25" Margin="210 60 70 990" >
<Rectangle.Fill>
<SolidColorBrush>
<SolidColorBrush.Color>
<Color A="219" R="255" G="238" B="255" />
</SolidColorBrush.Color>
</SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<TextBlock Text="F" Margin="210 80 70 950" Width="20" Height="20" ></TextBlock>
</Canvas>
</DockPanel>
<Canvas x:Name="cvsWarehouse" Focusable="True" ScrollViewer.CanContentScroll="True" ScrollViewer.HorizontalScrollBarVisibility="Visible" ScrollViewer.VerticalScrollBarVisibility="Visible" MouseWheel="Canvas_MouseWheel" Grid.Row="3" RenderTransformOrigin="0.5,0.5" Margin="0,150,0,0" >
<Canvas.LayoutTransform>
<TransformGroup>
<ScaleTransform x:Name ="st1" ScaleX="{Binding Value, ElementName=uiScaleSlider}"
ScaleY="{Binding Value, ElementName=uiScaleSlider}" />
<TranslateTransform Y="100" />
</TransformGroup>
</Canvas.LayoutTransform>
</Canvas>
</Grid>
</DockPanel>
</ScrollViewer>
Scrolling the bar on the right hand side shouldn't move these three highlighted ...
Image
While using DockPanel, it's important to keep note of order.
You should use below XAML as your starting point and modify it for your needs :
<Window ...>
<DockPanel LastChildFill="True">
<Menu x:Name="menu1" BorderBrush="AliceBlue" VerticalAlignment="Top" FontFamily="Comic Sans MS" DockPanel.Dock="Top">
<MenuItem Header="_File" Width="92" FontSize="16" FontWeight="Normal" FontFamily="Century Gothic" >
<MenuItem Header="Location" FontSize="16">
<MenuItem Header="01" />
<MenuItem Header="02"/>
<MenuItem Header="03"/>
<MenuItem Header="04"/>
<MenuItem Header="05"/>
<MenuItem Header="06"/>
<MenuItem Header="07"/>
<MenuItem Header="08"/>
<MenuItem Header="09"/>
<MenuItem Header="10"/>
<MenuItem Header="11"/>
<MenuItem Header="12"/>
<MenuItem Header="13"/>
<MenuItem Header="14"/>
</MenuItem>
<MenuItem Header="_Print"/>
<MenuItem Header="_Print Preview"/>
<MenuItem Header="_Exit"/>
</MenuItem>
</Menu>
<ToolBar x:Name="toolBar1" BorderBrush="Red" BorderThickness="3" Height="30" VerticalAlignment="Top" DockPanel.Dock="Top">
<Button x:Name="Zoomin" Click="menuItemZoomin_Click" HorizontalAlignment="Left" Margin="1" Width="90" FontSize="16" FontWeight="SemiBold" Height="55" RenderTransformOrigin ="0.917,0.587" IsHitTestVisible="True" IsEnabled="True" FontFamily="Century Gothic" Content="Zoom In" />
<Button x:Name="Zoomout" Click="menuItemZoomout_Click" HorizontalAlignment="Left" Margin="1" Width="90" FontSize="16" FontWeight="SemiBold" RenderTransformOrigin="0.917,0.587" Height="55" FontFamily="Century Gothic" Content="Zoom Out"/>
<Button x:Name="Print" Click="PrintBtn_Click" HorizontalAlignment="Left" Margin="1" Width="90" FontSize="16" FontWeight="SemiBold" RenderTransformOrigin="0.917,0.587" Height="55" FontFamily="Century Gothic" Content="Print"/>
</ToolBar>
<Canvas Background="Pink" DockPanel.Dock="Bottom" Height="25">
<TextBlock Text="Bottom"/>
</Canvas>
<ScrollViewer>
<Canvas Background="Red" ScrollViewer.VerticalScrollBarVisibility="Visible">
<Button Content="Press"/>
</Canvas>
</ScrollViewer>
</DockPanel>
</Window>
I think this might get you a UI closer to what it looks like you are trying to do. If you make the XAML to use the dock panel more, you can get a more fixed UI.
<DockPanel LastChildFill="True">
<Menu x:Name="menu1" DockPanel.Dock="Top">
<MenuItem Header="_File" >
...
</Menu>
<ToolBar x:Name="toolBar1" DockPanel.Dock="Top">
...
</ToolBar>
<Grid x:Name="cvsZoneColor" DockPanel.Dock="Top">
<StackPanel Orientation="Vertical">
<Rectangle Width="25" Height="25" Margin="60 0 60 0" >
...
</Rectangle>
<TextBlock Text="A" Margin="60 0 60 0" Width="20" Height="20"/>
</StackPanel>
...
</Grid>
<ScrollViewer DockPanel.Dock="Bottom">
<Canvas x:Name="cvsWarehouse">
...
</Canvas>
</ScrollViewer>
</DockPanel>

Remove MenuItem White Space Inside ComboBox

I have a menuitem nestled within a combobox and I've not been able to get rid of the terrible white space to the left and right of it.
The code is:
<Grid>
<ComboBox Name="SettingsCmbx" Text="Options" Foreground="White" VerticalContentAlignment="Center" HorizontalContentAlignment="Stretch" Width="80" Style="{StaticResource blackGradientComboBox}" Margin="3">
<ComboBox.ItemsSource>
<CompositeCollection>
<!--<ComboBoxItem Name="Options" IsEnabled="False" Style="{StaticResource blackComboBoxItem}">Options</ComboBoxItem>-->
<ComboBoxItem Style="{StaticResource blackComboBoxItem}">Guidelines</ComboBoxItem>
<ComboBoxItem Style="{StaticResource blackComboBoxItem}">Copy Investigation</ComboBoxItem>
<MenuItem Name="CurrencySelectMenuItem" Header="Currency" Background="Black" Foreground="White" BorderThickness="0" Margin="0" BorderBrush="Black" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<MenuItem Name="DollarSelectMenuItem" Tag="36" Header="$ - Dollar" Background="Black" Foreground="White"></MenuItem>
<MenuItem Name="PoundSelectMenuItem" Tag="163" Header="£ - Pound" Background="Black" Foreground="White"></MenuItem>
</MenuItem>
<ComboBoxItem Style="{StaticResource blackComboBoxItem}">About</ComboBoxItem>
</CompositeCollection>
</ComboBox.ItemsSource>
</ComboBox>
<TextBlock Name="OptionsTxtBlk" Text="Options" IsHitTestVisible="False" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Grid>
It looks like this:
I resolved this by adding negative margins on either side. Margin = "-5,0,-5,0"

Resources