Slider and Spin Box

Using techniques and styles that I have already made, creating the slider elements was quite easy. At least it started off being easy. I first decided to have a displayed value on the right of the slider showing the percentage in an Editable Text Box, a default UE4 widget. After trying this, I realised how limiting it would be both in terms of functionality, and visually. The colour would have to change when the slider got past it as to not hide it, and I would have to make it so the user couldn't input strings, only numbers. So I scrapped that idea and designed a new slider:

This is simple, bold, and effective, and still suits the design theme. It's made up of a Progress Bar, a Slider, and a Spin Box as the functioning elements, there's also the two visual ones, those being the background rectangle and bottom line, an idea that persists through all my other elements. The slider doesn't go past the Spin Box, which leaves not only a space for users to know that they can edit the number in the Spin Box by clicking it, but also makes it so it can stay one colour and not have to change. I made most of the functionality in functions, like setting the Max and Min Values, so that I could change them easily in other widgets, but also because I needed to set multiple elements at once, so reusing the function node is faster and cleaner than the multiple nodes within the function. I wanted to allow variable maximum and minimum values in case there were settings that warranted having more or less than 1 or 0 respectively, so I created variables for them. The problem with that was the Progress Bar. I can't change the maximum value of that because it uses percentages, and a percent is always something out of 100, so I had to instead convert the current slider value into a percentage of the maximum value, which was a simple case of dividing the current value by the max value, and because it needs to be a decimal for the Progress Bar, I didn't need to multiply it by 100, and it works great.

Two problems were evident with this however:

1. Changing the minimum value to something other than 0 would break it completely

2. Larger numbers would cause inprecision in the float numbers, causing them to stop rounding

To fix the first issue, me and my brother (who incidentally does Computer Science at Oxford) sat down and worked out an equation for it, which is:

So now things like a FOV slider and such will work fine, except for the floating point indecision, which I sort of hacked. What I was using before was a simple rounding method or multiplying the float by 100, rounding it to the nearing whole number, then dividing it by 100 to get the output. This does work fine for smaller numbers, but larger numbers (like 50) go haywire. So as a workaround, I checked if the number was <10, and if it was, I used the rounding method from before, if it was 10 or more, I just made it a whole number and kept it at that. The larger numbers aren't going to need precise values like that anyway so it doesn't matter much at all. I also added a boolean to let me switch between these if I wanted to, which was helpful for things like volume levels compared to FOV sliders, which have two completely different values.