XAML style BasedOn TemplateBinding - wpf

I have a TextBlock which has Style={TemplateBinding ParentDependencyProperty}
I need to place some DataTriggers on just this TextBlock, but not on the style as a whole.
I need something like this:
<TextBlock>
<Style BasedOn="StyleInParentDependencyProperty">
<Style.Triggers>
...
</Style.Triggers>
</Style>
</TextBlock>
And I can't figure out how, as no bindings are allowed in the BasedOn property of Styles. I am pretty new to WPF, and seemingly stuck here.
Thanks for your help.

You can do something like this
<Style TargetType="TextBlock" x:Key="Default">
<Setter Property="Background" Value="Red"></Setter>
<Setter Property="FontFamily" Value="Segoe Black" />
<Setter Property="HorizontalAlignment" Value="Center" />
<Setter Property="FontSize" Value="32pt" />
<Setter Property="Foreground" Value="#777777" />
</Style>
And define this style just on your TextBlock that need some DataTriggers
<Style BasedOn="{StaticResource Default}" TargetType="TextBlock" x:Key="TextBlockWithTriggers">
<Style.Triggers> .... </Style.Triggers>
</Style>
And on your TextBlock just define
<TextBlock Style="{StaticResource TextBlockWithTriggers}"/>

Related

Can I apply a WPF style to an element only in a certain layout?

I have a TextBlock style like this:
<Style TargetType="TextBlock" x:Key="FormLabel">
<Setter Property="Height" Value="20" />
<Setter Property="Margin" Value="10" />
<Setter Property="TextAlignment" Value="Right" />
<Setter Property="VerticalAlignment" Value="Center" />
</Style>
I use it in Grid based forms, e.g:
<TextBlock Text="Code" Grid.Row="1" Grid.Column="0" Style="{StaticResource FormLabel}" />
Now instead of repeating the style name on every TextBlock in the grid, I would prefer to e.g. have a Grid style like:
<Style TargetType="Grid" x:Key="FormGrid">
<Setter Property="Width" Value="400" />
...
</Style>
Then I would, if possible, like to modify my TextBlock style to only apply to that element when it is a child element of a Grid with style FormGrid.
Is this possible, and if so, how can I achieve it?
This is indeed possible by using an implicit style within another style as a resource. Take this example:
...
<Window.Resources>
<Style x:Key="FormGrid" TargetType="Grid">
<Style.Resources>
<Style TargetType="TextBlock">
<Setter Property="Height" Value="20" />
<Setter Property="Margin" Value="10" />
<Setter Property="TextAlignment" Value="Right" />
<Setter Property="VerticalAlignment" Value="Center" />
</Style>
</Style.Resources>
<Setter Property="Width" Value="400" />
</Style>
</Window.Resources>
<StackPanel>
<Grid Style="{StaticResource FormGrid}">
<TextBlock Text="This text block is styled with FormGrid TextBlock implicit style."/>
</Grid>
<TextBlock Text="This text block uses the default style."/>
</StackPanel>
...
This is not possible by out of the box WPF abilities. What you are looking here is CSS like style selectors. WPF Only allows style inheritance through BasedOn property. I am not sure if this could be an alternative, but you can define that specific TextBlock style as part of that grid resources and target to match any textblock inside of it.
<Grid.Resources>
<Style TargetType="TextBlock">
<Setter Property="Height" Value="20" />
<Setter Property="Margin" Value="10" />
<Setter Property="TextAlignment" Value="Right" />
<Setter Property="VerticalAlignment" Value="Center" />
</Style>
</Grid.Resources>

How to Change the Style on AvalonEdit CodeCompletion Window?

I'm trying to figure out how to change the style of the AvalonEdit CodeCompletion window. However, I can't figure out the right combination of xaml style target/properties to change it. The main thing I'd like to do is get rid of the border, but maybe some additional changes as well.
Here is the xaml I've tried. None of it is affecting the UI.
xmlns:ae="clr-namespace:ICSharpCode.AvalonEdit.CodeCompletion;assembly=ICSharpCode.AvalonEdit"
<Style TargetType="{x:Type ae:CompletionWindow}">
<Setter Property="WindowStyle" Value="None" />
</Style>
<Style TargetType="{x:Type ae:CompletionWindowBase}">
<Setter Property="WindowStyle" Value="None" />
</Style>
<Style TargetType="{x:Type ae:CompletionListBox}">
<Setter Property="Background" Value="Red" />
</Style>
<Style TargetType="{x:Type ae:CompletionList}">
<Setter Property="Background" Value="Orange" />
</Style>
Use this style to remove border on window:
<Style TargetType="{x:Type avalonEdit:CompletionWindow}">
<Setter Property="WindowStyle" Value="None"></Setter>
<Setter Property="ResizeMode" Value="NoResize"></Setter>
<Setter Property="BorderThickness" Value="0"></Setter>
</Style>
To make the styles affect the UI, you can put them in a resource dictionary xaml and parse that with (ResourceDictionary)XamlReader.Parse(ResourcesAsXaml).
Then assign the ResourceDictionary to the Resources property of the CompletionWindow.

Can I override/replace a property of a child-item in a default style

The default wpf MenuItem (on Menu) is constructed out of controls approx. like this:
grid; outer-rectangle; bg-rectangle; inner-rectangle; dockpanel; popup.
The dockpanel in turn consists of:
contentpresenter[icon]; path; contentpresenter[text]
The contentpresenter[text] consists of a TextBlock control.
What I want to achieve is to define a Style, as simple as possible, to change the VerticalAlignment property of this TextBlock, but only for the TextBlock in MenuItem, not in general.
<Style x:Key ="TextBlockCenterStyle" TargetType="{x:Type TextBlock}">
<Setter Property="VerticalAlignment" Value="Center" />
</Style>
<Style TargetType="MenuItem">
<Setter Property="FontSize" Value="11" />
<Setter Property="ItemContainerStyle" Value="TextBlockCenterStyle" />
<Style.Resources>
<Style TargetType="{x:Type TextBlock}">
<Setter Property="VerticalAlignment" Value="Center" />
</Style>
</Style.Resources>
</Style>
I tried Style.Resources and ItemContainerStyle.
Cannot get it to work. ItemContainerStyle throws TargetInvocationException (from NullReferenceException) at run-time.
When it is possible it should be a general solution, something like FindChildControl?!
Did you try ItemContainerStyle?
Something like:
<MenuItem ItemContainerStyle = {StaticResource MyItemContainerStyle}../>
Then the MyItemContainerStyle have your
<Style x:Key ="MyItemContainerStyle" TargetType="{x:Type TextBlock}">
<Setter Property="VerticalAlignment" Value="Center" />
</Style>
=============== answer after EDIT ======================
try this:
<Style TargetType="MenuItem">
<Setter Property="FontSize" Value="11" />
<Setter Property="ItemContainerStyle" Value="{StaticResource TextBlockCenterStyle}" />
<Style.Resources>
<Style TargetType="{x:Type TextBlock}">
<Setter Property="VerticalAlignment" Value="Center" />
</Style>
</Style.Resources>
</Style>

Apply style to multiple controls when a style trigger fires in xaml

When the user enters info I want all the controls to look and act the same way, as a result I have done the following.
The label and textbox controls are in a stackpanel as:
<StackPanel Style="{StaticResource ResourceKey=myInput}" HorizontalAlignment="Left">
<Label Content="Label" Name="label1" />
<TextBox Name="textBox1" ></TextBox>
</StackPanel>
the style "myInput" is:
<Style x:Key="myInput" TargetType="{x:Type StackPanel}">
<Style.Resources>
<Style TargetType="{x:Type Label}" BasedOn="{StaticResource {x:Type Label}}">
<Setter Property="FontSize" Value="12" />
</Style>
<Style TargetType="{x:Type TextBox}">
<Setter Property="Margin" Value="5,-5,2,2"></Setter>
<Setter Property="Height" Value="23"/>
<Setter Property="VerticalAlignment" Value="Top"/>
<Style.Triggers>
<Trigger Property="IsFocused" Value="true">
<Setter Property="Background" Value="Blue" >
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</Style.Resources>
</Style>
Now every time that I apply that style to a stackpanel that has a label and a textbox the background of the textbox changes to blue when it receives focus.
How could I set the label's fontweight to bold also when that event fires? I will like to do this with xaml.
Use a DataTrigger on your Label which looks to see if the keyboard focus is inside of the parent StackPanel that contains both objects
<Style TargetType="{x:Type Label}" BasedOn="{StaticResource {x:Type Label}}">
<Setter Property="FontSize" Value="12" />
<Style.Triggers>
<DataTrigger Value="True" Binding="{Binding IsKeyboardFocusWithin,
RelativeSource={RelativeSource AncestorType={x:Type StackPanel}}}">
<Setter Property="FontWeight" Value="Bold" />
</Trigger>
</Style.Triggers>
</Style>

How to base a style on another style in a resource dictionary?

I have a theme that is applied to all buttons in a resource dictionary. Now I want to add a trigger to the button while inheriting the style changes from the dictionary. I tried the following code, but it says that the control cannot be found. How can I fix it ?
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Theme.xaml"/>
</ResourceDictionary.MergedDictionaries>
<conv:ErrorContentConverter x:Key="ErrorContentConverter" />
<Style x:Key="ValidTrigger"
TargetType="Control" BasedOn="{StaticResource {x:Type Control}}">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=IsValid}" Value="False">
<Setter Property="IsEnabled" Value="false" />
</DataTrigger>
</Style.Triggers>
</Style>
</ResourceDictionary>
</UserControl.Resources>
The base template:
<Style TargetType="{x:Type Button}" BasedOn="{x:Null}">
<Setter Property="FocusVisualStyle"
Value="{DynamicResource NuclearButtonFocusVisual}" />
<Setter Property="Foreground" Value="#FF042271" />
<Setter Property="FontFamily" Value="Trebuchet MS" />
<Setter Property="FontSize" Value="12" />
<Setter Property="Padding" Value="3" />
<Setter Property="Template" Value="{DynamicResource ButtonTemplate}" />
</Style>
One trick I've used in the past: in your ResourceDictionary that defines blanket styles for your application, add an x:Key to the style you'd like to inherit from, like so:
<Style TargetType="{x:Type Button}" x:Key="ButtonStyle">
<!-- your style here -->
</Style>
To apply this style to all controls of the specified type (Button in this example) without having to explicitly set the Style attribute of every Button, add another style that's BasedOn this style, but doesn't have a key:
<Style TargetType="{x:Type Button}" BasedOn="{StaticResource ButtonStyle}" />
Using this method, all Buttons in your application will automatically inherit your custom style, but you can still create additional styles BasedOn the ButtonStyle entry and avoid blowing away all of your custom styling.
Give your base Style a name, say FooStyle.
In the example you gave, modify the TargetType and BasedOn to look as follows:
<Style x:Key="ValidTrigger"
TargetType="{x:Type Control}" BasedOn="{StaticResource {x:Type Control}}" >
<Style.Triggers>
<DataTrigger Binding="{Binding Path=IsValid}" Value="False">
<Setter Property="IsEnabled" Value="false" />
</DataTrigger>
</Style.Triggers>
</Style>
I think there is no base style defined for "control" so your
BasedOn="{StaticResource {x:Type Control}}" part won't find anything.
You probably want to change
<Style x:Key="ValidTrigger" TargetType="Control" BasedOn="{StaticResource {x:Type Control}}" >
to
<Style x:Key="ValidTrigger" TargetType="Button" BasedOn="{StaticResource {x:Type Button}}" >

Resources