The goal is to make a User Control Keyboard so I installed InputSimulator from NuGet, I tried it with a button and it's working well of course after setting the property Focusable of that button to False, but when I created a keyboard as a UserControl, the keyboard not working (not typing characters).
Here is the code from the xaml.cs of the User Control:
private void clickAlphabet(VirtualKeyCode virtualKey)
{
var inputSim = new InputSimulator();
inputSim.Keyboard.KeyPress(virtualKey);
}
private void Button_Click(object sender, RoutedEventArgs e)
{
clickAlphabet(VirtualKeyCode.VK_A);
}
Xaml of user control(one button):
<Button Content="a" Click="Button_Click"/>
This code is from App.xaml:
<Style TargetType="Button">
<Setter Property="Focusable" Value="False"/>
</Style>
Here is how I called the keyboard User Control:
<controls:ucKeyboard Margin="7 300"></controls:ucKeyboard>
This is the whole xaml of the user control:
<UserControl x:Class="SmartCaisse.PL.UserControls.ucKeyboard"
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"
xmlns:local="clr-namespace:SmartCaisse.PL.UserControls"
mc:Ignorable="d"
d:DesignHeight="268" d:DesignWidth="797">
<Border CornerRadius="0 0 15 15" Background="green">
<Grid Width="797">
<Grid.RowDefinitions>
<RowDefinition Height="60"/>
<RowDefinition Height="7"/>
<RowDefinition Height="60"/>
<RowDefinition Height="7"/>
<RowDefinition Height="60"/>
<RowDefinition Height="7"/>
<RowDefinition Height="60"/>
</Grid.RowDefinitions>
<Grid.Resources>
<Style TargetType="{x:Type Button}">
<Setter Property="Margin" Value="0,0,7,0"/>
<Setter Property="Width" Value="60"/>
<Setter Property="Height" Value="60"/>
<Setter Property="Background" Value="{x:Null}"/>
<Setter Property="Foreground" Value="#fff"/>
<Setter Property="FontFamily" Value="Tahoma"/>
<Setter Property="FontSize" Value="20"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Background="{TemplateBinding Background}" BorderBrush="#fff" BorderThickness="2" Focusable="False">
<ContentPresenter HorizontalAlignment="center" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="StackPanel">
<Setter Property="Orientation" Value="Horizontal"/>
</Style>
</Grid.Resources>
<StackPanel Grid.Row="0">
<Button Content="a" Click="Button_Click"/>
<Button Content="z"/>
<Button Content="e"/>
<Button Content="r"/>
<Button Content="t"/>
<Button Content="y"/>
<Button Content="u"/>
<Button Content="i"/>
<Button Content="o"/>
<Button Content="p"/>
<Button Width="127 ">
<Image Source="/assets/Icons/VirtualKeyboardIcons/backspace.png" Width="24" Height="24"></Image>
</Button>
</StackPanel>
<StackPanel Grid.Row="2" HorizontalAlignment="Right">
<Button Content="q"/>
<Button Content="s"/>
<Button Content="d"/>
<Button Content="f"/>
<Button Content="g"/>
<Button Content="h"/>
<Button Content="j"/>
<Button Content="k"/>
<Button Content="l"/>
<Button Content="m"/>
<Button Content="Entrée" Width="103" Margin="0"/>
</StackPanel>
<StackPanel Grid.Row="4">
<Button>
<Image Source="/assets/Icons/VirtualKeyboardIcons/arrow-up.png" Width="24" Height="24"></Image>
</Button>
<Button Content="w"/>
<Button Content="x"/>
<Button Content="c"/>
<Button Content="v"/>
<Button Content="b"/>
<Button Content="n"/>
<Button Content=","/>
<Button Content="."/>
<Button Content="-"/>
<Button Content="_"/>
<Button>
<Image Source="/assets/Icons/VirtualKeyboardIcons/arrow-up.png" Width="24" Height="24"></Image>
</Button>
</StackPanel>
<Border Grid.Row="6" CornerRadius="0 0 15 15">
<StackPanel>
<Button Content="&123" FontSize="18"/>
<Button Content="#"/>
<Button Width="529"/>
<Button>
<Image Source="/assets/Icons/VirtualKeyboardIcons/arrow-left.png" Width="24" Height="24"></Image>
</Button>
<Button>
<Image Source="/assets/Icons/VirtualKeyboardIcons/arrow-right.png" Width="24" Height="24"></Image>
</Button>
</StackPanel>
</Border>
</Grid>
</Border>
Update: I found that this code (in App.XAML file) doesn't take effect on buttons in the user control:
<Style TargetType="Button">
<Setter Property="Focusable" Value="False"/>
</Style>
So I rewrite it in the XAML file of the user control, this is not a problem.
The problem is, I found out that if I click on the text of the button (property Content) it work but if I click in the rest space of the button it doesn't work, see this image:
I found the code that created this problem, this block of code from XAML file of the user control, I added it to remove the default hover effect of buttons:
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Background="{TemplateBinding Background}" BorderBrush="#fff" BorderThickness="2" Focusable="False">
<ContentPresenter HorizontalAlignment="center" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
So I guess the solution is to find another way to remove the hover effect, any other way to remove it ??
I update your Button Style as below, it can work for click whole button.
<Style TargetType="{x:Type Button}">
<Setter Property="Margin" Value="0,0,7,0"/>
<Setter Property="Width" Value="60"/>
<Setter Property="Height" Value="60"/>
<Setter Property="Background" Value="{x:Null}"/>
<Setter Property="Foreground" Value="#fff"/>
<Setter Property="FontFamily" Value="Tahoma"/>
<Setter Property="FontSize" Value="20"/>
<Setter Property="BorderBrush" Value="#fff"></Setter>
<Setter Property="BorderThickness" Value="2"></Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Transparent"/>
</Trigger>
</Style.Triggers>
</Style>
Related
I am trying to make a costume button in c# wpf. I used material design themes for inserting an icon inside the button but when I run the program, only the icon inside the button is click able not the whole button. what should I do to fix this?
I did this for button style:
<Application.Resources>
<Style x:Key="MyButton" TargetType="{x:Type Button}">
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border Name="border" BorderThickness="0" Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True" >
<Setter Property="Opacity" Value="0.8" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Application.Resources>
here is the button:
<Button x:Name="btnClose" Style="{StaticResource MyButton}" Width="30" Height="30" Padding="0" Background="{x:Null}" BorderBrush="{x:Null}" Foreground="Gray" Margin="10 0" Click="btnClose_Click">
<materialDesign:PackIcon Kind="Power" Height="30" Width="30"></materialDesign:PackIcon>
</Button>
Set the Background property to a Brush like for example Transparent instead of setting it to {x:Null}:
<Button x:Name="btnClose" Style="{StaticResource MyButton}" Width="30" Height="30" Padding="0"
Background="Transparent" BorderBrush="{x:Null}" Foreground="Gray" Margin="10 0" Click="btnClose_Click">
<materialDesign:PackIcon Kind="Power" Height="30" Width="30"></materialDesign:PackIcon>
</Button>
I'm trying set backcolor for all grid layout in my project using resource dictionary. This is code of file where i modify my grid.
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:Theme">
<SolidColorBrush x:Key="GridBackColor" Color="Red"/>
<Style TargetType="Grid">
<Setter Property="Background" Value="{StaticResource GridBackColor}"/>
<Setter Property="Opacity" Value="0.5"/>
</Style>
</ResourceDictionary>
After set Background property all controls on grid were disappear, but when i set opacity i can only say that all controls are under grid layout and any mouse events not work.
Here how it's look like:
this is my window code.
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10*"/>
<ColumnDefinition Width="125"/>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="125"/>
<ColumnDefinition Width="10*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="10*"/>
<RowDefinition Height="40"/>
<RowDefinition Height="40"/>
<RowDefinition Height="20"/>
<RowDefinition Height="30"/>
<RowDefinition Height="10*"/>
</Grid.RowDefinitions>
<Label Content="Name" Grid.Column="1" Grid.Row="1" Grid.ColumnSpan="3" FontSize="20"
HorizontalAlignment="Stretch" VerticalAlignment="Center"/>
<TextBox Name="TbName" Grid.Column="1" Grid.Row="2" Grid.ColumnSpan="3" FontSize="20"
HorizontalAlignment="Stretch" />
<Button Content="Add" Name="BtAdd" Grid.Column="1" Grid.Row="4" IsDefault="True"
HorizontalAlignment="Right" VerticalAlignment="Center" Width="100" Click="BtAdd_Click"/>
<Button Content="Close" Name="BtClose" Grid.Column="3" Grid.Row="4" IsCancel="True"
HorizontalAlignment="Left" Width="100" Click="BtClose_Click"/>
</Grid>
When you applied you style globally to all the Grids in your application, the ones used inside other controls will also be affected. For instance take a look at the Window control (from the vs designer, left click on the window > Edit Template > Edit a copy)
<Window.Resources>
<ControlTemplate x:Key="WindowTemplateKey" TargetType="{x:Type Window}">
<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}">
<Grid>
<AdornerDecorator>
<ContentPresenter/>
</AdornerDecorator>
<ResizeGrip x:Name="WindowResizeGrip" HorizontalAlignment="Right" IsTabStop="false" Visibility="Collapsed" VerticalAlignment="Bottom"/>
</Grid>
</Border>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="ResizeMode" Value="CanResizeWithGrip"/>
<Condition Property="WindowState" Value="Normal"/>
</MultiTrigger.Conditions>
<Setter Property="Visibility" TargetName="WindowResizeGrip" Value="Visible"/>
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<Style x:Key="WindowStyle1" TargetType="{x:Type Window}">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.WindowTextBrushKey}}"/>
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Window}">
<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}">
<AdornerDecorator>
<ContentPresenter/>
</AdornerDecorator>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="ResizeMode" Value="CanResizeWithGrip">
<Setter Property="Template" Value="{StaticResource WindowTemplateKey}"/>
</Trigger>
</Style.Triggers>
</Style>
</Window.Resources>
Notice the Grid defined in the Border inside the ControlTemplate.
An easy fix to your issue is to assign a key to your style and assign it to the Grid manually:
<Style TargetType="Grid" x:Key="GridStyle">
<Setter Property="Background" Value="{StaticResource GridBackColor}"/>
<Setter Property="Opacity" Value="0.5"/>
</Style>
To use it:
<Grid Style="{StaticResource GridStyle}">
...
</Grid>
I want to hide/show WPF RichTextBox left border sometimes in code behind and also for right border sometimes.
Can this be achieved?
I've already tried in XAML like this borderthickness ="3,3,0,3". It hides my right side, now I need to show that right side border and also hide my right side border.
How do I do that?
Updated:
<Window x:Class="View.SingleLineTextMode"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="SingleLineTextMode" Height="300" Width="300" WindowState="Maximized" WindowStyle="None" WindowStartupLocation="CenterScreen" Background="Black">
<Window.Resources>
<Style x:Key="MyStyle" BasedOn="{x:Null}" TargetType="{x:Type RichTextBox}">
<Setter Property="BorderThickness" Value="3"/>
<Setter Property="Padding" Value="0,5,0,0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RichTextBox}">
<Border x:Name="bg" BorderBrush="Yellow" BorderThickness="3,3,0,3" Background="{TemplateBinding Background}">
<ScrollViewer x:Name="PART_ContentHost" IsDeferredScrollingEnabled="True" CanContentScroll="False" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="BorderBrush" TargetName="bg" Value="Yellow"/>
<Setter Property="BorderThickness" TargetName="bg" Value="3,3,0,3"/>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="BorderBrush" TargetName="bg" Value="Yellow"/>
<Setter Property="BorderThickness" TargetName="bg" Value="3,3,0,3"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid>
<!--<RichTextBox Name="txtAppendValue" Height="60" Width="1920" Style="{StaticResource MyStyle}" Margin="0,0,-10,0" FontSize="60" FontFamily="Arial" IsReadOnly="True" Focusable="False" Cursor="Arrow" BorderThickness="3,3,3,3" IsUndoEnabled="False" UndoLimit="0" TextOptions.TextFormattingMode="Display" VirtualizingPanel.IsVirtualizing="True" VirtualizingPanel.VirtualizationMode="Recycling" VirtualizingPanel.CacheLength="2,3" VirtualizingPanel.CacheLengthUnit="Page" TextBlock.LineHeight="100" Padding="0">
</RichTextBox>-->
<RichTextBox Name="txtAppendValue" HorizontalAlignment="Center" VerticalAlignment="Center" Height="60" Width="1920" Style="{StaticResource MyStyle}" Margin="0,0,0,0" FontSize="40" FontFamily="Arial" IsReadOnly="True" Focusable="False" Cursor="Arrow" IsUndoEnabled="False" UndoLimit="0" TextOptions.TextFormattingMode="Display" VirtualizingPanel.IsVirtualizing="True" VirtualizingPanel.VirtualizationMode="Recycling" VirtualizingPanel.CacheLength="2,3" VirtualizingPanel.CacheLengthUnit="Page" TextBlock.LineHeight="100" >
</RichTextBox>
<Label Name="lblStatusUpdate" ></Label>
</Grid>
</Window>
The above one is my XAML.
txtAppendValue.BorderThickness=new Thickness("0,3,0,3");
But its not working.
Regards
Arjun
You can do the same thing from code like this:
myRichTextBox.BorderThickness = new Thickness(3,3,0,3);
Then if all borders need to have same thickness, you can use only one number:
myRichTextBox.BorderThickness = new Thickness(3);
Edit:
Since you are using style, you can define multiple styles and then switch between them:
<Style x:Key="MyStyleNoBorders" BasedOn="{x:Null}" TargetType="{x:Type RichTextBox}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RichTextBox}">
<Border x:Name="bg" BorderBrush="Yellow" BorderThickness="0,3,0,3" Background="{TemplateBinding Background}">
<ScrollViewer x:Name="PART_ContentHost" IsDeferredScrollingEnabled="True" CanContentScroll="False" />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="MyStyleBothBorders" BasedOn="{x:Null}" TargetType="{x:Type RichTextBox}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RichTextBox}">
<Border x:Name="bg" BorderBrush="Yellow" BorderThickness="3" Background="{TemplateBinding Background}">
<ScrollViewer x:Name="PART_ContentHost" IsDeferredScrollingEnabled="True" CanContentScroll="False" />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Make sure your RichTextBox is not too wide to fit the screen, or you will not be able to see the borders. Then in code just use a call to change styles:
txtAppendValue.Style = FindResource("MyStyleNoBorders") as Style;
and
txtAppendValue.Style = FindResource("MyStyleBothBorders") as Style;
In my WPF application I want to to change borderbrush color for a TextBox when mouse enter, but it does not change color to the one I want, but it change to sky blue (I guess it is standard color).
Here is my XAML code:
<Window x:Class="OnePlayApp.Views.LoginDialog"
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:OnePlayApp.Views"
WindowStyle="None"
ResizeMode="NoResize"
Title="LoginDialog" Height="350" Width="550" Foreground="Black">
<Grid Background="#282828">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="24*"/>
<ColumnDefinition Width="43*"/>
<ColumnDefinition Width="43*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="59*"/>
<RowDefinition Height="50*"/>
<RowDefinition Height="50*"/>
<RowDefinition Height="191*"/>
</Grid.RowDefinitions>
<Image Margin="9,10,173,6" Source="/Resources/logo.png" Grid.ColumnSpan="2"/>
<Label x:Name="AccountName" Content="Account name" Margin="6,10,1,13" Foreground="#FFAFADAD" HorizontalContentAlignment="Right" Grid.Row="1"/>
<Label x:Name="Password" Content="Password
" Margin="6,10,1,13" Foreground="#FFAFADAD" HorizontalContentAlignment="Right" Grid.Row="2"/>
<TextBox x:Name="username" Margin="6,11,15,8" Background="#FF282828" Foreground="White" FontSize="15" Text="Ahsep12015#one.com" FontFamily="Yu Gothic UI Semibold" Grid.Column="1" Grid.Row="1" Grid.ColumnSpan="2" VerticalContentAlignment="Center" BorderThickness="10">
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Setter Property="BorderBrush" Value="Green" />
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="BorderBrush" Value="Red" />
</Trigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
<PasswordBox x:Name="password" Margin="6,8,15,13" Background="#FF282828" Password="123456789" FontSize="18" Grid.Column="1" Grid.Row="2" Grid.ColumnSpan="2"/>
<Button x:Name="LoginBtn" Content="Login" Margin="6,15,15,146" Click="LoginBtn_Click" FontSize="16" FontFamily="Yu Gothic UI Semibold" Foreground="White" Grid.Column="1" Grid.Row="3">
<Button.Style>
<Style TargetType="{x:Type Button}">
<Setter Property="Background" Value="#FFAFADAD"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="#79B539"/>
</Trigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
<Button x:Name="CancelBtn" Content="Cancel" Margin="6,15,15,146" Click="CancelBtn_Click" FontSize="16" FontFamily="Yu Gothic UI Semibold" Foreground="White" Grid.Column="2" Grid.Row="3">
<Button.Style>
<Style TargetType="{x:Type Button}">
<Setter Property="Background" Value="#FFAFADAD"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="#79B539"/>
</Trigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
</Grid>
</Window>
I had the same issue on Windows 8, and the only way I was able to fix this issue (which appears to be a bug in WPF) was with a ControlTemplate. This is the standard control template for a TextBox as coughed up by Blend. I changed the BorderBrush colors, added it to my global TextBox style, and it works great. There may be a better solution out there, but this is what works for me.
<Style TargetType="{x:Type TextBox}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBoxBase}">
<Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
<ScrollViewer x:Name="PART_ContentHost" Focusable="False" HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Hidden"/>
</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="Red"/>
</Trigger>
<Trigger Property="IsKeyboardFocused" Value="True">
<Setter Property="BorderBrush" TargetName="border" Value="Orange"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
I've left all my windows with Style=None, and put this usercontrol on top-right corner of it.
<UserControl x:Class="SayRecep.Controls.WindowControls"
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="27" d:DesignWidth="80">
<UserControl.Resources>
<Style TargetType="Button" x:Key="WindowControlButton">
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="Foreground" Value="#BBBBBB" />
<Setter Property="Margin" Value="2,0" />
<Setter Property="Background" Value="Blue" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Background="Blue" Width="20" Height="16">
<ContentPresenter />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="White" />
</Trigger>
</Style.Triggers>
</Style>
</UserControl.Resources>
<Grid>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,9,6,0">
<Button ToolTip="Minimize" Style="{StaticResource WindowControlButton}" Click="Button_Click">
<Button.Content>
<Grid Width="12" Height="8" VerticalAlignment="Bottom" >
<Path Data="M0,1 L4,1 Z" VerticalAlignment="Center" HorizontalAlignment="Center"
Stroke="White" StrokeThickness="2" />
</Grid>
</Button.Content>
</Button>
<Grid MouseDown="Grid_MouseDown">
<Button x:Name="Restore" ToolTip="Restore" Click="Restore_Click" Style="{StaticResource WindowControlButton}" Visibility="Visible">
<Button.Content>
<Grid UseLayoutRounding="True" RenderTransform="1,0,0,1,.5,.5">
<Path Margin="0,0,0,0" Data="M2,0 L8,0 L8,6 M0,3 L6,3 M0,2 L6,2 L6,8 L0,8 Z" VerticalAlignment="Center" HorizontalAlignment="Center"
Stroke="White" StrokeThickness="1" />
</Grid>
</Button.Content>
</Button>
<Button x:Name="Maximize" ToolTip="Maximize" Click="Maximize_Click" Visibility="Collapsed" Style="{StaticResource WindowControlButton}" >
<Button.Content>
<Grid>
<Path Data="M0,1 L9,1 L9,8 L0,8 Z" VerticalAlignment="Center" HorizontalAlignment="Center"
Stroke="White" StrokeThickness="2" />
</Grid>
</Button.Content>
</Button>
</Grid>
<Button ToolTip="Close" Style="{StaticResource WindowControlButton}" Click="Button_Click_1" >
<Button.Content>
<Grid Width="12" Height="12" >
<Path Data="M0,0 L14,14 M0,14 L14,0" Stretch="Fill" VerticalAlignment="Center" HorizontalAlignment="Center"
Stroke="White" StrokeThickness="2.25" />
</Grid>
</Button.Content>
</Button>
</StackPanel>
</Grid>
I'm using these for Mimimize, Restore/Maximize and Close the Window.
The problem is that the mouse identifies the button only bottom half of it.
Does'nt raise Click, MouseOver or wont even show the Tooltip from its top half.
In the Template you can see a blue border, Actually that wasn't there before. I kept that to analyse the problem thinking making it transparent might solve. But didn't.
This style works now
<Style TargetType="Button" x:Key="WindowControlButton">
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="Foreground" Value="#BBBBBB" />
<Setter Property="Margin" Value="2,0" />
<Setter Property="Background" Value="Blue" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border Background="{TemplateBinding Background}">
<ContentPresenter />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Red"/>
</Trigger>
</Style.Triggers>
</Style>