Get Header name - wpf

Hello I am a bit lost with the control Templates, I have an expander and some control-styles that apply onto the Expander.
So the idea is to let the User insert the header
<Expander Name="MyExpanderExpander" Style="{StaticResource MyExpanderNewGeneration}" Header="UserChoice" OverridesDefaultStyle="True" VerticalAlignment="Top" Margin="0,0,0,0" Height="210">
So now the Style : MyExpanderNewGeneration should get the header Name : UserChoic
The ToggleButton has to get the Header Name : UserChoice and here is my problem ..but how to do it?
my Style applying is
<Style TargetType="Expander" x:Key="MyExpanderNewGeneration" BasedOn="{StaticResource BaseControlStyle}" >
<!--x:Key="GroupBoxStyle"-->
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Expander">
<Grid>
<!--Grid Rows split the GroupBox into two areas -->
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--Header area-->
<Border Name="HeaderArea"
Grid.Row="0"
Background="Transparent"
BorderBrush="Transparent"
BorderThickness="1"
CornerRadius="2,2,0,0" >
<ToggleButton x:Name="ExpanderButton"
Grid.Row="0"
Grid.Column="0"
Margin="0,0,0,0"
VerticalAlignment="Top"
Template="{StaticResource TestToggleButton}"
Content="{TemplateBinding Header}"
IsChecked="{Binding Path=IsExpanded, RelativeSource={RelativeSource TemplatedParent}}"
OverridesDefaultStyle="True">
</ToggleButton>
Herer I want to get the UserChoice Name.
<ControlTemplate x:Key="TestToggleButton" TargetType="{x:Type ToggleButton}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="300"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Label Foreground="White" Width="300" Grid.Column="0" FontSize="15"
HorizontalAlignment="Left" FontWeight="Normal" Something={HEADER???}
How to solve this?

Since you are setting Content="{TemplateBinding Header}" in your ExpanderButton, you will need to bind to the Content property inside your TestToggleButton style's control template:
<ControlTemplate x:Key="TestToggleButton" TargetType="{x:Type ToggleButton}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="300"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Label
...
Content={TemplateBinding Content} />
...
</Grid>
</ControlTemplate>

Related

Custom style tooltip and binding to button WPF with code xaml?

I would like to create a style for the tooltip and use it always binding to each button.
I can only do so from XAML?
I have done this for now:
<Window.Resources>
<Style x:Key="{x:Type ToolTip}" TargetType="{x:Type ToolTip}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToolTip}">
<Grid Width="200" Height="Auto" MinHeight="80">
<Grid.RowDefinitions>
<RowDefinition Height="20"/>
<RowDefinition Height="1*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Row="0" Grid.Column="1" FontWeight="Bold"
HorizontalAlignment="Left" VerticalAlignment="Center"
Text="{Binding Path=TitleTT}"/>
<Image Grid.Column="0" Grid.RowSpan="2" Source="{Binding Path=ImageTT}"
HorizontalAlignment="Stretch" VerticalAlignment="Center"/>
<TextBlock Grid.Row="1" Grid.Column="1" TextWrapping="Wrap" Margin="2"
HorizontalAlignment="Left" VerticalAlignment="Center"
Text="{Binding Path=DescriptionTT}"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
Now, I want to build a button in another user control.
What should I do?
What's wrong? why can not join anything?
Thanks for the help.
Code Button:
<Button Name="button_conf" Content="{DynamicResource Button_Confirm}" Margin="18,10"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
HorizontalContentAlignment="Center" VerticalContentAlignment="Center" Click="button_conf_Click">
<Button.ToolTip>
<ToolTip Style=ToolTip TitleTT="{DynamicResource ToolTip_title__confirm_defsce}"
ImageTT="/Images/xsd.jpg" DescriptionTT="The button confirm....:"/>
</Button.ToolTip>
</Button>
I can see at least the following two typos:
1.
<Style x:Key="{x:Type ToolTip}" TargetType="{x:Type ToolTip}"
should be
<Style x:Key="ToolTipStyle" TargetType="{x:Type ToolTip}"
Of course, you can use another name than ToolTipStyle.
2.
<ToolTip Style=ToolTip
should be
<ToolTip Style="{StaticResource ToolTipStyle}"
Apart from that, the properties TitleTT, ImageTT and DescriptionTT do not exist on the ToolTip control.

Adding line to a shape in XAML

I am modifying the button visual appearance in my XAML code with a hexagon. Now, I want to add 2 lines to the two outer edges of the hexagon like the image below:
https://skydrive.live.com/redir.aspx?cid=204df65b0e6e1655&resid=204DF65B0E6E1655!117&parid=204DF65B0E6E1655!107&authkey=!AEzKZRmwMNhBWxM
Can anyone tell how and where to add it ? My code is something like this
<Page.Resources>
<Style TargetType="Button">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Canvas>
<Polygon Canvas.Top="30" Points=
"430,0
400,32
-30,32
-60,0
-30,-32
400,-32"
Stroke="Brown" StrokeThickness="10"/>
<ContentPresenter Canvas.Left="80" Foreground="White" FontSize="40"></ContentPresenter>
</Canvas>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
<Grid Background="Black">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Button Grid.Row="1" Margin="40,-100 0,-50" HorizontalAlignment="Center">Hello World</Button>
</Grid>
I cant get the line to connect to those edges and spread all the way to the page end.
Any idea ?
Do you want this within your button style? I was able to achieve this through the XAML button control template code below.
I put separators in a grid and then put rectangles on top them to add stroke to the image.
I also added an upper margin of 2 onto the polygon to align with the rectangles.
<ControlTemplate TargetType="Button">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="500"/>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Rectangle Fill="White" Grid.Column="0"/>
<Rectangle Fill="White" Grid.Column="2"/>
<Separator Background="White" Grid.Column="0"/>
<Separator Background="White" Grid.Column="2"/>
<Canvas Grid.Column="1" Margin="64,2,0,0">
<Polygon Points=
"430,0
400,32
-30,32
-60,0
-30,-32
400,-32"
Stroke="Brown" StrokeThickness="10"/>
<ContentPresenter Canvas.Left="80" Foreground="White" FontSize="40"/>
</Canvas>
</Grid>
</ControlTemplate>

Why does a WPF DataGrid sometimes remain horizontally shrunk?

I have a user who sometimes sees a DataGrid that doesn't expand to fit its space: visually squeezed data grid http://www.varigence.com/images/compressedDataGrid.jpg.
I'm looking to solve the mystery of why this is happening. Usually, when the Grid first loads, the DataGrid will appear shrunk for a moment, but then expands to fill the appropriate space. The sole lead I have is that the user who sees this says it doesn't repro when he disables Aero in Windows.
I've added a (simplified) snippet of the XAML I'm using below.
Does anyone out there have ideas as to the cause?
Thanks,
-Craig
<Grid
AllowDrop="True"
Background="White"
MinHeight="400"
MinWidth="1100"
MaxHeight="{Binding RelativeSource={RelativeSource AncestorType={x:Type Editors:DesignerEditor}}, Path=MainWindowScrollViewer.ViewportHeight, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"
MaxWidth="{Binding RelativeSource={RelativeSource AncestorType={x:Type Editors:DesignerEditor}}, Path=MainWindowScrollViewer.ViewportWidth, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"
>
<Grid.ColumnDefinitions>
<ColumnDefinition MinWidth="350" Width="*"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition MinWidth="250" Width="*"/>
</Grid.ColumnDefinitions>
<Border
Grid.Column="0"
BorderThickness="1"
BorderBrush="{StaticResource headerBackgroundBrush}"
CornerRadius="4"
HorizontalAlignment="Stretch"
Margin="10,10,0,10"
VerticalAlignment="Stretch"
>
<Grid
KeyboardNavigation.TabNavigation="Local"
>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock
Grid.Row="0"
Text="Columns"
/>
<DataGrid:SelectingDataGrid
x:Name="columnDataGrid"
Grid.Row="1"
AutoGenerateColumns="False"
BorderBrush="{StaticResource excelBorderBrush}"
HorizontalAlignment="Left"
ItemsSource="{Binding ElementName=tableEditor, Path=SelectedContext.Columns.FilterCollection}"
RowDetailsTemplateSelector="{StaticResource columnDetailsTemplateSelector}"
RowDetailsVisibilityMode="VisibleWhenSelected"
SelectionMode="Extended"
SelectionUnit="FullRow"
>
<DataGrid:SelectingDataGrid.ItemContainerStyle>
<Style
TargetType="{x:Type DataGridRow}"
BasedOn="{StaticResource {x:Type DataGridRow}}"
>
<Setter
Property="IsSelected"
Value="{Binding IsSelected, Mode=TwoWay}"
/>
</Style>
</DataGrid:SelectingDataGrid.ItemContainerStyle>
<DataGrid:SelectingDataGrid.Columns>
...
</DataGrid:SelectingDataGrid.Columns>
</DataGrid:SelectingDataGrid>
</Grid>
</Border>
<GridSplitter
Grid.Column="1"
Background="White"
IsTabStop="False"
ResizeBehavior="PreviousAndNext"
Width="20"
/>
I'm going to assume that you want the DataGrid to fill up the left column. If you change
HorizontalAlignment="Left"
to
HorizontalAlignment="Stretch"
it should solve the problem.

How do I get a TextBox to fill a resizable column?

I'm trying to get a TextBox to fill the available space in a resizable column. The TextBox is part of a user control:
<UserControl x:Class="TextBoxLayout.FieldControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Label Grid.Column="0">Name</Label>
<TextBox Grid.Column="1"/>
</Grid>
</UserControl>
This user control is in a window with a vertical splitter:
<Window x:Class="TextBoxLayout.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:TextBoxLayout"
Title="Text box layout" Height="400" Width="600">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition MinWidth="100"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition MinWidth="100"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition/>
</Grid.RowDefinitions>
<local:FieldControl Grid.Column="0" Grid.Row="0" MaxWidth="200" HorizontalAlignment="Left"/>
<TextBlock Grid.Column="0" Grid.Row="1" Text="Testing"/>
<GridSplitter Grid.Column="1" Grid.Row="0" Grid.RowSpan="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="3"/>
<TextBlock Grid.Column="2" Grid.Row="0" Grid.RowSpan="2" Text="Testing"/>
</Grid>
</Window>
The problem is the TexTBox appears to be very narrow - what I'd want it to do is fill the left column and resize with the splitter. How do I do that?
Use HorizontalAlignment="Stretch" instead of "Left" for FieldControl. Remove MaxWidth if required. Use TextAlignment to align text.
Just wanted to add to more examples for future code searches.
I put this in the top of the xaml file:
<UserControl.Resources>
<Style TargetType="{x:Type TextBlock}" x:Key="CenterCell">
<Setter Property="Background" Value="{Binding Included, Converter={StaticResource BoolToColorConverter}}"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="TextAlignment" Value="Center"/>
</Style>
</UserControl.Resources>
And then in the datagrid:
<DataGridTextColumn Header="Excluded" Binding="{Binding Excluded}" ElementStyle="{StaticResource CenterCell}"/>
This centers the text and sorting is still enabled. The textbox fills the cell and in this case is colored using a bool converter.
just see whether is that you want
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition MinWidth="100" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition MinWidth="100" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition />
</Grid.RowDefinitions>
<local:FieldControl Grid.Column="0"
Grid.Row="0"
Margin="2"
/>
<TextBlock Grid.Column="0"
Grid.Row="1"
Text="Testing" />
<GridSplitter Grid.Column="1"
Grid.Row="0"
Grid.RowSpan="2"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Width="3" />
<TextBlock Grid.Column="2"
Grid.Row="0"
Grid.RowSpan="2"
Text="Testing" />
</Grid>

WPF combobox items list/context menu rendered behind parent

If the ItemSource property of a combo box has been set, why could clicking on the drop down botton of a combobox not display the list of available items? This may be related but within the same control, any context menu is displayed behind the user control:
The XAML for this control is as follows:
<Border Name="Border" Padding="5">
<ScrollViewer VerticalScrollBarVisibility="Auto">
<ScrollViewer.Resources>
<Style TargetType="{x:Type CheckBox}">
<Setter Property="Padding" Value="8,0,0,0"/>
<Setter Property="VerticalAlignment" Value="Center"/>
</Style>
</ScrollViewer.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Margin="5,4,0,4" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20" />
<ColumnDefinition SharedSizeGroup="labelColumn1" />
<ColumnDefinition SharedSizeGroup="labelColumn2" />
<ColumnDefinition SharedSizeGroup="dataEntryColumn" />
<ColumnDefinition Width="30"/>
<ColumnDefinition SharedSizeGroup="labelColumn2"/>
<ColumnDefinition SharedSizeGroup="dataEntryColumn" />
<ColumnDefinition MaxWidth="0" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition MinHeight="23" />
<RowDefinition MinHeight="23" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<TextBlock Text="Geometry Type" VerticalAlignment="Center" Grid.Column="1" Grid.Row="0"/>
<ComboBox Grid.Column="3" Margin="6,1,0,1" Grid.Row="0" Width="150"
Name="cmboGeometryTypes"
SelectedItem="{Binding GeometryType, Mode=TwoWay}"
HorizontalAlignment="Left"
DisplayMemberPath="Name"
Grid.ColumnSpan="1"
/>
<TextBlock Text="Symbol Type"
Grid.Column="1" Grid.Row="1" VerticalAlignment="Center"/>
<ComboBox
Name="cmboSymbolEditors"
SelectedItem="{Binding SymbolEditorViewModel, Mode=TwoWay}"
HorizontalAlignment="Left"
DisplayMemberPath="Alias"
Width="150"
Grid.Column="3"
Margin="6,1,0,1"
Grid.Row="1"
Grid.ColumnSpan="1" />
</Grid>
<Label Padding="10,0,0,0" Margin="10,0,0,3" Style="{StaticResource fadingLabelSeperatorStlye}" Grid.Row="1">
Editor
</Label>
<local:SymbologyEditorControl x:Name="editor" Grid.Row="2"/>
</Grid>
</ScrollViewer>
</Border>
and the effect I am observing is illustrated below
How do I fix this?
There was a common WPF bug that caused this behavior of any Popup type UI displaying in back instead of topmost so that may be what you're seeing. I haven't seen the issue in a while but I'm not sure if it was fixed or not. It's related to bad video drivers so you might see it only on certain machines and not all the time.
There was a hotfix available from MS support but it might be easier to just switch your application to use software rendering instead.

Resources