Retemplating ChartView to add title bar

[Hafsa]

We've extended the RadCartesianChart to add custom features and behaviors. Adding a title bar (a WPF Label) to a new row above the re-templated ChartView seems to push it slightly beyond the boundaries of the containing element. How do I get the chart to fit into a smaller area within the template?

Thanks!

<ControlTemplate>

     <Grid Name="ParentGrid" >

          <Grid.RowDefinitions>

               <RowDefinition Height="Auto"/>

                <RowDefinition Height="*"/>

           </Grid.RowDefinitions>

           <Label Grid.Row="0" Name="TitleBar"  Background="WhiteSmoke" VerticalAlignment="Top"
                          HorizontalContentAlignment="Center"
                          Content="{Binding Title, RelativeSource={RelativeSource Mode=TemplatedParent}}"/>

            <!--CartesianChart template-->

       <Border Grid.Row="1" x:Name="layoutRoot"

             BorderBrush="{TemplateBinding BorderBrush}"

             BorderThickness="{TemplateBinding BorderThickness}"

             Background="{TemplateBinding Background}">

                <Grid>

                      <ContentPresenter x:Name="emptyContent"

                      ContentTemplate="{TemplateBinding EmptyContentTemplate}"

                      Content="{TemplateBinding EmptyContent}"

                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

                      IsHitTestVisible="False"

                      Visibility="Collapsed"

                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

                       <Canvas x:Name="adornerContainer"

                          Background="Transparent"

                          HorizontalAlignment="Stretch"

                          VerticalAlignment="Stretch">

                      <Canvas x:Name="labelContainer"

                         HorizontalAlignment="Stretch"

                         VerticalAlignment="Stretch">

                    <Canvas x:Name="renderSurface"

                        HorizontalAlignment="Stretch"

                        VerticalAlignment="Stretch">

                  <Border x:Name="plotAreaDecoration" Style="{TemplateBinding PlotAreaStyle}"/>

               </Canvas>

             </Canvas>

            </Canvas>

         </Grid>

        </Border>

     </Grid>

</ControlTemplate>

[Evgenia]

Hi Hafsa,

 Unfortunately RadChartView was not designed to be customized this way. It uses its ActualHeight for any inner representations of the containing elements. When you add your own element to the visual tree, you extend the Height of the whole control and those which does not fit the space left,  are visualized outside the visible area of the chart.

What I can suggest as a workaround is that you add your Title element inside the first grid of the Cartesian Chart (see the image attached):

    <!--CartesianChart template-->
                            <Border  x:Name="layoutRoot"
                             BorderBrush="{TemplateBinding BorderBrush}"
                             BorderThickness="{TemplateBinding BorderThickness}"
                             Background="{TemplateBinding Background}">
                                <Grid>
                                    <Label Name="TitleBar" Background="WhiteSmoke" VerticalAlignment="Top"
                                      HorizontalContentAlignment="Center" Content="My Title Here" ClipToBounds="False"/>
                                    <ContentPresenter x:Name="emptyContent"
                                     HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                     IsHitTestVisible="False"
                                     Visibility="Collapsed"
                                     VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
...

On the other side, you may add the Border that wraps the Label outside the template of the RadCartesianChart. This way it will appear above the Chart Area (everything will be visible and not overlapping).

All the best,
Evgenia
the Telerik team