Skip to content
Steven Edouard edited this page Oct 25, 2015 · 1 revision

As mentioned in the Custom Menu section, MeterSubMenu can be attached to any RadialMenu's CustomMenu property. A MeterSubMenu can display a meter with any number of ranges of values.

Use the following XAML to create a MeterSubMenu for a CustomMenu:

<rmb:RadialMenuButton x:Name="Pen1StrokeButton" IconImage="Icons/stroke.png" Label="Stroke">
    <rmb:RadialMenuButton.CustomMenu>
        <rm:MeterSubMenu x:Name="Pen1StrokeMenu"
                          CenterButtonBorder="Black"
                          MeterEndValue="72"
                          MeterStartValue="5"
                          MeterRadius="80"
                          StartAngle="-90"
                          MeterPointerLength="80"
                          RoundSelectValue="True"
                          OuterEdgeBrush="#383739"
                          />
    </rmb:RadialMenuButton.CustomMenu>
</rmb:RadialMenuButton>

Meter Range Intervals

Meter Range Intervals are a collection of objects which describe a value range to be assigned to a specified degree range of the meter circle, from 0 and 259 degrees. Each degree range has a value range and an interval for that range which is used to draw the ticks you see in the menu below:

Using code behind, you can specify these ranges for this example like this:

Pen1StrokeMenu.Intervals = new List<MeterRangeInterval>()
        {
            new MeterRangeInterval
            {
               StartValue = 5,
               EndValue = 11,
               TickInterval = 1,
               StartDegree = 0,
               EndDegree = 90
            },
            new MeterRangeInterval
            {
                StartValue = 11,
                EndValue = 12,
                TickInterval = 1,
                StartDegree = 90,
                EndDegree = 110
            },
            new MeterRangeInterval
            {
                StartValue = 12,
                EndValue = 28,
                TickInterval = 2,
                StartDegree = 110,
                EndDegree = 250
            },
            new MeterRangeInterval
            {
                StartValue = 28,
                EndValue = 36,
                TickInterval = 8,
                StartDegree = 250,
                EndDegree = 280
            },
            new MeterRangeInterval
            {
                StartValue = 36,
                EndValue = 48,
                TickInterval = 12,
                StartDegree = 280,
                EndDegree = 300
            },
            new MeterRangeInterval
            {
                StartValue = 48,
                EndValue = 72,
                TickInterval = 24,
                StartDegree = 300,
                EndDegree = 320
            }
        };

Configuring the MeterSubMenu

You can easily do one or two-way binding onto the MeterSubMenu by specifying bind-attr tags onto the the XAML. For example, if you wanted to bind to the LockedValue property of the menu, which specifies what the target value of the meter is you can do this:

<userControl:MeterSubMenu x:Name="Pen1OpacityMenu"                                                                    CenterButtonBorder="Black"                                                                           MeterEndValue="100"                                                                           MeterStartValue="0"                                                                             MeterRadius="80"                                                                              StartAngle="-90"                                                                          MeterPointerLength="80"
LockedValue="{Binding MyLockedValue, Mode=TwoWay}"                                                                      RoundSelectValue="True"                                                                                         OuterEdgeBrush="#383739" />

Given a variable MyLockedValue, changes to this variable will changed the locked value on the MeterSubMenu, and changes from the MeterSubMenu will change the value of MyLockedValue.