|
| 1 | +// ****************************************************************** |
| 2 | +// Copyright (c) Microsoft. All rights reserved. |
| 3 | +// This code is licensed under the MIT License (MIT). |
| 4 | +// THE CODE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, |
| 5 | +// INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, |
| 6 | +// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. |
| 7 | +// IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, |
| 8 | +// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, |
| 9 | +// TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH |
| 10 | +// THE CODE OR THE USE OR OTHER DEALINGS IN THE CODE. |
| 11 | +// ****************************************************************** |
| 12 | + |
| 13 | +using System; |
| 14 | +using Windows.Foundation; |
| 15 | +using Windows.UI.Xaml; |
| 16 | +using Windows.UI.Xaml.Controls; |
| 17 | +using Windows.UI.Xaml.Media; |
| 18 | + |
| 19 | +namespace Microsoft.Toolkit.Uwp.UI.Controls |
| 20 | +{ |
| 21 | + /// <summary> |
| 22 | + /// An alternative impementation of a progress bar. |
| 23 | + /// Progression is represented by a loop filling up in a clockwise fashion. |
| 24 | + /// Like the traditional progress bar, it inherits from RangeBase, so Minimum, Maximum and Value properties work the same way. |
| 25 | + /// </summary> |
| 26 | + [TemplatePart(Name = OutlineFigurePartName, Type = typeof(PathFigure))] |
| 27 | + [TemplatePart(Name = OutlineArcPartName, Type = typeof(ArcSegment))] |
| 28 | + [TemplatePart(Name = BarFigurePartName, Type = typeof(PathFigure))] |
| 29 | + [TemplatePart(Name = BarArcPartName, Type = typeof(ArcSegment))] |
| 30 | + public sealed class RadialProgressBar : ProgressBar |
| 31 | + { |
| 32 | + private const string OutlineFigurePartName = "OutlineFigurePart"; |
| 33 | + private const string OutlineArcPartName = "OutlineArcPart"; |
| 34 | + private const string BarFigurePartName = "BarFigurePart"; |
| 35 | + private const string BarArcPartName = "BarArcPart"; |
| 36 | + |
| 37 | + private PathFigure outlineFigure; |
| 38 | + private PathFigure barFigure; |
| 39 | + private ArcSegment outlineArc; |
| 40 | + private ArcSegment barArc; |
| 41 | + |
| 42 | + private bool allTemplatePartsDefined = false; |
| 43 | + |
| 44 | + /// <summary> |
| 45 | + /// Called when the Minimum property changes. |
| 46 | + /// </summary> |
| 47 | + /// <param name="oldMinimum">Old value of the Minimum property.</param> |
| 48 | + /// <param name="newMinimum">New value of the Minimum property.</param> |
| 49 | + protected override void OnMinimumChanged(double oldMinimum, double newMinimum) |
| 50 | + { |
| 51 | + base.OnMinimumChanged(oldMinimum, newMinimum); |
| 52 | + RenderSegment(); |
| 53 | + } |
| 54 | + |
| 55 | + /// <summary> |
| 56 | + /// Called when the Maximum property changes. |
| 57 | + /// </summary> |
| 58 | + /// <param name="oldMaximum">Old value of the Maximum property.</param> |
| 59 | + /// <param name="newMaximum">New value of the Maximum property.</param> |
| 60 | + protected override void OnMaximumChanged(double oldMaximum, double newMaximum) |
| 61 | + { |
| 62 | + base.OnMaximumChanged(oldMaximum, newMaximum); |
| 63 | + RenderSegment(); |
| 64 | + } |
| 65 | + |
| 66 | + /// <summary> |
| 67 | + /// Called when the Value property changes. |
| 68 | + /// </summary> |
| 69 | + /// <param name="oldValue">Old value of the Value property.</param> |
| 70 | + /// <param name="newValue">New value of the Value property.</param> |
| 71 | + protected override void OnValueChanged(double oldValue, double newValue) |
| 72 | + { |
| 73 | + base.OnValueChanged(oldValue, newValue); |
| 74 | + RenderSegment(); |
| 75 | + } |
| 76 | + |
| 77 | + /// <summary> |
| 78 | + /// Update the visual state of the control when its template is changed. |
| 79 | + /// </summary> |
| 80 | + protected override void OnApplyTemplate() |
| 81 | + { |
| 82 | + base.OnApplyTemplate(); |
| 83 | + |
| 84 | + outlineFigure = GetTemplateChild(OutlineFigurePartName) as PathFigure; |
| 85 | + outlineArc = GetTemplateChild(OutlineArcPartName) as ArcSegment; |
| 86 | + barFigure = GetTemplateChild(BarFigurePartName) as PathFigure; |
| 87 | + barArc = GetTemplateChild(BarArcPartName) as ArcSegment; |
| 88 | + |
| 89 | + allTemplatePartsDefined = outlineFigure != null && outlineArc != null && barFigure != null && barArc != null; |
| 90 | + |
| 91 | + RenderAll(); |
| 92 | + } |
| 93 | + |
| 94 | + /// <summary> |
| 95 | + /// Gets or sets the thickness of the circular ouline and segment |
| 96 | + /// </summary> |
| 97 | + public double Thickness |
| 98 | + { |
| 99 | + get { return (double)GetValue(ThicknessProperty); } |
| 100 | + set { SetValue(ThicknessProperty, value); } |
| 101 | + } |
| 102 | + |
| 103 | + /// <summary> |
| 104 | + /// Identifies the Thickness dependency property |
| 105 | + /// </summary> |
| 106 | + public static readonly DependencyProperty ThicknessProperty = DependencyProperty.Register(nameof(Thickness), typeof(double), typeof(RadialProgressBar), new PropertyMetadata(0.0, ThicknessChangedHandler)); |
| 107 | + |
| 108 | + /// <summary> |
| 109 | + /// Gets or sets the color of the circular ouline on which the segment is drawn |
| 110 | + /// </summary> |
| 111 | + public Brush Outline |
| 112 | + { |
| 113 | + get { return (Brush)GetValue(OutlineProperty); } |
| 114 | + set { SetValue(OutlineProperty, value); } |
| 115 | + } |
| 116 | + |
| 117 | + /// <summary> |
| 118 | + /// Identifies the Outline dependency property |
| 119 | + /// </summary> |
| 120 | + public static readonly DependencyProperty OutlineProperty = DependencyProperty.Register(nameof(Outline), typeof(Brush), typeof(RadialProgressBar), new PropertyMetadata(new SolidColorBrush(Windows.UI.Colors.Transparent))); |
| 121 | + |
| 122 | + /// <summary> |
| 123 | + /// Initializes a new instance of the <see cref="RadialProgressBar"/> class. |
| 124 | + /// Create a default circular progress bar |
| 125 | + /// </summary> |
| 126 | + public RadialProgressBar() |
| 127 | + { |
| 128 | + DefaultStyleKey = typeof(RadialProgressBar); |
| 129 | + SizeChanged += SizeChangedHandler; |
| 130 | + } |
| 131 | + |
| 132 | + // Render outline and progress segment when thickness is changed |
| 133 | + private static void ThicknessChangedHandler(DependencyObject d, DependencyPropertyChangedEventArgs e) |
| 134 | + { |
| 135 | + var sender = d as RadialProgressBar; |
| 136 | + sender.RenderAll(); |
| 137 | + } |
| 138 | + |
| 139 | + // Render outline and progress segment when control is resized. |
| 140 | + private void SizeChangedHandler(object sender, SizeChangedEventArgs e) |
| 141 | + { |
| 142 | + var self = sender as RadialProgressBar; |
| 143 | + self.RenderAll(); |
| 144 | + } |
| 145 | + |
| 146 | + private double ComputeNormalizedRange() |
| 147 | + { |
| 148 | + var range = Maximum - Minimum; |
| 149 | + var delta = Value - Minimum; |
| 150 | + var output = range == 0.0 ? 0.0 : delta / range; |
| 151 | + output = Math.Min(Math.Max(0.0, output), 0.9999); |
| 152 | + return output; |
| 153 | + } |
| 154 | + |
| 155 | + // Compute size of ellipse so that the outer edge touches the bounding rectangle |
| 156 | + private Size ComputeEllipseSize() |
| 157 | + { |
| 158 | + var safeThickness = Math.Max(Thickness, 0.0); |
| 159 | + var width = Math.Max((ActualWidth - safeThickness) / 2.0, 0.0); |
| 160 | + var height = Math.Max((ActualHeight - safeThickness) / 2.0, 0.0); |
| 161 | + return new Size(width, height); |
| 162 | + } |
| 163 | + |
| 164 | + // Render the segment representing progress ratio. |
| 165 | + private void RenderSegment() |
| 166 | + { |
| 167 | + if (!allTemplatePartsDefined) |
| 168 | + { |
| 169 | + return; |
| 170 | + } |
| 171 | + |
| 172 | + var normalizedRange = ComputeNormalizedRange(); |
| 173 | + |
| 174 | + var angle = 2 * Math.PI * normalizedRange; |
| 175 | + var size = ComputeEllipseSize(); |
| 176 | + var translationFactor = Math.Max(Thickness / 2.0, 0.0); |
| 177 | + |
| 178 | + double x = (Math.Sin(angle) * size.Width) + size.Width + translationFactor; |
| 179 | + double y = (((Math.Cos(angle) * size.Height) - size.Height) * -1) + translationFactor; |
| 180 | + |
| 181 | + barArc.IsLargeArc = angle >= Math.PI; |
| 182 | + barArc.Point = new Point(x, y); |
| 183 | + } |
| 184 | + |
| 185 | + // Render the progress segment and the loop outline. Needs to run when control is resized or retemplated |
| 186 | + private void RenderAll() |
| 187 | + { |
| 188 | + if (!allTemplatePartsDefined) |
| 189 | + { |
| 190 | + return; |
| 191 | + } |
| 192 | + |
| 193 | + var size = ComputeEllipseSize(); |
| 194 | + var segmentWidth = size.Width; |
| 195 | + var translationFactor = Math.Max(Thickness / 2.0, 0.0); |
| 196 | + |
| 197 | + outlineFigure.StartPoint = barFigure.StartPoint = new Point(segmentWidth + translationFactor, translationFactor); |
| 198 | + outlineArc.Size = barArc.Size = new Size(segmentWidth, size.Height); |
| 199 | + outlineArc.Point = new Point(segmentWidth + translationFactor - 0.05, translationFactor); |
| 200 | + |
| 201 | + RenderSegment(); |
| 202 | + } |
| 203 | + } |
| 204 | +} |
0 commit comments