I am trying to create a custom control. After setting the cornerRadius property to be bound it works only for the default radius which is "8". Here is the definition of property:
public CornerRadius cornerRadius
{
get { return (CornerRadius)GetValue(cornerRadiusProperty); }
set { SetValue(cornerRadiusProperty, value); }
}
public static readonly DependencyProperty cornerRadiusProperty =
DependencyProperty.Register("cornerRadius", typeof(CornerRadius), typeof(expandMenuA), new PropertyMetadata(new CornerRadius(8)));
In the main border, everything works fine, but for the second it works only for default "8" when I change a value in different project, which has a reference to this custom control, nothing happens, and it stays the default:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:expandMenuA">
<Style TargetType="{x:Type local:expandMenuA}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:expandMenuA}">
<Border CornerRadius="{TemplateBinding cornerRadius}" x:Name="mainBorder" Background="#232323">
<StackPanel>
<Button Height="{TemplateBinding expanderHeight}" Background="#2d2d2d">
<Button.Template>
<ControlTemplate TargetType="Button">
<Border CornerRadius="{TemplateBinding local:expandMenuA.cornerRadius}" Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Left" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
</Button.Template>
<Button.Content>
<TextBlock Text="{TemplateBinding menuTitle}" Foreground="White" Margin="10, 0, 0, 0" Background="{TemplateBinding BorderBrush}"/>
</Button.Content>
</Button>
<ContentPresenter/>
</StackPanel>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
TemplateBinding in ControlTemplate for Button will seek Button's property, which will resolve to default DP value. use Binding with RelativeSource:
<ControlTemplate TargetType="Button">
<Border CornerRadius="{Binding Path=cornerRadius, RelativeSource={RelativeSource AncestorType={x:Type local:expandMenuA}}}" Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Left" VerticalAlignment="Center"/>
</Border>
</ControlTemplate>
Related
I have a CustomComboBox component that inherits from ComboBox with its style copied to another resource dictionary xaml file.
The question is, can I or how do I bind a property from the sub style for ComboBoxToggleButton used in ComboBoxTemplate used in CustomComboBoxStyle?
The property is: GryphlBrush in
<Path x:Name="arrow" Stroke="{Binding GryphlBrush}" ...
The code example below:
<Style x:Key="ComboBoxToggleButton" TargetType="{x:Type ToggleButton}">
<!-- ... -->
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
Border x:Name="templateRoot" SnapsToDevicePixels="true" Background="Transparent" BorderThickness="0" BorderBrush="Transparent" CornerRadius="4">
<Border x:Name="splitBorder" Width="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" SnapsToDevicePixels="true" Margin="0" HorizontalAlignment="Right" BorderThickness="1" BorderBrush="Transparent">
<Path x:Name="arrow" Stroke="{Binding GryphlBrush}" VerticalAlignment="Center" Margin="0" HorizontalAlignment="Center" Fill="{StaticResource ComboBox.Static.Glyph}" Data="F1 M 0,0 L 2.667,2.66665 L 5.3334,0 L 5.3334,-1.78168 L 2.6667,0.88501 L0,-1.78168 L0,0 Z"/>
</Border>
</Border>
<!-- ... -->
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<ControlTemplate x:Key="ComboBoxTemplate" TargetType="{x:Type ComboBox}">
<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="4">
<Grid x:Name="templateRoot" SnapsToDevicePixels="true">
<!-- ... -->
<ToggleButton x:Name="toggleButton" BorderBrush="Transparent" BorderThickness="0" Background="Transparent" Grid.ColumnSpan="2" IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Style="{StaticResource ComboBoxToggleButton}"/>
<!-- ... -->
</Grid>
</Border>
<!-- ... -->
</ControlTemplate>
<Style x:Key="BorderedComboBoxStyles" TargetType="{x:Type components:BorderedComboBox}">
<Setter Property="Template" Value="{StaticResource ComboBoxTemplate}"/>
</Style>
In code behind I only define the dependency property, getters and setters:
public class BorderedComboBox : ComboBox
{
public static readonly DependencyProperty GryphlBrushDP = DependencyProperty.Register(
"GryphlBrush", typeof(Brush), typeof(BorderedComboBox));
private Brush _gryphlBrush;
public Brush GryphlBrush
{
get => _gryphlBrush;
set => _gryphlBrush = value;
}
}
You should adhere to the naming conventions for dependency properties and their getters and setters. Furthermore using nameof for the property can prevent errors when renaming.
The name of the identifier field that you use to store the name and characteristics of the dependency property must be the Name you chose for the dependency property as part of the Register call, appended by the literal string Property. [...]
If you fail to follow this naming pattern, designers might not report your property correctly, and certain aspects of property system style application might not behave as expected.
Hence your dependency property definition should look like this:
public class BorderedComboBox : ComboBox
{
public static readonly DependencyProperty GryphlBrushProperty = DependencyProperty.Register(
nameof(GryphlBrush), typeof(Brush), typeof(BorderedComboBox));
private Brush _gryphlBrush;
public Brush GryphlBrush
{
get => _gryphlBrush;
set => _gryphlBrush = value;
}
}
If you want to bind the GryphlBrush property, in the ToggleButton control template, you could:
Create a custom toggle button and add a dependency property to it and then bind it to the GryphlBrush property on your BorderedComboBox.
If the toggle button is only used in this context within the combo box, apply a RelativeSource binding with AncestorType, since the BorderedComboBox is a parent of the toggle button.
<Style x:Key="ComboBoxToggleButton" TargetType="{x:Type ToggleButton}">
<!--...-->
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border x:Name="templateRoot" SnapsToDevicePixels="true" Background="Transparent" BorderThickness="0" BorderBrush="Transparent" CornerRadius="4">
<Border x:Name="splitBorder" Width="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" SnapsToDevicePixels="true" Margin="0" HorizontalAlignment="Right" BorderThickness="1" BorderBrush="Transparent">
<!--<Path x:Name="arrow" Stroke="{Binding GryphlBrush, RelativeSource={RelativeSource AncestorType={x:Type local:BorderedComboBox}}}" VerticalAlignment="Center" Margin="0" HorizontalAlignment="Center" Fill="{StaticResource ComboBox.Static.Glyph}" Data="F1 M 0,0 L 2.667,2.66665 L 5.3334,0 L 5.3334,-1.78168 L 2.6667,0.88501 L0,-1.78168 L0,0 Z"/>-->
<Path x:Name="arrow" Stroke="{Binding GryphlBrush, RelativeSource={RelativeSource AncestorType={x:Type local:BorderedComboBox}}}" VerticalAlignment="Center" Margin="0" HorizontalAlignment="Center" Data="F1 M 0,0 L 2.667,2.66665 L 5.3334,0 L 5.3334,-1.78168 L 2.6667,0.88501 L0,-1.78168 L0,0 Z"/>
</Border>
</Border>
<!--...-->
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
I'm working with WPF and C# on a WPF application in which the controls and their bindings are created at runtime in code-behind.
The WPF-window in which i use the controls has a ViewModel with a DataTable as DataContext and - at the bottom - a DataGrid which is bound to the DefaultView of the DataTable.
At first for creating controls at runtime i used the standard WPF-controls, p.e. the TextBox and the CheckBox.
In their bindings i set UpdateSourceTrigger to "PropertyChanged" like this:
Binding controlBinding = new Binding();
controlBinding.Source = ViewModelContainer.viewmodel.ApplicationDataSet.Tables[BindingSource].DefaultView;
controlBinding.Path = new PropertyPath("[0][" + BindingPath + "]");
controlBinding.UpdateSourceTrigger = UpdateSourceTrigger.PropertyChanged;
When i changed the text of the TextBox (without leaving it) or checked/unchecked the CheckBox i saw these changes all at once in the DataGrid.
But now i'm using CustomControls which inherit from the standard controls and the UpdateSourceTrigger-functionality doesn't work anymore.
When i change the text of the TextBox or check/uncheck the CheckBox i see no changes in the DataGrid.
I think that i have to do something in the definitions of my CustomControls, but what?
Here the definitions of the CustomTextBox and the CustomCheckBox:
<!--Style for the CustomControl CustomTextBox-->
<Style TargetType="{x:Type local:CustomTextBox}" BasedOn="{StaticResource {x:Type TextBox}}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:CustomTextBox}">
<Border BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<TextBox Text="{TemplateBinding Text}"
TextWrapping="Wrap"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
ContextMenu="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type local:CustomTextBox}},
Path=ContextMenu}"/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!--Style for the CustomControl CustomCheckBox-->
<Style TargetType="{x:Type local:CustomCheckBox}" BasedOn="{StaticResource {x:Type CheckBox}}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:CustomCheckBox}">
<Border BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<CheckBox IsChecked="{TemplateBinding IsChecked}"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}">
<TextBlock Text="{TemplateBinding Text}"
TextWrapping="Wrap"
TextAlignment="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type CheckBox}},
Path=HorizontalContentAlignment, Converter={StaticResource h2tAlignmentConverter}}"
TextDecorations="{TemplateBinding TextDecorations}"/>
</CheckBox>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Thanks in advance!
Thank You bidy!
I tried it and that's what i was looking for.
I have to guess, that i'm working with CustomControls since just three weeks and have not much experience.
Have you tried <TextBox Text={Binding Text, RelativeSource={RelativeSource TemplatedParent}, UpdateSourceTrigger=PropertyChanged} ... ? – bidy
I have this style:
<Style TargetType="{x:Type local:ImageButton}" BasedOn="{StaticResource {x:Type Button}}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:ImageButton}">
<Border>
<StackPanel Orientation="Horizontal">
<Viewbox x:Name="ViewBoxInternal" Child="{TemplateBinding Child}"/>
<TextBlock x:Name="TextBlockInternal" Text="{TemplateBinding Text}" />
</StackPanel>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
And I have two dependency properties.
static ImageButton()
{
DefaultStyleKeyProperty.OverrideMetadata(typeof(ImageButton), new FrameworkPropertyMetadata(typeof(ImageButton)));
ChildProperty = DependencyProperty.Register("Child", typeof(UIElement), typeof(ImageButton), new FrameworkPropertyMetadata());
TextProperty = DependencyProperty.Register("Text", typeof(string), typeof(ImageButton), new FrameworkPropertyMetadata("Button"));
}
I can set the Text property without a problem, but somehow I can't set the Child of my Viewbox.
The Viewbox should receive a Canvas as a Child.
Calling this way, gives me an error:
<custom:ImageButton Text="New" Width="41" Child="{StaticResource NewIcon}"/>
Unable to cast object of 'System.Windows.TemplateBindingExpression' to type 'System.Windows.UIElement'.
Now, working...
As #Xaml-Lover said, you need this:
<Viewbox x:Name="ViewBoxInternal">
<ContentPresenter ContentSource="{TemplateBinding Content}" Width="Auto" Height="Auto"/>
</Viewbox>
And you need to call like this:
<custom:ImageButton Text="New" Content="{StaticResource NewIcon}" />
This is because, the Child property of Viewbox is not a Dependency Property. A binding can only set to a Dependency property. I would suggest you to follow a different approach. Use ContentPresenter as a place holder for Child property and wrap it in a a Viewbox.
<Viewbox x:Name="ViewBoxInternal">
<ContentPresenter ContentSource="Child"/>
</Viewbox>
OK, I've searched everywhere and in every single link I go to my problem is explained with xaml code.
I want to change the active tab's background and foreground (not its content, but the upper part which you select in order to make active) in a WPF project, but I'm looking for the C# code. The code below doesn't work for me:
if (tabs[0].IsEnabled) tabs[0].Background = Brushes.Blue;
else tabs[0].Background = Brushes.Black;
Do it in XAML if you use WPF.
You can bind to the TabControl's property ItemsSource. Than just define a Styletrigger to change the Background
OK, thanks to Venson I've finally got it and just in case someone wants to know how it works:
<TabControl ItemsSource="{Binding tabs}" Height="68" HorizontalAlignment="Left" Margin="156,23,0,0" Name="tabControl1" VerticalAlignment="Top" Width="268">
<TabControl.ItemContainerStyle>
<Style TargetType="TabItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TabItem}">
<Grid>
<Border
Margin="0,0,-4,0"
Background="Black"
BorderBrush="Blue"
BorderThickness="1,1,1,1"
CornerRadius="2,12,0,0" >
<ContentPresenter x:Name="ContentSite"
VerticalAlignment="Center"
HorizontalAlignment="Center"
ContentSource="Header"
Margin="12,2,12,2"
RecognizesAccessKey="True"/>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="Blue"></Setter>
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TabItem}">
<Grid>
<Border
Margin="0,0,-4,0"
Background="Green"
BorderBrush="Blue"
BorderThickness="1,1,1,1"
CornerRadius="2,12,0,0" >
<ContentPresenter x:Name="ContentSite"
VerticalAlignment="Center"
HorizontalAlignment="Center"
ContentSource="Header"
Margin="12,2,12,2"
RecognizesAccessKey="True"/>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Trigger>
</Style.Triggers>
</Style>
</TabControl.ItemContainerStyle>
</TabControl>
This code goes in the <Grid>of the <Window> tags of the MainWindow.xaml and
public MainWindow()
{
testClass testObject = new testClass();
testObject.tabs = new List<TabItem>();
testObject.tabs.Add(new TabItem());
testObject.tabs.Add(new TabItem());
testObject.tabs[0].Header = "NO WAY";
testObject.tabs[1].Header = "ON WAY";
testObject.tabs[0].Content = "WHAT";
testObject.tabs[1].Content = "HELL";
InitializeComponent();
this.DataContext = testObject ;
}
class testClass
{
public List<TabItem> tabs { set; get; }
}
this goes into the MainWindow.xaml.cs file.
Please note: the colors are only for the test, don't judge me for the bad contrast chosen!
I don't know if it's possible not to use another class, though..
foreach(var tab in tabs)
{
tab.Background = tab.IsEnabled ? Brushes.Blue :Brushes.Black;
}
But you can handle state of tabcontrol on active tab changes and set backgrounds of deactivated and activated tabs.
I have the code below under Themes\Generic.xaml
Now I need to get cPresenter in code behind how I can do it?
In fact I try to convert Silverlight implementation into WPF code.
And I want to use something like Silverlight has:
FrameworkElement cp = this.GetTemplateChild("cPresenter") as FrameworkElement;
Themes\Generic.xaml
<Style TargetType="local:Marquee">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:Marquee">
<Border Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<ScrollViewer Width="Auto" Height="Auto" HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch" VerticalScrollBarVisibility="Disabled">
<Canvas>
<ContentPresenter x:Name="cPresenter" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Canvas>
</ScrollViewer>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
There's no reason that shouldn't work in WPF also.
Put this in your code for Marquee.
private ContentPresenter cPresenter;
public override void OnApplyTemplate()
{
base.OnApplyTemplate();
this.cPresenter = this.GetTemplateChild("cPresenter") as ContentPresenter;
}