I want to show a red border around a Textbox when a validation error occurs. This works, but there is also a blue border showing inside the red one, which I don't want to be shown. Is there a way to remove this?
Style for the Textbox
<Style x:Key="StandardTextbox" TargetType="{x:Type TextBox}">
<Setter Property="Height" Value="20"/>
<Setter Property="Margin" Value="10,5,10,5" />
<Setter Property="FontSize" Value="12"/>
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="BorderBrush" Value="{StaticResource Blau}"/>
<Setter Property="VerticalContentAlignment" Value="Center" />
</Style>
Usage in Window:
<TextBox Grid.Row="0" Grid.Column="1"
Text="{Binding Path=Location,
UpdateSourceTrigger=PropertyChanged,
ValidatesOnDataErrors=True,
NotifyOnValidationError=true}"
Style="{StaticResource StandardTextbox}" Grid.ColumnSpan="3"/>
Enlargement:
That's because you're setting BorderBrush to Blau inside your Style. You can remove it if there is any Validation error by using Triggers. Like,
<Style x:Key="StandardTextbox" TargetType="{x:Type TextBox}">
<Setter Property="Height" Value="20"/>
<Setter Property="Margin" Value="10,5,10,5" />
<Setter Property="FontSize" Value="12"/>
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="BorderBrush" Value="{StaticResource Blau}"/>
<Setter Property="VerticalContentAlignment" Value="Center" />
<Style.Triggers>
<Trigger Property="Validation.HasError" Value="true">
<Setter Property="BorderBrush" Value="Transparent"/>
</Trigger>
</Style.Triggers>
</Style>
Related
I'm trying to add a tooltip to textbox to show it when the text input is empty in TextChangedEvent,
I have tried this solution from this post How add and show tooltip textbox WPF if textbox not empty
<Style x:Key="TextBoxStyle" TargetType="TextBox">
<Setter Property="Padding" Value="5"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="Width" Value="200"/>
<Style.Triggers>
<Trigger Property="ToolTip" Value="{x:Static sys:String.Empty}">
<Setter Property="ToolTipService.IsEnabled" Value="False" />
</Trigger>
</Style.Triggers>
</Style>
But I got this error :
Error A 'Binding' cannot be set on the 'Value' property of type 'Trigger'. A 'Binding' can only be set on a DependencyProperty of a DependencyObject.
How can I fix this problem ?
Update:
In addition, I would like to implement something like that ( without MVVM pattern ):
Source: Facebook Website
I didn't quite understand what kind of logic you want to implement.
From my guess, this is to show the ToolTip only when the line is empty or, on the contrary, do not show it for empty.
Here are both fully working options.
<Style x:Key="TextBoxStyle" TargetType="TextBox">
<Setter Property="Padding" Value="5"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="Width" Value="200"/>
<Setter Property="ToolTipService.IsEnabled" Value="False"/>
<Setter Property="ToolTip">
<Setter.Value>
<ToolTip>
<TextBlock Text="Hello World!"/>
</ToolTip>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="Text" Value="{x:Static sys:String.Empty}">
<Setter Property="ToolTipService.IsEnabled" Value="True" />
</Trigger>
</Style.Triggers>
</Style>
<Style x:Key="TextBoxStyle" TargetType="TextBox">
<Setter Property="Padding" Value="5"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="Width" Value="200"/>
<Setter Property="ToolTipService.IsEnabled" Value="True"/>
<Setter Property="ToolTip">
<Setter.Value>
<ToolTip>
<TextBlock Text="Hello World!"/>
</ToolTip>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="Text" Value="{x:Static sys:String.Empty}">
<Setter Property="ToolTipService.IsEnabled" Value="False" />
</Trigger>
</Style.Triggers>
</Style>
Using:
<TextBox Style="{DynamicResource TextBoxStyle}"/>
I want to display datevalues in a DataGrid, whereas the text is vertically aligned in the center of the row, and not at the top. If I change the VerticalAlignment property in the DataGridCell Style, the text is aligned correctly, but a frame appears. Setting BorderThickness to 0 does not fix this.
How can I get rid of the frame/border and also display the text in the middle of the row?
DataGrid Style
<Style x:Key="StandardTabelle" TargetType="{x:Type DataGrid}">
<Setter Property="Margin" Value="5"/>
<Setter Property="Background" Value="White"/>
<Setter Property="AlternatingRowBackground" Value="#ebecec"/>
<Setter Property="FontSize" Value="12" />
<Setter Property="RowHeight" Value="24"/>
<Setter Property="ColumnHeaderStyle" Value="{StaticResource StandardSpaltenKopf}" />
<Setter Property="CanUserAddRows" Value="False"/>
<Setter Property="CanUserDeleteRows" Value="False"/>
<Setter Property="CanUserReorderColumns" Value="False"/>
<Setter Property="CanUserResizeRows" Value="False"/>
<Setter Property="CanUserResizeColumns" Value="False"/>
<Setter Property="IsReadOnly" Value="True" />
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="RowStyle" Value="{StaticResource AusgewählteZeile}"/>
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="VerticalAlignment" Value="Center"/>
</Style>
Style for selected Row
<Style x:Key="AusgewählteZeile" TargetType="{x:Type DataGridRow}">
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="{StaticResource Rot}"/>
</Trigger>
</Style.Triggers>
</Style>
Style for Datecell with top alignment
<Style x:Key="DatumZelle" TargetType="DataGridCell">
<Setter Property="HorizontalContentAlignment" Value="Right"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="BorderThickness" Value="0"/>
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="Transparent" />
</Trigger>
</Style.Triggers>
</Style>
You could create a custom ControlTemplate:
<Style x:Key="DatumZelle" TargetType="DataGridCell">
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DataGridCell}">
<Grid Background="{TemplateBinding Background}">
<ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Right" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="Transparent" />
</Trigger>
</Style.Triggers>
</Style>
I just want to copy the label content from the UI Window. Anybody can help how to make it?
I had the same problem as you.
I wanted my labels to be selectable.
I did not find a proper way to do that, instead I use a TextBox with a custom style.
<Style x:Key="TextBoxAsLabel" TargetType="{x:Type TextBox}">
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.WindowTextBrushKey}}"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="KeyboardNavigation.TabNavigation" Value="None"/>
<Setter Property="HorizontalContentAlignment" Value="Left"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="FocusVisualStyle" Value="{x:Null}"/>
<Setter Property="AllowDrop" Value="False"/>
<Setter Property="FontFamily" Value="Arial"/>
<Setter Property="HorizontalAlignment" Value="Stretch" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="TextWrapping" Value="Wrap"/>
<Setter Property="FontSize" Value="11"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<themes:ClassicBorderDecorator x:Name="Bd" BorderThickness="0" BorderStyle="Sunken" Background="{TemplateBinding Background}">
<ScrollViewer x:Name="PART_ContentHost" BorderBrush="Transparent" BorderThickness="0"/>
</themes:ClassicBorderDecorator>
<ControlTemplate.Triggers>
<Trigger Property="IsReadOnly" Value="true">
<Setter Property="Background" TargetName="Bd" Value="Transparent"/>
<Setter Property="Foreground" Value="Black"/>
<Setter Property="BorderThickness" Value="0,0,0,0"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
you also need to add this to your namespaces:
xmlns:themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Classic"
Usage is : <TextBox Text="{Binding ValueToBind}" IsReadOnly="True" Style="{DynamicResource TextBoxAsLabel}" />
Note: Change your style binding type as needed.
Hope this will help you :)
You shouldn't have to override the entire template. Try this:
<TextBox Text="Copy this...">
<TextBox.Style>
<Style TargetType="TextBox">
<Setter Property="IsReadOnly" Value="True" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="TextWrapping" Value="Wrap" />
</Style>
</TextBox.Style>
</TextBox>
The above style should give you a selectable TextBox that looks like a TextBlock or a Label.
i want to style the row header gripper style to be like the column header style
how to do that?
i want the headers to look like this:
<Style x:Key="dataGridColumnHeaderStyle" TargetType="{x:Type toolkit:DataGridColumnHeader}">
<Setter Property="Foreground" Value="Black" />
<Setter Property="Height" Value="34"/>
<Setter Property="FontWeight" Value="Bold"/>
<Setter Property="Foreground" Value="White"/>
<Setter Property="Padding" Value="5,0,5,0" />
<Setter Property="Background" Value="{StaticResource clalBlueGlossyGradientEffect}" />
<Setter Property="BorderBrush" Value="White" />
<Setter Property="BorderThickness" Value="1, 0, 0, 0" />
<Setter Property="SnapsToDevicePixels" Value="True" />
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<TextBlock TextWrapping="Wrap" Text="{Binding}"/>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
On hover of a HyperlinkButton in a vertical StackPanel, controls below the HyperlinkButton inch down a few pixels. It's kind of a weird bug, and I'm sure there's a fix, but the only HyperlinkButton bug fix I find relates to large text rendering a tad blurry on hover, not this positioning bug. Has anyone come across this?
XAML:
<Canvas x:Name="LayoutRoot">
...
<StackPanel x:Name="Article1" Style="{StaticResource ArticleContainer}"
Canvas.Top="46">
<StackPanel Orientation="Horizontal">
<Image x:Name="Article1Image" Style="{StaticResource ImageCategory}"/>
<TextBlock x:Name="Article1Title" Style="{StaticResource TitleText}"/>
</StackPanel>
<TextBlock x:Name="Article1Posted" Style="{StaticResource PostedText}"/>
<HyperlinkButton x:Name="Author1Link" Style="{StaticResource HLBStyling}">
<TextBlock x:Name="Article1By" Style="{StaticResource AuthorText}"/>
</HyperlinkButton>
<TextBlock x:Name="Article1Content" Style="{StaticResource ContentText}"/>
<HyperlinkButton x:Name="Article1Link" Style="{StaticResource HLBStyling}">
<TextBlock x:Name="Article1ReadMore" Style="{StaticResource ReadMoreText}"/>
</HyperlinkButton>
</StackPanel>
...
</Canvas>
App.xaml:
<Style x:Key="ContentPanel" TargetType="Border">
<Setter Property="Height" Value="427"/>
<Setter Property="Width" Value="250"/>
<Setter Property="Canvas.Top" Value="33"/>
<Setter Property="Canvas.Left" Value="0"/>
<Setter Property="Canvas.ZIndex" Value="1"/>
</Style>
<Style x:Key="ArticleContainer" TargetType="StackPanel">
<Setter Property="Height" Value="195"/>
<Setter Property="Width" Value="230"/>
<Setter Property="Canvas.Left" Value="10"/>
<Setter Property="Canvas.ZIndex" Value="2"/>
</Style>
<Style x:Key="ImageCategory" TargetType="Image">
<Setter Property="Width" Value="40"/>
<Setter Property="Height" Value="40"/>
<Setter Property="Margin" Value="5,5,5,0"/>
</Style>
<Style x:Key="TitleText" TargetType="TextBlock">
<Setter Property="LineStackingStrategy" Value="BlockLineHeight"/>
<Setter Property="FontSize" Value="14"/>
<Setter Property="FontWeight" Value="SemiBold"/>
<Setter Property="TextWrapping" Value="Wrap"/>
<Setter Property="Height" Value="32"/>
<Setter Property="Width" Value="170"/>
<Setter Property="TextTrimming" Value="WordEllipsis"/>
<Setter Property="Margin" Value="10,0,0,0"/>
</Style>
<Style x:Key="PostedText" TargetType="TextBlock">
<Setter Property="FontSize" Value="12"/>
<Setter Property="TextWrapping" Value="Wrap"/>
<Setter Property="Height" Value="14"/>
<Setter Property="Width" Value="230"/>
<Setter Property="Margin" Value="0,10,0,0"/>
</Style>
<Style x:Key="AuthorText" TargetType="TextBlock">
<Setter Property="FontSize" Value="12"/>
<Setter Property="TextWrapping" Value="Wrap"/>
<Setter Property="Height" Value="14"/>
<Setter Property="Width" Value="230"/>
</Style>
<Style x:Key="ContentText" TargetType="TextBlock">
<Setter Property="LineStackingStrategy" Value="BlockLineHeight"/>
<Setter Property="FontSize" Value="12"/>
<Setter Property="TextWrapping" Value="Wrap"/>
<Setter Property="MaxHeight" Value="90"/>
<Setter Property="Width" Value="230"/>
<Setter Property="TextTrimming" Value="WordEllipsis"/>
</Style>
<Style x:Key="ReadMoreText" TargetType="TextBlock">
<Setter Property="FontSize" Value="12"/>
<Setter Property="Height" Value="16"/>
</Style>
<Style x:Key="HLBStyling" TargetType="HyperlinkButton">
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="IsTabStop" Value="False"/>
</Style>
This is caused by your the two styles you are using for HyperLinkButton (HLBStyling) and the TextBlocks they contain (AuthorText, ReadMoreText).
If you remove the TextBlock and just set the Content of the HyperLinkButton, the problem goes away. Also if you remove the style from the TextBlocks within the buttons, the problem goes away.