We Keep Coding

C# WPF DataGrid Column Header fitting TextBox into width

I've a DataGrid in my C# WPF application and styled the Columns Header with a Label/TextBlock and a TextBox as an instant filter beneath of it.
My target is to fit the width of the TextBox into the width of the DataGridColumn, but I didn't found an acceptable way for me.
Currently I'm using a Viewbox, but this crashes all size measurements of the elements in the header.
Here is an example what it looks like with the Viewbox:
As you can see, I've either a too big TextBox and FontSize or a too small TextBox.
My currently code looks like that:
<DataGridTemplateColumn.Header>
<Viewbox StretchDirection="DownOnly">
<StackPanel>
<TextBlock Text="Mitarbeiter"/>
<TextBox x:Name="txtInstantSearchPersonio" HorizontalAlignment="Stretch" TextChanged="evh_InstantFilterChanged"/>
</StackPanel>
</Viewbox>
</DataGridTemplateColumn.Header>
Is there a way to fit the TextBox into full wifth of the column but don't stretch the height or fontsize?

You could use a Style for DataGridColumnHeader to fit the Textbox inside of a column
<DataGridTemplateColumn Width="200">
<DataGridTemplateColumn.HeaderStyle>
<Style TargetType="{x:Type DataGridColumnHeader}">
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
</Style>
</DataGridTemplateColumn.HeaderStyle>
<DataGridTemplateColumn.Header>
<StackPanel>
<TextBlock Text="Mitarbeiter"/>
<TextBox x:Name="txtInstantSearchPersonio" HorizontalAlignment="Stretch" TextChanged="evh_InstantFilterChanged"/>
</StackPanel>
</DataGridTemplateColumn.Header>

Tried by desperation results in an really simple solution.
I put both elements into a StackPanel:
<DataGridTemplateColumn.Header>
<StackPanel>
<TextBlock Margin="0" Padding="0" Text="Mitarbeiter"/>
<TextBox HorizontalAlignment="Stretch" TextChanged="evh_InstantFilterChanged"/>
</StackPanel>
</DataGridTemplateColumn.Header>
and set the DataGrid.ColumnHeaderStyle simply to this:
<Style x:Key="style_DataGridColumnHeader" TargetType="DataGridColumnHeader">
<Style.Setters>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
</Style.Setters>
</Style>
Works fine for me, the TextBox has always full width of the column header.

C# WPF The global style not working in some parts of the code [duplicate]

I am trying to learn something about WPF and I am quite amazed by its flexibility.
However, I have hit a problem with Styles and DataTemplates, which is little bit confusing.
I have defined below test page to play around a bit with styles etc and found that the Styles defined in <Page.Resources> for Border and TextBlock are not applied in the DataTemplate, but Style for ProgressBar defined in exactly the same way is applied.
Source code (I just use Kaxaml and XamlPadX to view the result)
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Page.Resources>
<Style TargetType="{x:Type Border}">
<Setter Property="Background" Value="SkyBlue"/>
<Setter Property="BorderBrush" Value="Black"/>
<Setter Property="BorderThickness" Value="2"/>
<Setter Property="CornerRadius" Value="5"/>
</Style>
<Style TargetType="{x:Type TextBlock}">
<Setter Property="FontWeight" Value="Bold"/>
</Style>
<Style TargetType="{x:Type ProgressBar}">
<Setter Property="Height" Value="10"/>
<Setter Property="Width" Value="100"/>
<Setter Property="Foreground" Value="Red"/>
</Style>
<XmlDataProvider x:Key="TestData" XPath="/TestData">
<x:XData>
<TestData xmlns="">
<TestElement>
<Name>Item 1</Name>
<Value>25</Value>
</TestElement>
<TestElement>
<Name>Item 2</Name>
<Value>50</Value>
</TestElement>
</TestData>
</x:XData>
</XmlDataProvider>
<HierarchicalDataTemplate DataType="TestElement">
<Border Height="45" Width="120" Margin="5,5">
<StackPanel Orientation="Vertical" Margin="5,5" VerticalAlignment="Center" HorizontalAlignment="Center">
<TextBlock HorizontalAlignment="Center" Text="{Binding XPath=Name}"/>
<ProgressBar Value="{Binding XPath=Value}"/>
</StackPanel>
</Border>
</HierarchicalDataTemplate>
</Page.Resources>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
<StackPanel Orientation="Vertical" VerticalAlignment="Center">
<Border Height="45" Width="120" Margin="5,5">
<StackPanel Orientation="Vertical" VerticalAlignment="Center" HorizontalAlignment="Center">
<TextBlock HorizontalAlignment="Center" Text="Item 1"/>
<ProgressBar Value="25"/>
</StackPanel>
</Border>
<Border Height="45" Width="120" Margin="5,5">
<StackPanel Orientation="Vertical" VerticalAlignment="Center" HorizontalAlignment="Center">
<TextBlock HorizontalAlignment="Center" Text="Item 2"/>
<ProgressBar Value="50"/>
</StackPanel>
</Border>
</StackPanel>
<ListBox Margin="10,10" Width="140" ItemsSource="{Binding Source={StaticResource TestData}, XPath=TestElement}"/>
</StackPanel>
</Page>
I suspect it has something to do with default styles etc, but more puzzling is why some Styles are applied and some not. I cannot find an easy explanation for above anywhere and thus would like to ask if someone would be kind enough to explain this behaviour in lamens' terms with possible links to technical description, i.e. to MSDN or so.
Thanks in advance for you support!

I discovered a simple workaround for this. For any elements that are not able to search outside the data template encapsulation boundary (i.e. are not being implicitly styled), you can just declare an empty style within the data template for that element type and use the BasedOn attribute of the style to find the correct implicit style outside the data template to apply.
In the example below, the TextBox is able to search outside the data template encapsulation boundary (because it inherits from Control?), but the TextBlock is not able to, so I declare the empty style for it which can search outside the data template.
<ItemsControl.ItemTemplate>
<DataTemplate>
<DataTemplate.Resources>
<Style TargetType="TextBlock" BasedOn="{StaticResource {x:Type TextBlock}}" />
</DataTemplate.Resources>
<DockPanel>
<TextBlock Text="{Binding Name}" />
<TextBox Text="{Binding Value}" />
</DockPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>

This is actually by design. Elements that do not derive from Control will not pick up implicit Styles, unless they are in the application resources.
This link explains this in more detail, or you can view the Connent bug report.

I've looked into this also, and I personally think it's a bug. I've noticed that the style is set if you name your styles like so:
<Style x:Key="BorderStyle" TargetType="{x:Type Border}">
etc...
and explicitly set your DataTemplate to use those styles:
<HierarchicalDataTemplate DataTemplate="TestElement">
<Border Height="45" Width="120" Margin="5,5", Style="{StaticResource BorderStyle}">
I think that it's possible that for DataTemplates (and maybe ControlTemplates), they default to having a null style, unless you explicitly set them.
That to me is not meant to happen - it's not a logical way of WPF working...

This is because ListBox is a logical parent of your datatemplate items, now remember, all properties those are "inheritable" like font, forecolor etc, are derived from the logical parent and ListBox already overrides it in its own default style, thats why this will not work. However in this case, you can use named styles as Mr. Dave has suggested, but I think if it does not work then this is a known problem in case of List Box etc, you can refere to my question here, i had similar problem in listbox, and the answers in my question are in more detail.

ListView Not Stretching to Flyout in Placement.Full

I'm Building a Win 10 UWP app. I have a ListView as per the below xaml, which is the content of a Button.Flyout. It is essentially the same as the standard ListView control, but provides a way for me to bind to the IsSelected property of the particular item. I've added the implementation for completeness. When MinWindowWitdth is 720, the placement mode is changed to Right. Whilst in this state, the ListViewItem stretches to fill the ListView. When not in this state (default), it is in Placement.Full, and the ListViewItem doesn't stretch to the entire ListView, which does seem to stretch to fill of the Flyout, as the VerticalScrollBar is visible against the right hand edge of the Flyout.
From what I could investigate, setting the ListView.ItemContainerStyle with HorizontalContentAlignment.Stretch should have achieved the outcome, however I am left with content that only stretches about half way across and I can't figure out why.
I notice that he CommandBar is included in the scrollable content in the full screen Flyout, however, when in Placement.Right it is not (which is the intended design). So it appears that Full is causing the Flyout to create a ScrollViewer and disregard the ListView.HorizontalAlignment.Stretch property. Is there a way to get around this?
xaml;
<Button.Flyout>
<Flyout x:Name="RulesListFlyout" Placement="Full">
<RelativePanel HorizontalAlignment="Stretch">
<commontools:ListViewWithSelectedItems x:Name="RulesListForInclusion" ItemsSource="{Binding AllRulesForInclusion}" SelectionMode="Multiple" IsMultiSelectCheckBoxEnabled="True"
RelativePanel.Above="RulesCommandB" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
</Style>
</ListView.ItemContainerStyle>
<ListView.ItemTemplate>
<DataTemplate x:DataType="ListViewItem">
<RelativePanel Margin="12,0" HorizontalAlignment="Stretch">
<TextBlock x:Name="Title" Text="{Binding StoredDataObject.Title}" RelativePanel.AlignLeftWithPanel="True"
RelativePanel.AlignTopWithPanel="True" RelativePanel.AlignRightWithPanel="True"/>
<TextBox x:Name="Variable" Text="{Binding InputVariable, Mode=TwoWay}" Width="50" AcceptsReturn="False" RelativePanel.Below="Title"
Visibility="{Binding ShowVariableBox, Converter={StaticResource TrueToVis}, Mode=TwoWay}"/>
</RelativePanel>
</DataTemplate>
</ListView.ItemTemplate>
</commontools:ListViewWithSelectedItems>
<CommandBar x:Name="RulesCommandB" Grid.Row="1" RelativePanel.AlignBottomWithPanel="True" RelativePanel.AlignLeftWithPanel="True" RelativePanel.AlignRightWithPanel="True">
<AppBarButton Icon="Accept" Label="Accept" Command="{Binding CommandSetIncludedRules}" Click="SetSpecialRuleFlyoutButton_Click"/>
<AppBarButton Icon="Cancel" Label="Cancel" Command="{Binding CommandResetIncludedRules}" Click="SetSpecialRuleFlyoutButton_Click"/>
</CommandBar>
</RelativePanel>
<Flyout.FlyoutPresenterStyle>
<Style TargetType="FlyoutPresenter">
<Setter Property="MinWidth" Value="100"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
</Style>
</Flyout.FlyoutPresenterStyle>
</Flyout>
</Button.Flyout>
ListView Implementation;
public class ListViewWithSelectedItems : ListView
{
protected override void PrepareContainerForItemOverride(DependencyObject element, object item)
{
base.PrepareContainerForItemOverride(element, item);
ListViewItem listItem = element as ListViewItem;
Binding binding = new Binding();
binding.Mode = BindingMode.TwoWay;
binding.Source = item;
binding.Path = new PropertyPath("IsCheckedInList");
listItem.SetBinding(ListViewItem.IsSelectedProperty, binding);
}
}

Access a control from within a DataTemplate with its identifying name

In my WPF application I have a ComboBox control that is located inside a Grid Control. In XAML I am assigning a name to the ComboBox:
<DataGridTemplateColumn Header="Status">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock VerticalAlignment="Center" Text="{Binding name_ru}" Width="Auto" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
<DataGridTemplateColumn.CellEditingTemplate>
<DataTemplate>
<ComboBox Name="stcom" Style="{DynamicResource ComboBoxStyle}" SelectionChanged="status_SelectionChanged" Height="auto" Width="Auto">
<ComboBox.BorderBrush>
<SolidColorBrush Color="{DynamicResource Color1}"/>
</ComboBox.BorderBrush>
</ComboBox>
</DataTemplate>
</DataGridTemplateColumn.CellEditingTemplate>
</DataGridTemplateColumn>
With the method FindName(string) I am trying to refer to the ComboBox with its associated name:
ComboBox stcom
{
get
{
return (ComboBox)FindName("stcom");
}
}
if (stcom != null)
{
stcom.ItemsSource = list;
}
But obviously the control can not be found because the reference stcom remains null.
The question now is how to refer to my ComboBox using its name property ?

The answer is:
<Style x:Key="CheckBoxStyle1" TargetType="{x:Type CheckBox}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type CheckBox}">
<StackPanel Orientation="Horizontal">
<Grid>
<TextBlock Name="tbUserIcon" Text="t1" />
<TextBlock Name="tbCheck" Text="✓" />
</Grid>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
and C#:
checkBox.ApplyTemplate();
var tbUserIcon= (TextBlock)checkBox.Template.FindName("tbUserIcon", checkBox);
don't forget the checkBox.ApplyTemplate() be fore Template.FindName() it's important!

First you have to get access to the control template which it has been applied to, then you can find an element of the template by name.
Have a look at the MSDN knowledge base :
How to: Find ControlTemplate-Generated Elements

You can't access controls that are part of a DataTemplate with their name.
You can try to read about some workarounds for example
WPF - Find a Control from DataTemplate in WPF
You can also have a look at the dozens of posts here on SO issuing this topic for example
here
here
here
here
here
here
here
here

Hide tooltip if binding is null

Currently i've got the following code to show a tooltip.
<Border BorderBrush="Black"
BorderThickness="{Binding Border}"
Height="23"
Background="{Binding Color}">
<ToolTipService.ToolTip>
<TextBlock Text="{Binding TooltipInformation}" />
</ToolTipService.ToolTip>
This is presented in a ItemsControl with about 25 items. Only a few of these have a value set to TooltipInformation
If TooltipInforation is an empty string, it still shows the tooltipbox containing the textblock as a very small window (about 5px high and 20px wide). Even if I set the textblock visbility to collapsed.
Is there a way to completely remove the tooltip if the value of TooltipInformation is null or a empty string?

One way to hide an empty tooltip for all controls is to create a style in a resource dictionary that is included in your App.xaml.
This style sets the visibility to collapsed when the tooltip is an empty string or null:
<!-- Style to hide tool tips that have an empty content. -->
<Style TargetType="ToolTip">
<Style.Triggers>
<Trigger Property="Content"
Value="{x:Static sys:String.Empty}">
<Setter Property="Visibility"
Value="Collapsed" />
</Trigger>
<Trigger Property="Content"
Value="{x:Null}">
<Setter Property="Visibility"
Value="Collapsed" />
</Trigger>
</Style.Triggers>
</Style>
Also include sys namespace (for String.Empty):
xmlns:sys="clr-namespace:System;assembly=mscorlib"

One way you can do that is wrap the ToolTip in a Rectangle and give it a Transparent color. Then you just set the Visibility to Collapsed on this Rectangle.
Update:
<Border Background="#FFE45F5F">
<Grid>
<TextBlock Text="{Binding Property1}"/>
<Rectangle Fill="Transparent" Visibility="{Binding Property2, Converter={StaticResource BooleanToVisibilityConverter}}" ToolTipService.ToolTip="{Binding TooltipInformation}"/>
</Grid>
</Border>

This is a WPF answer (haven't tried it in Silverlight).
Use ToolTipService.IsEnabled, and bind it to the tooltip property. Then use a converter to convert the tooltip string to a bool.
For example, I have the following:
<TextBlock x:Name="textBlock" ToolTipService.IsEnabled="{Binding EntryToolTip, Converter={StaticResource StringNullOrEmptyToBoolConverter}}">
...
</TextBlock>
Or in code-behind
ToolTipService.SetIsEnabled(textBlock, false);

I was having the same issue as I was setting value to String.Empty. Setting it to null solves the problem.
WinRT/Windows 8 App XAML

If just using the default tooltip I would otherwise recommend either setting the bound value to null in the viewmodel or using a converter whenever the item is empty.
In my case I've got a:
public string Name { get; }
Bound using:
<TextBlock Text="{Binding Name}" TextTrimming="CharacterEllipsis" Tooltip="{Binding Name}" />
Where the idea is to show the full name in the tooltip if cut of due to lack of width. In my viewmodel I simply:
if (string.IsNullOrEmpty(Name)) Name = null;
At least in .Net 4.0 this will not show a tooltip for me.

Strangely, none of these answers worked in my case. A reply to the top answer alludes to it - if you're ToolTip is related to a TextBlock then that solution won't work. I have a TextBlock within a DataGridTemplateColumn.CellTemplate element, and I just bound the text directly to the ToolTip property of the TextBlock like this:
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock
HorizontalAlignment="Center"
VerticalAlignment="Center"
ToolTip="{Binding Path=SomeTextProperty}"
Style="{StaticResource TextBlockOverflowStyle}"
Text="{Binding Path=SomeTextProperty, NotifyOnSourceUpdated=True}" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
And I ended up getting the desired behavior (hidden tooltip when text is empty) "for free".

You could create a converter from string to bool that returns false if the string length is 0 and true otherwise, then bind ToolTip.Active to TooltipInformation with that converter.