Develop Reference

How to remove ContextMenu border

So im trying to make button appear on right click in my ListBox.
<ListBox Grid.Column="1" Margin="358,44,20,63" Name="scriptbox" Background="#FF282828" Foreground="White" SelectionChanged="Scriptbox_SelectionChanged" BorderThickness="0">
<ListBox.ContextMenu>
<ContextMenu>
<MenuItem
Template="{DynamicResource MenuItemTemplate}"
Header="Delete"
Click="MenuItemDelete_Click" >
</MenuItem>
</ContextMenu>
</ListBox.ContextMenu>
This is my MenuItem template.
<ControlTemplate TargetType="{x:Type MenuItem}" x:Key="MenuItemTemplate">
<Border x:Name="Border" Background="#FF282828" Padding="30,5,30,5" BorderThickness="0" Margin="0">
<ContentPresenter ContentSource="Header" x:Name="HeaderHost" RecognizesAccessKey="True" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsHighlighted" Value="true">
<Setter Property="Background" TargetName="Border" Value="#51544e"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<ItemsPanelTemplate x:Key="MenuItemPanelTemplate">
<StackPanel Margin="-3,0,0,0" Background="White"/>
</ItemsPanelTemplate>
<Style TargetType="{x:Type MenuItem}">
<Setter Property="ItemsPanel" Value="{StaticResource MenuItemPanelTemplate}"/>
</Style>
Everything is fine but there is white border all around the button.

What you recognize as a white border is the ContextMenu itself that contains your MenuItems. Try adding more buttons and changing the Background and BorderBrush of the ContextMenu and you will see.
<ContextMenu Background="Red" BorderBrush="Blue">
Changing the brushes like this will lead to this result, which makes it obvious.
If you create a custom control template for your MenuItems you should probably do so for the ContextMenu, too, if only setting brushes does not fit your requirements. As you can see in the example, there is still a vertical white line that is part of the default control template, that you might want to get rid of. You can start from this example, although it is neither the default template nor complete. Look at this related post for guidance on how to extract the default control template for ContextMenu if you need it.

Removing full screen in xaml dynamically

This will probably be very simple for most of you, I am new to XAML and WPF.
I have an app that startes att full screen, I did this by adding
WindowState="Maximized"
WindowStyle="None"
I want to have a button that simply eliminates this part. I have a "Full screen" button in the xaml and by click he is calling a "FullScreen_Click" function in my code.
I just need to know what to write in the code that will eliminate the full screen if it is on full screen mode and restore it to full screen when it is not.

Try this:
private void FullScreen_Click(object sender, RoutedEventArgs e)
{
WindowState = WindowState == WindowState.Maximized ? WindowState.Normal : WindowState.Maximized;
}
This will toggle between WindowState.Maximized and WindowState.Normal each time the Button is clicked.

For a xaml only technique just for reference to see a xaml example in comparison (but I would do #mm8's route, it's simpler);
1. Bind your property to that of another like:
<Window WindowState="{Binding Tag, ElementName=toggleState}" .... />
2. Use a `ToggleButton` or similar control and `Triggers`
.
<!-- like this PoC -->
<Grid>
<Grid.Resources>
<Style x:Key="cwWindowState_PoC" TargetType="{x:Type ToggleButton}">
<Setter Property="Tag" Value="Maximized"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ToggleButton">
<Grid>
<Border Background="{TemplateBinding Background}"/>
<ContentPresenter x:Name="MyContentPresenter"
Content="{TemplateBinding Tag}"
HorizontalAlignment="Center"
VerticalAlignment="Center" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Tag" Value="Normal" />
</Trigger>
<Trigger Property="IsChecked" Value="False">
<Setter Property="Tag" Value="Maximized" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Grid.Resources>
<ToggleButton x:Name="toggleState" Content="Click Me"
Background="Green"
Style="{StaticResource cwWindowState_PoC}"/>
</Grid>
Could also use DataTrigger but that requires interaction triggers instead of just a property setter from a template.

WPF ComboBox EditTemplate - TextBox border is not going away

I am using a DEVExpress combobox and have enabled type ahead (Auto search functioanlity). In combo box I am showing two things. First item is an image and second item is a value(id).
Mine problem is that the value border is getting outside to combo box while showing at UI at run time. I tried setting margin but its of no use. My application is having option to select theme and for some of the theme its getting hazy.
Any idea how to get rid of this ?
see the first one is looking fine however the below one is bit hazy if i change the theme.
I am using below code for the same.
<dvEx:ComboBoxEdit.EditTemplate>
<ControlTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Path=(dxe:BaseEdit.OwnerEdit).SelectedItem.Image, RelativeSource={RelativeSource Self}}" Margin="8, 0, 4, 0"/>
<TextBox x:Name="PART_Editor" BorderBrush="Transparent"/>
</StackPanel>
</ControlTemplate>
</dvEx:ComboBoxEdit.EditTemplate>
<dvEx:ComboBoxEdit.ItemTemplate>
<DataTemplate DataType="{x:Type vm:DesignSelectViewModel}">
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Image}" Margin="8, 0, 4, 0"/>
<TextBlock Text="{Binding Name}"/>
</StackPanel>
</DataTemplate>
</dvEx:ComboBoxEdit.ItemTemplate>

To accomplish your task I suggest you to override the TextBox.Template as follows to make it theme-independent and remove it's focused state (border and background):
<TextBox x:Name="PART_Editor">
<TextBox.Template>
<ControlTemplate TargetType="{x:Type TextBox}">
<Grid x:Name="Root" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
<ScrollViewer x:Name="PART_ContentHost" Margin="1" Padding="{TemplateBinding Padding}"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsReadOnly" Value="True">
<Setter Property="Opacity" TargetName="PART_ContentHost" Value="0.75"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Opacity" TargetName="Root" Value="0.5"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</TextBox.Template>
</TextBox>
Related MSDN article: TextBox Styles and Templates

wp7 c# implement trigger on control template

I'm building a small wp7 application in which I have a star user control, when the star is clicked its color changes.
Here's the code I've got:
<Grid.Resources>
<ControlTemplate x:Key="starTemplate" TargetType="ToggleButton">
<Viewbox>
<Path Name="star" Fill="Gray" Data="F1 M 145.637,174.227L 127.619,110.39L 180.809,70.7577L 114.528,68.1664L 93.2725,5.33333L 70.3262,67.569L 4,68.3681L 56.0988,109.423L 36.3629,172.75L 91.508,135.888L 145.637,174.227 Z"/>
</Viewbox>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="star" Property="Fill" Value="White"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<ToggleButton Grid.Column="0" Tag="1" Cursor="Hand" Template="{StaticResource starTemplate}" Click="RatingButtonClickEventHandler"/>
the problem is that its giving me an error on the trigger:
The attachable property 'Triggers' was not found in type 'ControlTemplate'
I've read in this link that silverlight 3 doesn't support style triggers and that I have to implement DataTrigger somewhere. The question is How?

How can I set a border around a control during runtime in WPF?

I have an Image control on my WPF Form. How can I create a border around it during runtime?
Here's my XAML code:
<Image Margin="2.5"
Grid.Column="1" Grid.Row="0"
x:Name="Behemoth" Source="Images/Hero/Behemoth.gif" Stretch="Fill"
MouseEnter="HeroMouseEnter"
MouseLeave="HeroMouseLeave"
MouseDown="HeroMouseClick" />
Also, I want to know how to remove the border.
Maybe if I state my problem better there is an even better solution available.
I have many Images, and when a user says: "Hey, just show me the woman out of all the picture." I want a way to sort of highlight or draw the users attention to whatever images I need them to see. I was thinking about adding a border, but maybe that's too much work for something that can be solved easier.
Any help?

Although it's visually very different from a border, you could use an outter glow to signify the importance of the image. Then, you don't have to change the parent of the image.
Alternatively, you could use a custom Adorner to place a border around the image. Good info on Adorners can be found on msdn.

There's no straightforward way to do it, because the Border is a container, so you would have to remove the Image from its parent, put the Border instead, and put the Image back in the Border...
Another option would be to use templates :
<Window.Resources>
<ControlTemplate x:Key="imageWithBorder" TargetType="{x:Type Image}">
<Border BorderBrush="Red" BorderThickness="2">
<Image Source="{TemplateBinding Source}" />
</Border>
</ControlTemplate>
</Window.Resources>
...
<Image Name="image1" Source="foo.png"/>
When you want to put the border around the image, just assign the template to the image :
image1.Template = this.FindResource("imageWithBorder") as ControlTemplate;

For your stated needs, I suggest you use a ListBox with a custom ItemContainerStyle - one that always has a border but only makes it visible if the item is selected.
Here's the basic idea:
<ListBox ItemsSource="{Binding MyImageObjects}">
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<Border x:Name="border">
<ContentPresenter />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="ListBoxItem.IsSelected" Value="True">
<Setter ElementName="border" Property="BorderBrush" Value="Blue" />
<Setter ElementName="border" Property="BorderThickness" Value="2" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.ItemContainerStyle>
</ListBox>