-
-
Notifications
You must be signed in to change notification settings - Fork 2.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Code Quality - Added StorageBar and StorageRing Controls #16001
base: main
Are you sure you want to change the base?
Conversation
This is a Primitive Shape based on a Path, which will be used by the Storage Ring control
It may need more tests added and other edge cases mitigated. This is not just adding the control, but refactored and refined.
Also ensured the control value updates as other values change with the control
Added ToDo notes to better handle the interpolation between 0% - 1% and 99% - 100%
I changed the interpolation to be based on percentage rather than value between min and max - this is consistent with the StorageBar's interpolation at the start and end. Storage Ring's track interpolation at the end is still done with value to angle conversions as the Angle is the best way to know when the start and end angles meet.
A final round of cleaning up or adding comments to parts of the controls can be done soon, but I wanted to get the functional code in after working on it on and off outside of the repo and adding it to the repo over the past week or so |
I have made Percent a non-protected DependencyProperty so you can do binding to it. That way any text label you wish to display the Percentage, will be able to bind to it. I have made it so changing the value externally does nothing, and it will update it again as the value changes. Also added a Percent TextBlock to the examples on the Testing Page
Added comments to those methods that were missing them
This is done now |
5acc4c7
to
8b3ab77
Compare
…into mdta-StorageControls
…into mdta-StorageControls
/// <summary> | ||
/// Updates the RingShape path | ||
/// </summary> | ||
private void UpdatePath() |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This method should be split into multiple smaller functions. Also, I think the comment is kind of redundant and can be left out.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I am breaking this up into smaller functions and updated comments
var result = number % divider; | ||
|
||
// Ensure the result is positive or zero | ||
result = result < 0 ? result + divider : result; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Technically, this only works if number > -divider
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@0x5bfa How do you suggest I change the method to ensure it works correctly?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If you're ensuring it be positive or zero, can't it be 'result < 0 ? 0 : result'?
//var easedT = EaseInOutFunction(t); | ||
var easedT = EaseOutCubic(t); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I assume one of those two lines with the accompanying functions will be cleaned up?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I was testing the two easing functions, we can remove the commented out one
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I will remove the comment, but keep the other easing method in case we can use it later. Unless you think we should remove the method even if it is unused in the short term?
/// <param name="minValue">The minimum value of the input range.</param> | ||
/// <param name="maxValue">The maximum value of the input range.</param> | ||
/// <returns>The percentage value (between 0 and 100).</returns> | ||
private double DoubleToPercentage(double value, double minValue, double maxValue) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think we should introduce a separate Math util file given we have multiple math "add-ons" across controls.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I will do this in a future commit. @0x5bfa If you can help me go through the various calculation methods, and separate them into their own code file, I would greatly appreciate it.
Resolving suggestions made by Marcel in code review
Resolved / Related Issues
This adds StorageBar and StorageRing controls to the Files.App.Controls project for future use, as well as a test page in the UITests app for testing behaviour.
I am no expert when it comes to coding let alone making Controls, so I would appreciate these be given a thorough review to ensure there are no edge cases I have not anticipated, as well as general changes to improve the code by those with the expertise and experience. I will call out @yaira2 and @0x5bfa who have been seeing my progress via Discord as I was working on them. But also anyone with control and or mathematics experience who can ensure I am using the most optimal calculations for the angles and size calculations. @marcelwgn has contributed to the Community Toolkit so will be able to make some comments on my properties and general code quality.
I also want to indicate I took great inspiration from the RadialGuage control in the Toolkit, as well as the blogposts and sample code from Diederik Krols and his blog posts.
As well as Co-Pilot for maths queries and interpolation code suggestions, here are other posts I found helpful