I can't find the default WPF ControlTemplate for a CheckBox. Does anyone know how to locate it? All I can find is the SilverLight default checkbox template on MSDN.
MSDN has a custom control template for the WPF checkbox example which uses X's instead of check marks. I'm specifically looking for the default check mark style that comes standard with WPF - I just can't locate the XAML for it.
I've also tried saving the template using XamlWriter to no avail. Downloading the Simple Styles template from WPF Control Templates sample also just uses the X's instead of classic check marks.
I haven's seen the default styles for any other theme but Classic available online but if you happend to find them, please post back here :) I think the templates over at MSDN are usually the Classic theme.
You can use Expression Blend to get it, you can download a trial here.
Select the CheckBox, go to Object -> Edit Style -> Edit a Copy.
Assuming you are after the windows 7 (aero) style, here it is
<SolidColorBrush x:Key="CheckBoxFillNormal" Color="#F4F4F4"/>
<SolidColorBrush x:Key="CheckBoxStroke" Color="#8E8F8F"/>
<Style x:Key="EmptyCheckBoxFocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Margin="1" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="CheckRadioFocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Margin="14,0,0,0" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="CheckBoxStyle1" TargetType="{x:Type CheckBox}">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="Background" Value="{StaticResource CheckBoxFillNormal}"/>
<Setter Property="BorderBrush" Value="{StaticResource CheckBoxStroke}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="FocusVisualStyle" Value="{StaticResource EmptyCheckBoxFocusVisual}"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type CheckBox}">
<BulletDecorator Background="Transparent" SnapsToDevicePixels="true">
<BulletDecorator.Bullet>
<Microsoft_Windows_Themes:BulletChrome BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" IsChecked="{TemplateBinding IsChecked}" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}"/>
</BulletDecorator.Bullet>
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</BulletDecorator>
<ControlTemplate.Triggers>
<Trigger Property="HasContent" Value="true">
<Setter Property="FocusVisualStyle" Value="{StaticResource CheckRadioFocusVisual}"/>
<Setter Property="Padding" Value="4,0,0,0"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Another way to get all WPF controls control templates is to use this fantastic application : http://www.sellsbrothers.com/posts/details/2091
Related
I am trying to get the highlight color of the selected items in my ListBox to stay the same when the ListBox loses focus. After hours scouring the internet and trying different solutions I can't get anything to work. Please help me understand why the solution I'm trying now doesn't seem to change anything.
This is defined at the top of my xaml within Window:
<Window.Resources>
<Style x:Key="myListboxStyle">
<Style.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Red" />
<SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Red" />
</Style.Resources>
</Style>
</Window.Resources>
and this is my listbox:
<ListBox x:Name="lstNaes" Style="{StaticResource myListboxStyle}" DisplayMemberPath="Name" Margin="5" SelectionMode="Extended"/>
The color (red) is just to test. What I really want is the default highlight color, and for it to not change when the ListBox (or ListView) loses focus. I don't understand why no solutions I've found seem to work for me.
If you are on Windows 8 or later you should define a custom ControlTemplate for the ListViewItem containers:
<ListBox x:Name="lstNaes" DisplayMemberPath="Name" Margin="5" SelectionMode="Extended">
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" TargetName="Bd" Value="#1F26A0DA"/>
<Setter Property="BorderBrush" TargetName="Bd" Value="#a826A0Da"/>
</Trigger>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" TargetName="Bd" Value="#3D26A0DA"/>
<Setter Property="BorderBrush" TargetName="Bd" Value="#FF26A0DA"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="TextElement.Foreground" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.ItemContainerStyle>
</ListBox>
I'm fighting with a dummy issue for hours.
In wpf I want to override the behaviour of a Button, and at the moment the basic behaviour I want is reached (a certain color).
But I'm not able to say simply: on mouseover add underline style!
I'm able to add underline but I'm not able to remove the square around the text!
The style I'm using is:
<Style TargetType="Button">
<Setter Property="Foreground" Value="{DynamicResource {x:Static vs_shell:EnvironmentColors.CommandBarMenuLinkTextBrushKey}}"></Setter>
<Setter Property="Cursor" Value="Hand"></Setter>
<Setter Property="Background" Value="Transparent"></Setter>
<Setter Property="BorderThickness" Value="0"></Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<TextBlock TextDecorations="Underline" Text="{TemplateBinding Content}" Background="Transparent"/>
</DataTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
Any idea/suggestion?
Thanks!
Maybe this will help you :
Disable Control's Selection Background Effect in WPF
It concerns the ListViewItems, but you can apply this mechanism on buttons or any other WPF Controls.
Good luck
Add this setter to the style:
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<ContentPresenter Margin="{TemplateBinding Padding}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
I have a Devexpress DateEdit and added a trigger for when IsEnabled=False to change the ControlTemplate to be a Label. This all works fine, but my problem is, that the Text of the Label is still Grayed out(Disabled).
My style:
<Style x:Key="DateTimeDropDownStyle" TargetType="{x:Type dxe:DateEdit}">
<Setter Property="Mask" Value="dd MMM yyyy"/>
<Setter Property="MaskUseAsDisplayFormat" Value="True"/>
<Style.Triggers>
<Trigger Property="dxe:DateEdit.IsEnabled" Value="False">
<Setter Property="dxe:DateEdit.Template">
<Setter.Value>
<ControlTemplate>
<Label Content="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Text, StringFormat={}{0:dd MMM yyyyy}}"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
So, my question is, how do i change the Style so that the Label is not disabled?
Try setting Foreground on the Label in your template.
If it doesn't help, you'd have to edit the control template for the label. A basic one is:
<ControlTemplate TargetType="{x:Type Label}">
<Border Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<ContentPresenter Margin="{TemplateBinding Padding}"/>
</Border>
<ControlTemplate.Triggers>
<!--This is the trigger to remove-->
<Tirgger Property="IsEnabled"
Value="False">
<Setter Property="Foreground"
Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
always in a ComboBox a arrow button is show where user click and then a list pop down with value. in WPF can we change the arrow button where i will use my own arrow mage.functionality will be the same. if possible then please show me the xaml for that. thanks
What i understand is that you want to customize the arrow of the combobox and have your custom arrow image.If that is the case then you can easily do it by modifying the controltemplate of combobox.
You can edit the default control template by using Expression Blend or copy the same from here and do your modifications.
The Arrow is represented in the default template as a path inside the togglebutton controltemplate Named
'Arrow'
.You can change it as you wish to get what you are looking for
<Geometry x:Key="DownArrowGeometry">M 0 0 L 3.5 4 L 7 0 Z</Geometry>
<Style x:Key="ComboBoxReadonlyToggleButton" TargetType="{x:Type ToggleButton}">
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="IsTabStop" Value="false"/>
<Setter Property="Focusable" Value="false"/>
<Setter Property="ClickMode" Value="Press"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Microsoft_Windows_Themes:ButtonChrome x:Name="Chrome" SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}">
<Grid HorizontalAlignment="Right" Width="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}">
<Path x:Name="Arrow" Fill="Red" HorizontalAlignment="Center" Margin="3,1,0,0" VerticalAlignment="Center" Data="{StaticResource DownArrowGeometry}"/>
</Grid>
</Microsoft_Windows_Themes:ButtonChrome>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="true">
<Setter Property="RenderPressed" TargetName="Chrome" Value="true"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Fill" TargetName="Arrow" Value="#AFAFAF"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
I am trying to make a search TextBox with an embedded magnifying glass icon. I have the following markup so far:
<Border DockPanel.Dock="Bottom" Margin="2,4,0,4"
BorderThickness="1" SnapsToDevicePixels="True"
BorderBrush="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}">
<DockPanel>
<StackPanel Orientation="Horizontal" DockPanel.Dock="Right">
<Image Source="/Resources/search-13x13.png" Width="13"/>
</StackPanel>
<TextBox Name="searchTextBox" DockPanel.Dock="Bottom" BorderThickness="0"
Text="{Binding FilterText, UpdateSourceTrigger=PropertyChanged}"/>
</DockPanel>
</Border>
However, I can't find the entry in SystemColors which will give me the same color as the standard TextBox border. This is a blueish color by default. Am I being really stupid here?!?
EDIT: btw, the image is contained in a stackpanel because I'm planning to put a dropdown arrow in there as well.
You might try using Microsoft.Windows.Themes.ListBoxChrome instead of the Border; that's what the default template for TextBox uses:
<ControlTemplate TargetType="TextBoxBase"
xmlns:mwt="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero">
<mwt:ListBoxChrome Name="Bd" SnapsToDevicePixels="True">
<ScrollViewer Name="PART_ContentHost"
SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}" />
</mwt:ListBoxChrome>
<ControlTemplate.Triggers>
<Trigger Property="UIElement.IsEnabled" Value="False">
<Setter TargetName="Bd" Property="Panel.Background"
Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" />
<Setter Property="TextElement.Foreground"
Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
You should be able to use just ListBoxChrome instead of Border rather than re-templating TextBox to match the code you presented.
I was able to get it programatically with:
TextBox.BorderBrush = SystemColors.ControlDarkBrush;
Based on Nicholas Armstrong's answer, that solution is working for me:
<Style TargetType="{x:Type local:CustomTextBox}" BasedOn="{StaticResource {x:Type TextBox}}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:CustomTextBox}">
<mwt:ListBoxChrome x:Name="Bd" SnapsToDevicePixels="true" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" RenderFocused="{TemplateBinding IsKeyboardFocusWithin}" RenderMouseOver="{TemplateBinding IsMouseOver}">
<ScrollViewer x:Name="PART_ContentHost" />
</mwt:ListBoxChrome>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
To anyone that is looking for a list of Brushes and what their colors will look like with different themes/OS:
Originally posted: http://blogs.msdn.com/b/wpf/archive/2010/11/30/systemcolors-reference.aspx.
It seems hackish, but I've had the best luck by creating a textbox (perhaps collapsed) and binding to its border brush.