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

CustomTickMark problem

1 Answer 113 Views

Gauges

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

ali asked on 01 Sep 2010, 02:41 PM

Hi,

I have a linear gauge with two linear scales. One scale has a range list and a bar indicator, and the other one has a marker indicator and two custom tick marks. The problem is that I don't know how to create the custom tick marks. What I need is two simple rectangular tick marks, one red and the other yellow.
To get started, I tried to use an example from another thread, one with °C label, but i keep getting the following error:

System.Windows.Data Error: 25 : ItemTemplate and ItemTemplateSelector are not valid for item.; Type='CustomTickMark'

The code with °C label is posted below.

<control:RadGauge MaxWidth="100"
                                          telerikControls:StyleManager.Theme="Windows7"
                                          BorderThickness="0"
                                          BorderBrush="Transparent"
                                          VerticalAlignment="Stretch"
                                          Height="Auto"
                                          Grid.Row="0"
                                          Grid.Column="0"
                                          Margin="5"
                                          x:Name="radGauge">
                            <telerik:LinearGauge Height="Auto"
                                                 Grid.Row="0"
                                                 Grid.Column="0"
                                                 x:Name="LinearGaugeDay">
                                <telerik:LinearScale x:Name="linearScaleDay"
                                                     Min="0"
                                                     Max="{Binding Path=MaximumProductivity}"
                                                     MajorTicks="1"
                                                     MiddleTicks="10"
                                                     MinorTicks="1"
                                                     Left="0.5"
                                                     Top="0.1"
                                                     RelativeHeight="0.81"
                                                     FontSize="9">

                                    <telerik:LinearScale.MajorTick>
                                        <telerik:MajorTickProperties Location="OverCenter"
                                                                     x:Name="MajorTickProperties0" />
                                    </telerik:LinearScale.MajorTick>
                                    <telerik:LinearScale.MiddleTick>
                                        <telerik:MiddleTickProperties Location="OverCenter"
                                                                      Length="0.07"
                                                                      x:Name="MiddleTickProperties0" />
                                    </telerik:LinearScale.MiddleTick>
                                    <telerik:LinearScale.MinorTick>
                                        <telerik:MinorTickProperties Location="OverCenter"
                                                                     Length="0.055"
                                                                     x:Name="MinorTickProperties0" />
                                    </telerik:LinearScale.MinorTick>

                                    <telerik:LinearScale.Label>
                                        <telerik:LabelProperties x:Name="LabelRightx0"
                                                                 FontSize="12"
                                                                 FontFamily="Arial"
                                                                 Foreground="White"
                                                                 Offset="0.02"
                                                                 Location="Inside" />
                                    </telerik:LinearScale.Label>

                                    <telerik:RangeList x:Name="RangeList0">
                                        <telerik:LinearRange Min="0"
                                                             Max="{Binding Path=MinimumProductivity}"
                                                             StartWidth="0.02"
                                                             EndWidth="0.02"
                                                             Location="Inside"
                                                             Style="{StaticResource RangePalette_Red}"
                                                             x:Name="LinearRange0" />
                                        <telerik:LinearRange Min="{Binding Path=MinimumProductivity}"
                                                             Max="{Binding Path=MediumProductivity}"
                                                             StartWidth="0.02"
                                                             EndWidth="0.02"
                                                             Location="Inside"
                                                             Style="{StaticResource RangePalette_Yellow}"
                                                             x:Name="LinearRange1" />
                                        <telerik:LinearRange Min="{Binding Path=MediumProductivity}"
                                                             Max="{Binding Path=MaximumProductivity}"
                                                             StartWidth="0.02"
                                                             EndWidth="0.02"
                                                             Location="Inside"
                                                             Style="{StaticResource RangePalette_Green}"
                                                             x:Name="LinearRange2" />
                                    </telerik:RangeList>


                                    <telerik:IndicatorList x:Name="IndicatorList0">
                                        <telerik:LinearBar Name="linearBar1"
                                                           Value="{Binding Path=DayProductivity}"
                                                           StartWidth="0.04"
                                                           EndWidth="0.04"
                                                           Location="OverCenter"
                                                           UseRangeColor="True"
                                                           IsAnimated="True" />

                                    </telerik:IndicatorList>
                                </telerik:LinearScale>

                                <telerik:LinearScale x:Name="linearScaleDayLeft"
                                                     Min="0"
                                                     Max="{Binding Path=MaximumProductivity}"
                                                     MajorTicks="10"
                                                     MiddleTicks="0"
                                                     MinorTicks="0"
                                                     Left="0.5"
                                                     Top="0.1"
                                                     RelativeHeight="0.81"
                                                     FontSize="9">
                                    <telerik:LinearScale.MajorTick>
                                        <telerik:MajorTickProperties Location="OverCenter"
                                                                     x:Name="MajorTickProperties1" />
                                    </telerik:LinearScale.MajorTick>
                                    <telerik:LinearScale.MiddleTick>
                                        <telerik:MiddleTickProperties Location="OverCenter"
                                                                      Length="0.07"
                                                                      x:Name="MiddleTickProperties1" />
                                    </telerik:LinearScale.MiddleTick>
                                    <telerik:LinearScale.MinorTick>
                                        <telerik:MinorTickProperties Location="OverCenter"
                                                                     Length="0.055"
                                                                     x:Name="MinorTickProperties1" />
                                    </telerik:LinearScale.MinorTick>

                                    <telerik:LinearScale.Label>
                                        <telerik:LabelProperties x:Name="LabelLeftx0"
                                                                 Offset="0.02"
                                                                 Location="Outside" />
                                    </telerik:LinearScale.Label>

                                    <telerik:TickList>
                                        <telerik:CustomTickMark Value="-7"
                                                                Location="Inside"
                                                                Offset="-0.02">
                                            <telerik:CustomTickMark.Template>
                                                <ControlTemplate>
                                                    <ContentPresenter>
                                                        <ContentPresenter.Content>
                                                            <Canvas>
                                                                <TextBlock HorizontalAlignment="Center"
                                                                           FontWeight="Bold"
                                                                           FontSize="14"
                                                                           Foreground="White"
                                                                           Text="°C" />
                                                            </Canvas>
                                                        </ContentPresenter.Content>
                                                    </ContentPresenter>
                                                </ControlTemplate>
                                            </telerik:CustomTickMark.Template>
                                            <telerik:CustomTickMark.ItemTemplate>
                                                <DataTemplate />
                                            </telerik:CustomTickMark.ItemTemplate>
                                        </telerik:CustomTickMark>
                                    </telerik:TickList>



                                    <telerik:IndicatorList x:Name="IndicatorList1">
                                        <telerik:Marker x:Name="gauge_marker_Day"
                                                        RelativeHeight="0.04"
                                                        RelativeWidth="0.04"
                                                        FontSize="12"
                                                        FontFamily="Arial"
                                                        Foreground="White"
                                                        Offset="0.02"
                                                        Location="CenterOutside"
                                                        IsAnimated="True"
                                                        Value="{Binding Path=DayProductivity}">
                                        </telerik:Marker>
                                    </telerik:IndicatorList>
                                </telerik:LinearScale>

                            </telerik:LinearGauge>
                        </control:RadGauge>

What am I doing wrong? Do you have any suggestions for this?

Regards,
Ali

1 Answer, 1 is accepted

answered on 03 Sep 2010, 12:39 PM

Hi ali,

I am afraid we were not able to reproduce the problem. I've simplified your XAML a bit, because you didn't provide all styles and I did not get any errors. The only thing I would recommend you is moving of the custom tickmark template to the style definition. Otherwise it will be overridden by default template from the Windows7 theme (you are using it in the RadGauge element). The final XAML I've used to reproduce the problem looks like the following:

<Window x:Class="Telerik.RadGauge.WPF.Q1.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"

Title="MainWindow" Height="350" Width="600">

<Window.Resources>

<ResourceDictionary>

<ResourceDictionary.MergedDictionaries>

<ResourceDictionary Source="/Telerik.Windows.Controls.Gauge;component/Themes/generic.xaml" />

</ResourceDictionary.MergedDictionaries>

<DataTemplate x:Key="TickLabelEmpty">

<Canvas />

</DataTemplate>

<Style x:Key="CustomTickMarkStyle" TargetType="telerik:CustomTickMark">

<Setter Property="Template">

<Setter.Value>

<ControlTemplate>

<ContentPresenter>

<ContentPresenter.Content>

<Canvas>

<TextBlock HorizontalAlignment="Center"

FontWeight="Bold"

FontSize="14"

Foreground="White"

Text="°C" />

</Canvas>

</ContentPresenter.Content>

</ContentPresenter>

</ControlTemplate>

</Setter.Value>

</Setter>

<Setter Property="ItemTemplate" Value="{StaticResource TickLabelEmpty}" />

<Setter Property="Length" Value="0.05" />

<Setter Property="Offset" Value="0.02" />

<Setter Property="TickWidth" Value="1" />

<Setter Property="Location" Value="Outside" />

<Setter Property="Format" Value="{}{0:F0}" />

<Setter Property="FontSize" Value="11" />

<Setter Property="Background">

<Setter.Value>

<LinearGradientBrush EndPoint="0.5,0" StartPoint="0.5,1">

<GradientStop Color="#FFCB576E" Offset="1"/>

<GradientStop Color="#FFFF8D8D"/>

</LinearGradientBrush>

</Setter.Value>

</Setter>

</Style>

</ResourceDictionary>

</Window.Resources>

<Grid>

<telerik:RadGauge MaxWidth="100"

telerik:StyleManager.Theme="Windows7"

BorderThickness="0"

BorderBrush="Transparent"

VerticalAlignment="Stretch"

Height="Auto"

Grid.Row="0"

Grid.Column="0"

Margin="5"

x:Name="radGauge">

<telerik:LinearGauge Height="Auto"

Grid.Row="0"

Grid.Column="0"

x:Name="LinearGaugeDay">

<telerik:LinearScale x:Name="linearScaleDay"

Min="0"

Max="{Binding Path=MaximumProductivity}"

MajorTicks="1"

MiddleTicks="10"

MinorTicks="1"

Left="0.5"

Top="0.1"

RelativeHeight="0.81"

FontSize="9">

<telerik:LinearScale.MajorTick>

<telerik:MajorTickProperties Location="OverCenter"

x:Name="MajorTickProperties0" />

</telerik:LinearScale.MajorTick>

<telerik:LinearScale.MiddleTick>

<telerik:MiddleTickProperties Location="OverCenter"

Length="0.07"

x:Name="MiddleTickProperties0" />

</telerik:LinearScale.MiddleTick>

<telerik:LinearScale.MinorTick>

<telerik:MinorTickProperties Location="OverCenter"

Length="0.055"

x:Name="MinorTickProperties0" />

</telerik:LinearScale.MinorTick>

<telerik:LinearScale.Label>

<telerik:LabelProperties x:Name="LabelRightx0"

FontSize="12"

FontFamily="Arial"

Foreground="White"

Offset="0.02"

Location="Inside" />

</telerik:LinearScale.Label>

<telerik:RangeList x:Name="RangeList0">

<telerik:LinearRange Min="0"

Max="{Binding Path=MinimumProductivity}"

StartWidth="0.02"

EndWidth="0.02"

Location="Inside"

Background="Red"

x:Name="LinearRange0" />

<telerik:LinearRange Min="{Binding Path=MinimumProductivity}"

Max="{Binding Path=MediumProductivity}"

StartWidth="0.02"

EndWidth="0.02"

Location="Inside"

Background="Yellow"

x:Name="LinearRange1" />

<telerik:LinearRange Min="{Binding Path=MediumProductivity}"

Max="{Binding Path=MaximumProductivity}"

StartWidth="0.02"

EndWidth="0.02"

Location="Inside"

Background="Green"

x:Name="LinearRange2" />

</telerik:RangeList>

<telerik:IndicatorList x:Name="IndicatorList0">

<telerik:LinearBar Name="linearBar1"

Value="{Binding Path=DayProductivity}"

StartWidth="0.04"

EndWidth="0.04"

Location="OverCenter"

UseRangeColor="True"

IsAnimated="True" />

</telerik:IndicatorList>

</telerik:LinearScale>

<telerik:LinearScale x:Name="linearScaleDayLeft"

Min="0"

Max="{Binding Path=MaximumProductivity}"

MajorTicks="10"

MiddleTicks="0"

MinorTicks="0"

Left="0.5"

Top="0.1"

RelativeHeight="0.81"

FontSize="9">

<telerik:LinearScale.MajorTick>

<telerik:MajorTickProperties Location="OverCenter"

x:Name="MajorTickProperties1" />

</telerik:LinearScale.MajorTick>

<telerik:LinearScale.MiddleTick>

<telerik:MiddleTickProperties Location="OverCenter"

Length="0.07"

x:Name="MiddleTickProperties1" />

</telerik:LinearScale.MiddleTick>

<telerik:LinearScale.MinorTick>

<telerik:MinorTickProperties Location="OverCenter"

Length="0.055"

x:Name="MinorTickProperties1" />

</telerik:LinearScale.MinorTick>

<telerik:LinearScale.Label>

<telerik:LabelProperties x:Name="LabelLeftx0"

Offset="0.02"

Location="Outside" />

</telerik:LinearScale.Label>

<telerik:TickList>

<telerik:CustomTickMark Value="-7"

Location="Inside"

Offset="-0.02"

Style="{StaticResource CustomTickMarkStyle}">

</telerik:CustomTickMark>

</telerik:TickList>

<telerik:IndicatorList x:Name="IndicatorList1">

<telerik:Marker x:Name="gauge_marker_Day"

RelativeHeight="0.04"

RelativeWidth="0.04"

FontSize="12"

FontFamily="Arial"

Foreground="White"

Offset="0.02"

Location="CenterOutside"

IsAnimated="True"

Value="{Binding Path=DayProductivity}">

</telerik:Marker>

</telerik:IndicatorList>

</telerik:LinearScale>

</telerik:LinearGauge>

</telerik:RadGauge>

</Grid>

</Window>

Could you, please, provide simple solution which we can use to reproduce the error you have?

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

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

CustomTickMark problem

1 Answer, 1 is accepted