WPF watermark Mahaps with defined style
In my WPF application, I am trying to have watermark on my MahApps.Metro textbox to which I have set a custom style:
Style x:Key="TextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="VerticalAlignment" Value="Center" />
<!--<Setter Property="BorderThickness" Value="1" />-->
<Setter Property="Margin" Value="10 0 30 0" />
<!--<Setter Property="BorderBrush" Value="SteelBlue" />-->
<Setter Property="BorderThickness" Value="0.7" />
<Setter Property="BorderBrush" Value="Gray" />
<Setter Property="Background" Value="AliceBlue" />
<Setter Property="Padding" Value="5" />
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<DockPanel LastChildFill="true">
<Border Background="OrangeRed" DockPanel.Dock="right" Margin="5,0,0,0"
Width="20" Height="20" CornerRadius="5"
ToolTip="{Binding ElementName=customAdorner,
Path=AdornedElement.(Validation.Errors)[0].ErrorContent}">
<TextBlock Text="!" VerticalAlignment="center" HorizontalAlignment="center"
FontWeight="Bold" Foreground="white" />
</Border>
<AdornedElementPlaceholder Name="customAdorner" VerticalAlignment="Center" >
<Border BorderBrush="red" BorderThickness="1" />
</AdornedElementPlaceholder>
</DockPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
<Trigger Property="IsFocused" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
<Style x:Key="MenuLevel2" BasedOn="{StaticResource MetroTabItem}" TargetType="{x:Type TabItem}">
<Setter Property="mah:ControlsHelper.HeaderFontSize" Value="16" />
<Setter Property="mah:ControlsHelper.HeaderFontWeight" Value="Normal"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Foreground" Value="SteelBlue"/>
</Trigger>
<Trigger Property="IsSelected" Value="True">
</Trigger>
</Style.Triggers>
</Style>
<TextBox Grid.Column="1" Grid.Row="1" x:Name="txtBox_updateWebSrvURL" Style="{StaticResource TextBoxStyle}"
Validation.Error="Validation_Error"
Text="{Binding UpdateSourceTrigger=PropertyChanged, Path=webSrvURL,
ValidatesOnDataErrors=true, NotifyOnValidationError=true}"
Controls:TextBoxHelper.Watermark="MyWatermark here!!!!/" />
If I remove the custom style the watermark is well applied. Any idea how I can enable the watermark but still use my custom style?
wpf xaml
add a comment |
In my WPF application, I am trying to have watermark on my MahApps.Metro textbox to which I have set a custom style:
Style x:Key="TextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="VerticalAlignment" Value="Center" />
<!--<Setter Property="BorderThickness" Value="1" />-->
<Setter Property="Margin" Value="10 0 30 0" />
<!--<Setter Property="BorderBrush" Value="SteelBlue" />-->
<Setter Property="BorderThickness" Value="0.7" />
<Setter Property="BorderBrush" Value="Gray" />
<Setter Property="Background" Value="AliceBlue" />
<Setter Property="Padding" Value="5" />
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<DockPanel LastChildFill="true">
<Border Background="OrangeRed" DockPanel.Dock="right" Margin="5,0,0,0"
Width="20" Height="20" CornerRadius="5"
ToolTip="{Binding ElementName=customAdorner,
Path=AdornedElement.(Validation.Errors)[0].ErrorContent}">
<TextBlock Text="!" VerticalAlignment="center" HorizontalAlignment="center"
FontWeight="Bold" Foreground="white" />
</Border>
<AdornedElementPlaceholder Name="customAdorner" VerticalAlignment="Center" >
<Border BorderBrush="red" BorderThickness="1" />
</AdornedElementPlaceholder>
</DockPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
<Trigger Property="IsFocused" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
<Style x:Key="MenuLevel2" BasedOn="{StaticResource MetroTabItem}" TargetType="{x:Type TabItem}">
<Setter Property="mah:ControlsHelper.HeaderFontSize" Value="16" />
<Setter Property="mah:ControlsHelper.HeaderFontWeight" Value="Normal"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Foreground" Value="SteelBlue"/>
</Trigger>
<Trigger Property="IsSelected" Value="True">
</Trigger>
</Style.Triggers>
</Style>
<TextBox Grid.Column="1" Grid.Row="1" x:Name="txtBox_updateWebSrvURL" Style="{StaticResource TextBoxStyle}"
Validation.Error="Validation_Error"
Text="{Binding UpdateSourceTrigger=PropertyChanged, Path=webSrvURL,
ValidatesOnDataErrors=true, NotifyOnValidationError=true}"
Controls:TextBoxHelper.Watermark="MyWatermark here!!!!/" />
If I remove the custom style the watermark is well applied. Any idea how I can enable the watermark but still use my custom style?
wpf xaml
You need to include the watermark in your custom ControlTemplate.
– mm8
Nov 19 '18 at 12:50
Can you show Controls:TextBoxHelper.Watermark code?
– kurakura88
Nov 20 '18 at 9:23
add a comment |
In my WPF application, I am trying to have watermark on my MahApps.Metro textbox to which I have set a custom style:
Style x:Key="TextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="VerticalAlignment" Value="Center" />
<!--<Setter Property="BorderThickness" Value="1" />-->
<Setter Property="Margin" Value="10 0 30 0" />
<!--<Setter Property="BorderBrush" Value="SteelBlue" />-->
<Setter Property="BorderThickness" Value="0.7" />
<Setter Property="BorderBrush" Value="Gray" />
<Setter Property="Background" Value="AliceBlue" />
<Setter Property="Padding" Value="5" />
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<DockPanel LastChildFill="true">
<Border Background="OrangeRed" DockPanel.Dock="right" Margin="5,0,0,0"
Width="20" Height="20" CornerRadius="5"
ToolTip="{Binding ElementName=customAdorner,
Path=AdornedElement.(Validation.Errors)[0].ErrorContent}">
<TextBlock Text="!" VerticalAlignment="center" HorizontalAlignment="center"
FontWeight="Bold" Foreground="white" />
</Border>
<AdornedElementPlaceholder Name="customAdorner" VerticalAlignment="Center" >
<Border BorderBrush="red" BorderThickness="1" />
</AdornedElementPlaceholder>
</DockPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
<Trigger Property="IsFocused" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
<Style x:Key="MenuLevel2" BasedOn="{StaticResource MetroTabItem}" TargetType="{x:Type TabItem}">
<Setter Property="mah:ControlsHelper.HeaderFontSize" Value="16" />
<Setter Property="mah:ControlsHelper.HeaderFontWeight" Value="Normal"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Foreground" Value="SteelBlue"/>
</Trigger>
<Trigger Property="IsSelected" Value="True">
</Trigger>
</Style.Triggers>
</Style>
<TextBox Grid.Column="1" Grid.Row="1" x:Name="txtBox_updateWebSrvURL" Style="{StaticResource TextBoxStyle}"
Validation.Error="Validation_Error"
Text="{Binding UpdateSourceTrigger=PropertyChanged, Path=webSrvURL,
ValidatesOnDataErrors=true, NotifyOnValidationError=true}"
Controls:TextBoxHelper.Watermark="MyWatermark here!!!!/" />
If I remove the custom style the watermark is well applied. Any idea how I can enable the watermark but still use my custom style?
wpf xaml
In my WPF application, I am trying to have watermark on my MahApps.Metro textbox to which I have set a custom style:
Style x:Key="TextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="VerticalAlignment" Value="Center" />
<!--<Setter Property="BorderThickness" Value="1" />-->
<Setter Property="Margin" Value="10 0 30 0" />
<!--<Setter Property="BorderBrush" Value="SteelBlue" />-->
<Setter Property="BorderThickness" Value="0.7" />
<Setter Property="BorderBrush" Value="Gray" />
<Setter Property="Background" Value="AliceBlue" />
<Setter Property="Padding" Value="5" />
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<DockPanel LastChildFill="true">
<Border Background="OrangeRed" DockPanel.Dock="right" Margin="5,0,0,0"
Width="20" Height="20" CornerRadius="5"
ToolTip="{Binding ElementName=customAdorner,
Path=AdornedElement.(Validation.Errors)[0].ErrorContent}">
<TextBlock Text="!" VerticalAlignment="center" HorizontalAlignment="center"
FontWeight="Bold" Foreground="white" />
</Border>
<AdornedElementPlaceholder Name="customAdorner" VerticalAlignment="Center" >
<Border BorderBrush="red" BorderThickness="1" />
</AdornedElementPlaceholder>
</DockPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
<Trigger Property="IsFocused" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
<Style x:Key="MenuLevel2" BasedOn="{StaticResource MetroTabItem}" TargetType="{x:Type TabItem}">
<Setter Property="mah:ControlsHelper.HeaderFontSize" Value="16" />
<Setter Property="mah:ControlsHelper.HeaderFontWeight" Value="Normal"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Foreground" Value="SteelBlue"/>
</Trigger>
<Trigger Property="IsSelected" Value="True">
</Trigger>
</Style.Triggers>
</Style>
<TextBox Grid.Column="1" Grid.Row="1" x:Name="txtBox_updateWebSrvURL" Style="{StaticResource TextBoxStyle}"
Validation.Error="Validation_Error"
Text="{Binding UpdateSourceTrigger=PropertyChanged, Path=webSrvURL,
ValidatesOnDataErrors=true, NotifyOnValidationError=true}"
Controls:TextBoxHelper.Watermark="MyWatermark here!!!!/" />
If I remove the custom style the watermark is well applied. Any idea how I can enable the watermark but still use my custom style?
wpf xaml
wpf xaml
asked Nov 19 '18 at 7:54
SalimSalim
13211
13211
You need to include the watermark in your custom ControlTemplate.
– mm8
Nov 19 '18 at 12:50
Can you show Controls:TextBoxHelper.Watermark code?
– kurakura88
Nov 20 '18 at 9:23
add a comment |
You need to include the watermark in your custom ControlTemplate.
– mm8
Nov 19 '18 at 12:50
Can you show Controls:TextBoxHelper.Watermark code?
– kurakura88
Nov 20 '18 at 9:23
You need to include the watermark in your custom ControlTemplate.
– mm8
Nov 19 '18 at 12:50
You need to include the watermark in your custom ControlTemplate.
– mm8
Nov 19 '18 at 12:50
Can you show Controls:TextBoxHelper.Watermark code?
– kurakura88
Nov 20 '18 at 9:23
Can you show Controls:TextBoxHelper.Watermark code?
– kurakura88
Nov 20 '18 at 9:23
add a comment |
1 Answer
1
active
oldest
votes
<Style x:Key="TextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="VerticalAlignment" Value="Center" />
<!--<Setter Property="BorderThickness" Value="1" />-->
<Setter Property="Margin" Value="10 0 30 0" />
<!--<Setter Property="BorderBrush" Value="SteelBlue" />-->
<Setter Property="BorderThickness" Value="0.7" />
<Setter Property="BorderBrush" Value="Gray" />
<Setter Property="Background" Value="AliceBlue" />
<Setter Property="Padding" Value="5" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<Grid>
<TextBox Text="{Binding Path=Text,
RelativeSource={RelativeSource TemplatedParent},
Mode=TwoWay,
UpdateSourceTrigger=PropertyChanged}"
x:Name="textSource"
Background="Transparent"
Panel.ZIndex="2" />
<TextBox Text="{TemplateBinding Tag}" x:Name="placeholdertext" VerticalContentAlignment="Center" Background="{TemplateBinding Background}" Panel.ZIndex="1">
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Setter Property="Foreground" Value="Transparent"/>
<Style.Triggers>
<DataTrigger Binding="{Binding Path=Text, Source={x:Reference textSource}}" Value="">
<Setter Property="Foreground" Value="LightGray"/>
</DataTrigger>
<DataTrigger Binding="{Binding Path=Text, Source={x:Reference textSource}}" Value="!">
<Setter Property="Opacity" Value="0"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<DockPanel LastChildFill="true">
<Border Background="OrangeRed" DockPanel.Dock="right" Margin="5,0,0,0"
Width="20" Height="20" CornerRadius="5"
ToolTip="{Binding ElementName=customAdorner,
Path=AdornedElement.(Validation.Errors)[0].ErrorContent}">
<TextBlock Text="!" VerticalAlignment="center" HorizontalAlignment="center"
FontWeight="Bold" Foreground="white" />
</Border>
<AdornedElementPlaceholder Name="customAdorner" VerticalAlignment="Center" >
<Border BorderBrush="red" BorderThickness="1" />
</AdornedElementPlaceholder>
</DockPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
<Trigger Property="IsFocused" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
TextBox
<TextBox Grid.Column="1" Grid.Row="1" x:Name="txtBox_updateWebSrvURL" Style="{StaticResource TextBoxStyle}"
Validation.Error="Validation_Error"
Text="{Binding UpdateSourceTrigger=PropertyChanged, Path=webSrvURL,
ValidatesOnDataErrors=true, NotifyOnValidationError=true}"
Tag="MyWatermark here!!!!/" />
Thanks for your proposal. It does the job but I see a side effect which is when a field is disabled the watermark is still visible on the top of the existing value. Have you got any idea how to fix this?
– Salim
Nov 20 '18 at 6:30
@Salim 😶 as i tested this is not happening, if field is disabled watermark gone, but still i updated the codes
– Shubham Sahu
Nov 20 '18 at 8:49
Hello, sorry for the delayed answer. I do confirm that the watermark still get printed when the field is disabled with a value in it. It is like if the code detect that the value is null when the field is disabled and print the watermark on top of what is present in the field. Any idea how to correct this?
– Salim
Dec 2 '18 at 7:01
@Salim as i am checking with same, but no watermark get printed 1drv.ms/v/s!AlsWJhYaBXFre2hlrd-TW9CZQ6M
– Shubham Sahu
Dec 2 '18 at 12:59
Hello, well there should be something that interferes. Any hint on how to debug?
– Salim
Dec 3 '18 at 13:12
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53370418%2fwpf-watermark-mahaps-with-defined-style%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
<Style x:Key="TextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="VerticalAlignment" Value="Center" />
<!--<Setter Property="BorderThickness" Value="1" />-->
<Setter Property="Margin" Value="10 0 30 0" />
<!--<Setter Property="BorderBrush" Value="SteelBlue" />-->
<Setter Property="BorderThickness" Value="0.7" />
<Setter Property="BorderBrush" Value="Gray" />
<Setter Property="Background" Value="AliceBlue" />
<Setter Property="Padding" Value="5" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<Grid>
<TextBox Text="{Binding Path=Text,
RelativeSource={RelativeSource TemplatedParent},
Mode=TwoWay,
UpdateSourceTrigger=PropertyChanged}"
x:Name="textSource"
Background="Transparent"
Panel.ZIndex="2" />
<TextBox Text="{TemplateBinding Tag}" x:Name="placeholdertext" VerticalContentAlignment="Center" Background="{TemplateBinding Background}" Panel.ZIndex="1">
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Setter Property="Foreground" Value="Transparent"/>
<Style.Triggers>
<DataTrigger Binding="{Binding Path=Text, Source={x:Reference textSource}}" Value="">
<Setter Property="Foreground" Value="LightGray"/>
</DataTrigger>
<DataTrigger Binding="{Binding Path=Text, Source={x:Reference textSource}}" Value="!">
<Setter Property="Opacity" Value="0"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<DockPanel LastChildFill="true">
<Border Background="OrangeRed" DockPanel.Dock="right" Margin="5,0,0,0"
Width="20" Height="20" CornerRadius="5"
ToolTip="{Binding ElementName=customAdorner,
Path=AdornedElement.(Validation.Errors)[0].ErrorContent}">
<TextBlock Text="!" VerticalAlignment="center" HorizontalAlignment="center"
FontWeight="Bold" Foreground="white" />
</Border>
<AdornedElementPlaceholder Name="customAdorner" VerticalAlignment="Center" >
<Border BorderBrush="red" BorderThickness="1" />
</AdornedElementPlaceholder>
</DockPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
<Trigger Property="IsFocused" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
TextBox
<TextBox Grid.Column="1" Grid.Row="1" x:Name="txtBox_updateWebSrvURL" Style="{StaticResource TextBoxStyle}"
Validation.Error="Validation_Error"
Text="{Binding UpdateSourceTrigger=PropertyChanged, Path=webSrvURL,
ValidatesOnDataErrors=true, NotifyOnValidationError=true}"
Tag="MyWatermark here!!!!/" />
Thanks for your proposal. It does the job but I see a side effect which is when a field is disabled the watermark is still visible on the top of the existing value. Have you got any idea how to fix this?
– Salim
Nov 20 '18 at 6:30
@Salim 😶 as i tested this is not happening, if field is disabled watermark gone, but still i updated the codes
– Shubham Sahu
Nov 20 '18 at 8:49
Hello, sorry for the delayed answer. I do confirm that the watermark still get printed when the field is disabled with a value in it. It is like if the code detect that the value is null when the field is disabled and print the watermark on top of what is present in the field. Any idea how to correct this?
– Salim
Dec 2 '18 at 7:01
@Salim as i am checking with same, but no watermark get printed 1drv.ms/v/s!AlsWJhYaBXFre2hlrd-TW9CZQ6M
– Shubham Sahu
Dec 2 '18 at 12:59
Hello, well there should be something that interferes. Any hint on how to debug?
– Salim
Dec 3 '18 at 13:12
add a comment |
<Style x:Key="TextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="VerticalAlignment" Value="Center" />
<!--<Setter Property="BorderThickness" Value="1" />-->
<Setter Property="Margin" Value="10 0 30 0" />
<!--<Setter Property="BorderBrush" Value="SteelBlue" />-->
<Setter Property="BorderThickness" Value="0.7" />
<Setter Property="BorderBrush" Value="Gray" />
<Setter Property="Background" Value="AliceBlue" />
<Setter Property="Padding" Value="5" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<Grid>
<TextBox Text="{Binding Path=Text,
RelativeSource={RelativeSource TemplatedParent},
Mode=TwoWay,
UpdateSourceTrigger=PropertyChanged}"
x:Name="textSource"
Background="Transparent"
Panel.ZIndex="2" />
<TextBox Text="{TemplateBinding Tag}" x:Name="placeholdertext" VerticalContentAlignment="Center" Background="{TemplateBinding Background}" Panel.ZIndex="1">
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Setter Property="Foreground" Value="Transparent"/>
<Style.Triggers>
<DataTrigger Binding="{Binding Path=Text, Source={x:Reference textSource}}" Value="">
<Setter Property="Foreground" Value="LightGray"/>
</DataTrigger>
<DataTrigger Binding="{Binding Path=Text, Source={x:Reference textSource}}" Value="!">
<Setter Property="Opacity" Value="0"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<DockPanel LastChildFill="true">
<Border Background="OrangeRed" DockPanel.Dock="right" Margin="5,0,0,0"
Width="20" Height="20" CornerRadius="5"
ToolTip="{Binding ElementName=customAdorner,
Path=AdornedElement.(Validation.Errors)[0].ErrorContent}">
<TextBlock Text="!" VerticalAlignment="center" HorizontalAlignment="center"
FontWeight="Bold" Foreground="white" />
</Border>
<AdornedElementPlaceholder Name="customAdorner" VerticalAlignment="Center" >
<Border BorderBrush="red" BorderThickness="1" />
</AdornedElementPlaceholder>
</DockPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
<Trigger Property="IsFocused" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
TextBox
<TextBox Grid.Column="1" Grid.Row="1" x:Name="txtBox_updateWebSrvURL" Style="{StaticResource TextBoxStyle}"
Validation.Error="Validation_Error"
Text="{Binding UpdateSourceTrigger=PropertyChanged, Path=webSrvURL,
ValidatesOnDataErrors=true, NotifyOnValidationError=true}"
Tag="MyWatermark here!!!!/" />
Thanks for your proposal. It does the job but I see a side effect which is when a field is disabled the watermark is still visible on the top of the existing value. Have you got any idea how to fix this?
– Salim
Nov 20 '18 at 6:30
@Salim 😶 as i tested this is not happening, if field is disabled watermark gone, but still i updated the codes
– Shubham Sahu
Nov 20 '18 at 8:49
Hello, sorry for the delayed answer. I do confirm that the watermark still get printed when the field is disabled with a value in it. It is like if the code detect that the value is null when the field is disabled and print the watermark on top of what is present in the field. Any idea how to correct this?
– Salim
Dec 2 '18 at 7:01
@Salim as i am checking with same, but no watermark get printed 1drv.ms/v/s!AlsWJhYaBXFre2hlrd-TW9CZQ6M
– Shubham Sahu
Dec 2 '18 at 12:59
Hello, well there should be something that interferes. Any hint on how to debug?
– Salim
Dec 3 '18 at 13:12
add a comment |
<Style x:Key="TextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="VerticalAlignment" Value="Center" />
<!--<Setter Property="BorderThickness" Value="1" />-->
<Setter Property="Margin" Value="10 0 30 0" />
<!--<Setter Property="BorderBrush" Value="SteelBlue" />-->
<Setter Property="BorderThickness" Value="0.7" />
<Setter Property="BorderBrush" Value="Gray" />
<Setter Property="Background" Value="AliceBlue" />
<Setter Property="Padding" Value="5" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<Grid>
<TextBox Text="{Binding Path=Text,
RelativeSource={RelativeSource TemplatedParent},
Mode=TwoWay,
UpdateSourceTrigger=PropertyChanged}"
x:Name="textSource"
Background="Transparent"
Panel.ZIndex="2" />
<TextBox Text="{TemplateBinding Tag}" x:Name="placeholdertext" VerticalContentAlignment="Center" Background="{TemplateBinding Background}" Panel.ZIndex="1">
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Setter Property="Foreground" Value="Transparent"/>
<Style.Triggers>
<DataTrigger Binding="{Binding Path=Text, Source={x:Reference textSource}}" Value="">
<Setter Property="Foreground" Value="LightGray"/>
</DataTrigger>
<DataTrigger Binding="{Binding Path=Text, Source={x:Reference textSource}}" Value="!">
<Setter Property="Opacity" Value="0"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<DockPanel LastChildFill="true">
<Border Background="OrangeRed" DockPanel.Dock="right" Margin="5,0,0,0"
Width="20" Height="20" CornerRadius="5"
ToolTip="{Binding ElementName=customAdorner,
Path=AdornedElement.(Validation.Errors)[0].ErrorContent}">
<TextBlock Text="!" VerticalAlignment="center" HorizontalAlignment="center"
FontWeight="Bold" Foreground="white" />
</Border>
<AdornedElementPlaceholder Name="customAdorner" VerticalAlignment="Center" >
<Border BorderBrush="red" BorderThickness="1" />
</AdornedElementPlaceholder>
</DockPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
<Trigger Property="IsFocused" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
TextBox
<TextBox Grid.Column="1" Grid.Row="1" x:Name="txtBox_updateWebSrvURL" Style="{StaticResource TextBoxStyle}"
Validation.Error="Validation_Error"
Text="{Binding UpdateSourceTrigger=PropertyChanged, Path=webSrvURL,
ValidatesOnDataErrors=true, NotifyOnValidationError=true}"
Tag="MyWatermark here!!!!/" />
<Style x:Key="TextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="VerticalAlignment" Value="Center" />
<!--<Setter Property="BorderThickness" Value="1" />-->
<Setter Property="Margin" Value="10 0 30 0" />
<!--<Setter Property="BorderBrush" Value="SteelBlue" />-->
<Setter Property="BorderThickness" Value="0.7" />
<Setter Property="BorderBrush" Value="Gray" />
<Setter Property="Background" Value="AliceBlue" />
<Setter Property="Padding" Value="5" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<Grid>
<TextBox Text="{Binding Path=Text,
RelativeSource={RelativeSource TemplatedParent},
Mode=TwoWay,
UpdateSourceTrigger=PropertyChanged}"
x:Name="textSource"
Background="Transparent"
Panel.ZIndex="2" />
<TextBox Text="{TemplateBinding Tag}" x:Name="placeholdertext" VerticalContentAlignment="Center" Background="{TemplateBinding Background}" Panel.ZIndex="1">
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Setter Property="Foreground" Value="Transparent"/>
<Style.Triggers>
<DataTrigger Binding="{Binding Path=Text, Source={x:Reference textSource}}" Value="">
<Setter Property="Foreground" Value="LightGray"/>
</DataTrigger>
<DataTrigger Binding="{Binding Path=Text, Source={x:Reference textSource}}" Value="!">
<Setter Property="Opacity" Value="0"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBox.Style>
</TextBox>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<DockPanel LastChildFill="true">
<Border Background="OrangeRed" DockPanel.Dock="right" Margin="5,0,0,0"
Width="20" Height="20" CornerRadius="5"
ToolTip="{Binding ElementName=customAdorner,
Path=AdornedElement.(Validation.Errors)[0].ErrorContent}">
<TextBlock Text="!" VerticalAlignment="center" HorizontalAlignment="center"
FontWeight="Bold" Foreground="white" />
</Border>
<AdornedElementPlaceholder Name="customAdorner" VerticalAlignment="Center" >
<Border BorderBrush="red" BorderThickness="1" />
</AdornedElementPlaceholder>
</DockPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" Value="0.56"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
<Trigger Property="IsFocused" Value="true">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
TextBox
<TextBox Grid.Column="1" Grid.Row="1" x:Name="txtBox_updateWebSrvURL" Style="{StaticResource TextBoxStyle}"
Validation.Error="Validation_Error"
Text="{Binding UpdateSourceTrigger=PropertyChanged, Path=webSrvURL,
ValidatesOnDataErrors=true, NotifyOnValidationError=true}"
Tag="MyWatermark here!!!!/" />
edited Nov 20 '18 at 8:49
answered Nov 19 '18 at 14:02
Shubham SahuShubham Sahu
1,2021928
1,2021928
Thanks for your proposal. It does the job but I see a side effect which is when a field is disabled the watermark is still visible on the top of the existing value. Have you got any idea how to fix this?
– Salim
Nov 20 '18 at 6:30
@Salim 😶 as i tested this is not happening, if field is disabled watermark gone, but still i updated the codes
– Shubham Sahu
Nov 20 '18 at 8:49
Hello, sorry for the delayed answer. I do confirm that the watermark still get printed when the field is disabled with a value in it. It is like if the code detect that the value is null when the field is disabled and print the watermark on top of what is present in the field. Any idea how to correct this?
– Salim
Dec 2 '18 at 7:01
@Salim as i am checking with same, but no watermark get printed 1drv.ms/v/s!AlsWJhYaBXFre2hlrd-TW9CZQ6M
– Shubham Sahu
Dec 2 '18 at 12:59
Hello, well there should be something that interferes. Any hint on how to debug?
– Salim
Dec 3 '18 at 13:12
add a comment |
Thanks for your proposal. It does the job but I see a side effect which is when a field is disabled the watermark is still visible on the top of the existing value. Have you got any idea how to fix this?
– Salim
Nov 20 '18 at 6:30
@Salim 😶 as i tested this is not happening, if field is disabled watermark gone, but still i updated the codes
– Shubham Sahu
Nov 20 '18 at 8:49
Hello, sorry for the delayed answer. I do confirm that the watermark still get printed when the field is disabled with a value in it. It is like if the code detect that the value is null when the field is disabled and print the watermark on top of what is present in the field. Any idea how to correct this?
– Salim
Dec 2 '18 at 7:01
@Salim as i am checking with same, but no watermark get printed 1drv.ms/v/s!AlsWJhYaBXFre2hlrd-TW9CZQ6M
– Shubham Sahu
Dec 2 '18 at 12:59
Hello, well there should be something that interferes. Any hint on how to debug?
– Salim
Dec 3 '18 at 13:12
Thanks for your proposal. It does the job but I see a side effect which is when a field is disabled the watermark is still visible on the top of the existing value. Have you got any idea how to fix this?
– Salim
Nov 20 '18 at 6:30
Thanks for your proposal. It does the job but I see a side effect which is when a field is disabled the watermark is still visible on the top of the existing value. Have you got any idea how to fix this?
– Salim
Nov 20 '18 at 6:30
@Salim 😶 as i tested this is not happening, if field is disabled watermark gone, but still i updated the codes
– Shubham Sahu
Nov 20 '18 at 8:49
@Salim 😶 as i tested this is not happening, if field is disabled watermark gone, but still i updated the codes
– Shubham Sahu
Nov 20 '18 at 8:49
Hello, sorry for the delayed answer. I do confirm that the watermark still get printed when the field is disabled with a value in it. It is like if the code detect that the value is null when the field is disabled and print the watermark on top of what is present in the field. Any idea how to correct this?
– Salim
Dec 2 '18 at 7:01
Hello, sorry for the delayed answer. I do confirm that the watermark still get printed when the field is disabled with a value in it. It is like if the code detect that the value is null when the field is disabled and print the watermark on top of what is present in the field. Any idea how to correct this?
– Salim
Dec 2 '18 at 7:01
@Salim as i am checking with same, but no watermark get printed 1drv.ms/v/s!AlsWJhYaBXFre2hlrd-TW9CZQ6M
– Shubham Sahu
Dec 2 '18 at 12:59
@Salim as i am checking with same, but no watermark get printed 1drv.ms/v/s!AlsWJhYaBXFre2hlrd-TW9CZQ6M
– Shubham Sahu
Dec 2 '18 at 12:59
Hello, well there should be something that interferes. Any hint on how to debug?
– Salim
Dec 3 '18 at 13:12
Hello, well there should be something that interferes. Any hint on how to debug?
– Salim
Dec 3 '18 at 13:12
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53370418%2fwpf-watermark-mahaps-with-defined-style%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
You need to include the watermark in your custom ControlTemplate.
– mm8
Nov 19 '18 at 12:50
Can you show Controls:TextBoxHelper.Watermark code?
– kurakura88
Nov 20 '18 at 9:23