Can't get a Quarter Circle RadGauge to display properly

3 posts, 0 answers
  1. Doguhan
    Doguhan avatar
    1 posts
    Member since:
    Oct 2011

    Posted 31 Oct 2011 Link to this post

    Hi,

    I've wasted a lot of time trying to get this work. I simply can't get the Quarter Circle Metro style to work.

    I've attached a screen capture of what I get. Which is a yellow and black needle with a yellow radial bar. Not at all Metro.

    Below you can find my attachments, XAML and references.

    Your help would be much appreciated.

    Best,

    Doguhan

    The designer complains about:
    Warning    3    The resource "RadialScaleQuarterCircleNWStyle" could not be resolved.    C:\...\Page.xaml

    My project references are:
    - Telerik.Windows.Controls
    - Telerik.Windows.Controls.Gauge
    - Telerik.Windows.Themes.Metro
    - Telerik.Windows.Data

    <
    UserControl x:Class="SilverlightApplication2.MainPage"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"
            xmlns:my="clr-namespace:SilverlightApplication2" d:DesignHeight="300" d:DesignWidth="400"
            xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
            xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation">
        <UserControl.Resources>
            <ResourceDictionary>
                <ResourceDictionary.MergedDictionaries>
                    <ResourceDictionary Source="/Telerik.Windows.Themes.Metro;component/Themes/Metro/Gauge.xaml" />
                </ResourceDictionary.MergedDictionaries>
            </ResourceDictionary>
        </UserControl.Resources>
        <Grid x:Name="LayoutRoot" Background="White">
            <telerik:RadGauge telerik:StyleManager.Theme="Metro">
                <telerik:RadialGauge Height="100" Width="100" Style="{StaticResource RadialGaugeQuarterCircleNWStyle}">
                    <telerik:RadialScale Min="20" Max="40" MiddleTicks="1" MajorTicks="5"
                            Style="{StaticResource RadialScaleQuarterCircleNWStyle}">
                        <telerik:RadialScale.MiddleTick>
                            <telerik:MiddleTickProperties Length="0.08" />
                        </telerik:RadialScale.MiddleTick>
                        <telerik:RadialScale.MajorTick>
                            <telerik:MajorTickProperties Length="0.11" />
                        </telerik:RadialScale.MajorTick>
                        <telerik:RadialScale.Label>
                            <telerik:LabelProperties FontSize="10" Location="Outside" />
                        </telerik:RadialScale.Label>
                        <telerik:IndicatorList>
                            <telerik:RadialBar Value="38" />
                            <telerik:Needle IsAnimated="True" Value="21" />
                        </telerik:IndicatorList>
                    </telerik:RadialScale>
                </telerik:RadialGauge>
            </telerik:RadGauge>
        </Grid>
    </UserControl>
  2. Doguhan
    Doguhan avatar
    2 posts
    Member since:
    Oct 2011

    Posted 31 Oct 2011 Link to this post

    I realized I had a priority support, so I created a supper item for this.

    Support ID:478512

  3. DevCraft banner
  4. Andrey
    Admin
    Andrey avatar
    1681 posts

    Posted 03 Nov 2011 Link to this post

    Hello Doguhan,

    You've missed 1 important attribute in the RadiaGauge element telerik:StyleManager.Theme="Metro". The right XAML should looks like the following:

    <UserControl x:Class="SilverlightApplication2.MainPage"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"
            xmlns:my="clr-namespace:SilverlightApplication2" d:DesignHeight="300" d:DesignWidth="400"
            xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
            xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation">
        <UserControl.Resources>
            <ResourceDictionary>
                <ResourceDictionary.MergedDictionaries>
                    <ResourceDictionary Source="/Telerik.Windows.Themes.Metro;component/Themes/Metro/Gauge.xaml" />
                </ResourceDictionary.MergedDictionaries>
            </ResourceDictionary>
        </UserControl.Resources>
        <Grid x:Name="LayoutRoot" Background="White">
            <telerik:RadGauge telerik:StyleManager.Theme="Metro">
                <telerik:RadialGauge telerik:StyleManager.Theme="Metro"
                             Height="100" Width="100"
                             Style="{StaticResource RadialGaugeQuarterCircleNWStyle}">
                    <telerik:RadialScale Min="20" Max="40" MiddleTicks="1" MajorTicks="5"
                        Style="{StaticResource RadialScaleQuarterCircleNWStyle}">
                        <telerik:RadialScale.MiddleTick>
                            <telerik:MiddleTickProperties Length="0.08" />
                        </telerik:RadialScale.MiddleTick>
                        <telerik:RadialScale.MajorTick>
                            <telerik:MajorTickProperties Length="0.11" />
                        </telerik:RadialScale.MajorTick>
                        <telerik:RadialScale.Label>
                            <telerik:LabelProperties FontSize="10" Location="Outside" />
                        </telerik:RadialScale.Label>
                        <telerik:IndicatorList>
                            <telerik:RadialBar Value="38" />
                            <telerik:Needle IsAnimated="True" Value="21" />
                        </telerik:IndicatorList>
                    </telerik:RadialScale>
                </telerik:RadialGauge>
            </telerik:RadGauge>
        </Grid>
    </UserControl>


    All the best,
    Andrey Murzov
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

Back to Top