This is a migrated thread and some comments may be shown as answers.

TemplateBinding in ColumnDefinition doesn't work

1 Answer 60 Views
Gauges
This is a migrated thread and some comments may be shown as answers.
Miha Markic
Top achievements
Rank 1
Miha Markic asked on 27 Apr 2010, 01:08 PM
I am looking at needle customization documentation topic: "Customizing appearance of the radial gauge " and the following template:
<Style x:Key="TriangleNeedleTemplate" TargetType="{x:Type telerik:Needle}"
                <Setter Property="Template"
                    <Setter.Value> 
                        <ControlTemplate TargetType="{x:Type telerik:Needle}"
                            <Grid Width="{TemplateBinding ActualWidth}" Height="{TemplateBinding ActualHeight}"
                                <Grid.ColumnDefinitions> 
                                    <ColumnDefinition Width="{TemplateBinding ActualHeight}"/> 
                                    <ColumnDefinition Width="*" /> 
                                </Grid.ColumnDefinitions> 
 
                                <Grid.RowDefinitions> 
                                    <RowDefinition Height="{TemplateBinding ActualHeight}" /> 
                                </Grid.RowDefinitions> 
                                <Border Background="Red" /> 
                                <Polygon Grid.ColumnSpan="2" Points="0,0 1,0.5 0,1 0,0" Stretch="Fill"  
                                         Fill="White" /> 
                            </Grid> 
                        </ControlTemplate> 
                    </Setter.Value> 
                </Setter> 
            </Style> 

produces templatebinding (attached) picture. Note the red rectangle that should be ActualHeight x ActualHeight big, yet it is much wider (1/2 of the grid).
However, the "should be equivalent" binding
{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ActualHeight
produces the correct result (see expandedbinding picture).
Correct style:
<Style x:Key="TriangleNeedleTemplate" TargetType="{x:Type telerik:Needle}"
                <Setter Property="Template"
                    <Setter.Value> 
                        <ControlTemplate TargetType="{x:Type telerik:Needle}"
                            <Grid Width="{TemplateBinding ActualWidth}" Height="{TemplateBinding ActualHeight}"
                                <Grid.ColumnDefinitions> 
                                    <ColumnDefinition Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ActualHeight}"/> 
                                    <ColumnDefinition Width="*" /> 
                                </Grid.ColumnDefinitions> 
 
                                <Grid.RowDefinitions> 
                                    <RowDefinition Height="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=ActualHeight}" /> 
                                </Grid.RowDefinitions> 
                                <Border Background="Red" /> 
                                <Polygon Grid.ColumnSpan="2" Points="0,0 1,0.5 0,1 0,0" Stretch="Fill"  
                                         Fill="White" /> 
                            </Grid> 
                        </ControlTemplate> 
                    </Setter.Value> 
                </Setter> 
            </Style> 



1 Answer, 1 is accepted

Sort by
0
Accepted
Andrey
Telerik team
answered on 29 Apr 2010, 12:37 PM
Hi Miha Markic,

I'm sorry for documentation. It is a bit late. We've changed default template of the needle so both Silverlight and WPF versions has same one and operates consistently. The triangle needle template which corresponds to the new needle structure should looks like the following:

<Style x:Key="TriangleNeedleTemplate" TargetType="{x:Type telerik:Needle}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type telerik:Needle}">
                <Grid x:Name="PART_Grid" 
                      HorizontalAlignment="Stretch" 
                      VerticalAlignment="Stretch">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <!-- Column 0 - tail -->
                        <ColumnDefinition Width="*"/>
                        <!-- Column 1 - pin point -->
                        <ColumnDefinition Width="*"/>
                        <!-- Column 2 - arrow -->
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Border Grid.Column="1" Background="Red" />
                    <Polygon Grid.Column="1" 
                         Grid.ColumnSpan="2" 
                         Points="0,0 1,0.5 0,1 0,0" 
                         Stretch="Fill"   
                         Fill="White" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>


Best wishes,
Andrey Murzov
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Tags
Gauges
Asked by
Miha Markic
Top achievements
Rank 1
Answers by
Andrey
Telerik team
Share this question
or