BulletGraph Styling

3 posts, 1 answers
  1. Martin
    Martin avatar
    6 posts
    Member since:
    Apr 2011

    Posted 17 May 2011 Link to this post

    Hi,

    Is it possible to modify the appearance of the BulletGraph QualitativeRanges and/or FeaturedMeasure?
    I would like to add gradient shading.

  2. WPF version:  3.0.6920.4902
            (as per http://msdn.microsoft.com/en-us/library/aa349641.aspx)
  3. OS:  Windows 7 Enterprise 64-bit
  4. exact browser version:  IE9 v9.0.8112.16421
  5. exact version of the Telerik product:  RadControls for WPF v2011.1.419.40
  6. preferred programming language (VB.NET or C#):  C#


  7. Thank you,
    - Martin
  • Answer
    Yavor
    Admin
    Yavor avatar
    401 posts

    Posted 20 May 2011 Link to this post

    Hi Martin,

    Featured and projected measure, comparative measures and qualitative ranges all expose a Brush property that can be any kind of brush. You can add linear gradient brush easily using Visual Studio or Expression Blend build-in brush creator. Another option is to define them in xaml like this:

    <telerik:RadHorizontalBulletGraph Height="35" Width="300" FeaturedMeasure="60" ComparativeMeasure="75" Maximum="100">
        <telerik:RadHorizontalBulletGraph.FeaturedMeasureBrush>
            <LinearGradientBrush>
                <GradientStop Color="Aqua" Offset="0" />
                <GradientStop Color="DarkGoldenrod" Offset="1" />
            </LinearGradientBrush>
        </telerik:RadHorizontalBulletGraph.FeaturedMeasureBrush>
        <telerik:RadHorizontalBulletGraph.QualitativeRanges>
            <telerik:QualitativeRange Value="30">
                <telerik:QualitativeRange.Brush>
                    <LinearGradientBrush>
                        <GradientStop Color="Black" Offset="0" />
                        <GradientStop Color="Red" Offset="1" />
                    </LinearGradientBrush>
                </telerik:QualitativeRange.Brush>
            </telerik:QualitativeRange>
            <telerik:QualitativeRange Value="60">
                <telerik:QualitativeRange.Brush>
                    <LinearGradientBrush>
                        <GradientStop Color="Red" Offset="0" />
                        <GradientStop Color="Blue" Offset="1" />
                    </LinearGradientBrush>
                </telerik:QualitativeRange.Brush>
            </telerik:QualitativeRange>
            <telerik:QualitativeRange>
                <telerik:QualitativeRange.Brush>
                    <LinearGradientBrush>
                        <GradientStop Color="Blue" Offset="0" />
                        <GradientStop Color="Green" Offset="1" />
                    </LinearGradientBrush>
                </telerik:QualitativeRange.Brush>
            </telerik:QualitativeRange>
        </telerik:RadHorizontalBulletGraph.QualitativeRanges>
    </telerik:RadHorizontalBulletGraph>

    Hope this helps!


    Greetings,
    Yavor Ivanov
    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
  • UI for WPF is Visual Studio 2017 Ready
  • Martin
    Martin avatar
    6 posts
    Member since:
    Apr 2011

    Posted 20 May 2011 Link to this post

    Yavor,
    Thank you for the directions and sample code, they both worked.

    My mistake was not digging far enough in Visual Studio 2010.  I looked for gradients under the "Brushes" group in the Properties window.  But for the QualitativeRange tag, Brush is under the "Other" group.  Once I found that, everything came together.

    Best regards,
    - Martin
  • Back to Top